在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递

Changing filename in BlobBuilder to be passed as FormData on XHR(在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递)
本文介绍了在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着跟版网的小编来一起学习吧!

问题描述

限时送ChatGPT账号..

我目前正在尝试将 ArrayBuffer 上传到服务器(我无法更改),该服务器期望我上传的文件采用 multipart/form-data 格式.服务器从 Content-Disposition 部分中提取将被保存的 filename 并在 Content-type 下提取服务时将使用的 MIME 类型文件.目前,我已成功上传文件:

I'm currently trying to upload an ArrayBuffer to a server (which i can't change) that expects the file i'm uploading on a multipart/form-data format. The server extracts from the Content-Disposition part the filename that will be saved and under Content-type the MIME type which will be used when serving the file. Currently, i'm succesful on uploading the file with:

var xhr = new XMLHttpRequest();
var fdata = new FormData();
var bb;

if (WebKitBlobBuilder) {
    bb = new WebKitBlobBuilder();
} else if (MozBlobBuilder) {
    bb = new MozBlobBuilder();
} else if (BlobBuilder) {
    bb = new BlobBuilder();
}

bb.append(obj.array);

fdata.append('file', bb.getBlob("application/octet-stream"));

xhr.open("POST", url, true);
xhr.send(fdata);

但标头是按照浏览器的喜好发送的,例如在 Chrome 上:

But the headers are sent as the browser likes, on Chrome for example:

Content-Disposition: form-data; name="file"; filename="blob"
Content-Type: application/octet-stream;

我曾考虑使用 FileWriter API 将其保存到临时文件中,然后上传,但这是不对的.

I've contemplated saving it to a temporary file with FileWriter API and then upload it, but that just isn't right.

回答时要考虑:

  • 服务器无法修改,我也不愿意选择其他服务器提供商.
  • 它必须至少在 Firefox 和 Chrome 上运行(我的应用已经仅限于这两种浏览器).

推荐答案

刚刚自己解决了,感谢 Chromium 问题指出 w3c 标准草案的答案 XMLHttpRequest.基本上我应该改变:

Just solved it myself, thanks to a Chromium issue pointing me to the answer on w3c standard draft XMLHttpRequest. Basically i should change:

fdata.append('file', bb.getBlob("application/octet-stream"));

到:

fdata.append('file', bb.getBlob("application/octet-stream"), obj.filename);

它给出了想要的结果.

这篇关于在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持跟版网!

本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益,请联系我们,我们会在确认后第一时间进行删除!

相关文档推荐

SCRIPT5: Access is denied in IE9 on xmlhttprequest(SCRIPT5:在 IE9 中对 xmlhttprequest 的访问被拒绝)
XMLHttpRequest module not defined/found(XMLHttpRequest 模块未定义/未找到)
Show a progress bar for downloading files using XHR2/AJAX(显示使用 XHR2/AJAX 下载文件的进度条)
How can I open a JSON file in JavaScript without jQuery?(如何在没有 jQuery 的情况下在 JavaScript 中打开 JSON 文件?)
How do I get the HTTP status code with jQuery?(如何使用 jQuery 获取 HTTP 状态码?)
quot;Origin null is not allowed by Access-Control-Allow-Originquot; in Chrome. Why?(“Access-Control-Allow-Origin 不允许 Origin null在铬.为什么?)