javascript 使用formdata时如何在XMLHttpRequest中添加头数据？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/19661157/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to add header data in XMLHttpRequest when using formdata?
提问by Rajdeep Siddhapura
I'm trying to implement a file upload API, given here :
Mediafire file Upload
我正在尝试实现文件上传 API，如下所示：
Mediafire 文件上传
I am successfully able to upload the Post data& Get data, but have no clue how to send the x-filenameattribute, which is meant to be Header dataas given in API guide.
我能够成功上传Post data& Get data，但不知道如何发送x-filename属性，它是API 指南中给出的标题数据。
My Code :
我的代码：
xmlhttp=new XMLHttpRequest();
var formData = new FormData();
formData.append("Filedata", document.getElementById("myFile").files[0]);
var photoId = getCookie("user");
// formData.append("x-filename", photoId); //tried this but doesn't work
// xmlhttp.setRequestHeader("x-filename", photoId); //tried this too (gives error) [edited after diodeous' answer]
xmlhttp.onreadystatechange=function()
{
alert("xhr status : "+xmlhttp.readyState);
}
var url = "http://www.mediafire.com/api/upload/upload.php?"+"session_token="+getCookie("mSession")+"&action_on_duplicate=keep";
xmlhttp.open("POST", url);
// xmlhttp.setRequestHeader("x-filename", photoId); //tried this too, doesnt work. Infact nothing gets uploaded on mediafire. [edited after apsillers' answer]
// cant get response due to same origin policy
xmlhttp.send(formData);
回答by apsillers
Your error
你的错误
InvalidStateError: An attempt was made to use an object that is not, or is no longer, usable
InvalidStateError: 尝试使用不可用或不再可用的对象
appears because you must call setRequestHeaderaftercalling open. Simply move your setRequestHeaderline below your openline (but before send):
出现是因为您必须在调用setRequestHeader后调用open。只需将您的setRequestHeader线移动到您的线下方open（但在 之前send）：
xmlhttp.open("POST", url);
xmlhttp.setRequestHeader("x-filename", photoId);
xmlhttp.send(formData);
回答by Diodeus - James MacFarlane
Use: xmlhttp.setRequestHeader(key, value);
利用： xmlhttp.setRequestHeader(key, value);
回答by Broper
Check to see if the key-value pair is actually showing up in the request:
检查键值对是否实际出现在请求中：
In Chrome, found somewhere like: F12: Developer Tools > Network Tab > Whatever request you have sent > "view source" under Response Headers
在Chrome 中，找到类似的地方：F12: Developer Tools > Network Tab > Whatever request you have sent > "view source" under Response Headers
Depending on your testing workflow, if whatever pair you added isn't there, you may just need to clear your browser cache. To verify that your browser is using your most up-to-date code, you can check the page's sources, in Chromethis is found somewhere like:
F12: Developer Tools > Sources Tab > YourJavascriptSrc.jsand check your code.
根据您的测试工作流程，如果您添加的任何一对都不存在，您可能只需要清除浏览器缓存。要验证您的浏览器使用的是最新的代码，您可以检查页面的源代码，在Chrome 中可以找到以下位置：
F12: Developer Tools > Sources Tab > YourJavascriptSrc.js并检查您的代码。
But as other answers have said:
但正如其他答案所说：
xhttp.setRequestHeader(key, value);
should add a key-value pair to your request header, just make sure to place it after your open()and before your send()
应该在您的请求标头中添加一个键值对，只需确保将其放在您的之后open()和之前send()
