javascript - 使用 axios 从 vue 上传一个 XML 文件到 asp .net core

Question

我正在努力将带有 axios 的 xml 文件上传到我的 asp .net 服务器。我正在使用 vue 端的以下代码来获取一个 xml 文件，该文件正在工作，然后将其上传到我的服务器:

uploadXmlFile(file: any) {
    const rawFile = new XMLHttpRequest();
    rawFile.open('GET', file, false);
    rawFile.onreadystatechange = () => {
        if (rawFile.readyState === 4) {
            if (rawFile.status === 200 || rawFile.status === 0) {
                const allText = rawFile.responseText;

                axios.post(`${url}`, rawFile, {
                headers: {
                    'Content-Type': 'application/xml',
                    'Accept-Language': 'application/xml',
                },
                });
            }
        }
    };
    rawFile.send(null);
}

在 asp .net 方面，我得到了这个功能:

[HttpPost]
public IActionResult Post(object xml)
{
    // Do something with the xml
    ...
}

上传文件会导致代码 415:不支持的媒体类型。
我发现了一些将 xml 格式化程序添加到我的项目的建议，但这些建议不起作用，而且我不想解析 xml 文件，我只想将文件保存到我的文件系统中。
我尝试结合不同的媒体类型上传 rawFile 和解析的文本，例如文本/纯文本、文本/xml 和应用程序/xml
我也尝试添加接受语言
我还尝试使用此函数标题从微软文档中提出的方法: public async Task<IActionResult> OnPostUploadAsync(List<IFormFile> files)我试图用 Postman 调试这个，上传一个简单的图像，这给了我同样的错误。

Answer 1

如果你这样写后端，它总是会尝试将内容序列化为 JSON，因为默认的序列化器。如果您发送内容类型 XML，它将不知道如何将您的 XML 反序列化为一个对象。
这是我们通常处理文件上传的方式:

[HttpPost]
public async Task<IActionResult> ReceiveFileUpload(CancellationToken cancellationToken = default(CancellationToken))
{
    var contentType = Request.ContentType; // Or HttpContext.Request
    var stream = Request.Body; // Or HttpContext.Request
    // Process file stream in whatever way, e.g. XmlDocument.Load(stream);
}

这至少应该使它在例如 postman 。
您的 axios 客户端看起来几乎没问题，需要注意以下几点:

您可能想发布 alltext ，不是 rawFile

你应该删除 'Accept-Language': 'application/xml'

我们通常使用 FileReader 来获取文件，不太确定您在做什么以及是否正确。

            axios.post(url, content, {
                headers: {
                    "Content-Type": "application/xml"
                }
            })

<input type='file' accept='text/plain' onchange='openFile(event)'>

var openFile = function(event) {
    var input = event.target;
    var text = "";
    var reader = new FileReader();
    var onload = function(event) {
        text = reader.result;
        console.log(text);

    };

    reader.onload = onload;
    reader.readAsText(input.files[0]);

};

( https://codepen.io/mlasater9/pen/jqQdOM/ )