Changing filename in BlobBuilder to be passed as FormData on XHR(在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递)
问题描述
我目前正在尝试将 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 传递的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持编程学习网!
本文标题为:在 BlobBuilder 中更改文件名以作为 XHR 上的 FormData 传递
基础教程推荐
- Chart.js 在线性图表上拖动点 2022-01-01
- 我可以在浏览器中与Babel一起使用ES模块,而不捆绑我的代码吗? 2022-01-01
- 如何使用TypeScrip将固定承诺数组中的项设置为可选 2022-01-01
- html表格如何通过更改悬停边框来突出显示列? 2022-01-01
- Electron 将 Node.js 和 Chromium 上下文结合起来意味着 2022-01-01
- 用于 Twitter 小部件宽度的 HTML/CSS 2022-01-01
- 自定义 XMLHttpRequest.prototype.open 2022-01-01
- 直接将值设置为滑块 2022-01-01
- 如何使用JIT在顺风css中使用布局变体? 2022-01-01
- Vue 3 – <过渡>渲染不能动画的非元素根节点 2022-01-01