Javascript append（）不'；我不能处理文件_Javascript_Ajax_File_Form Data

Javascript append（）不'；我不能处理文件

javascript ajax file

Javascript append（）不'；我不能处理文件,javascript,ajax,file,form-data,Javascript,Ajax,File,Form Data,我尝试将文件对象附加到JavaScript中的FormData对象，但它不起作用，只添加了一个空对象。如果我尝试附加一个键/值，它可以正常工作控制台中没有错误/警告消息。我启动了所有频道我尝试了来自web和MDN的示例。但没有任何帮助。我不明白为什么？文件访问是否因安全原因而被阻止我正在使用Firefox64.0或Chrome71.0。目前，该示例不包含任何客户机-服务器通信。但我尝试了两种方式：作为本地文件和从web服务器加载的页面我的问题的背景是，我想将脚本中带有XmlHttpReq

我尝试将

文件

对象附加到JavaScript中的

FormData

对象，但它不起作用，只添加了一个空对象。如果我尝试附加一个键/值，它可以正常工作

控制台中没有错误/警告消息。我启动了所有频道

我尝试了来自web和MDN的示例。但没有任何帮助。我不明白为什么？文件访问是否因安全原因而被阻止

我正在使用Firefox64.0或Chrome71.0。目前，该示例不包含任何客户机-服务器通信。但我尝试了两种方式：作为本地文件和从web服务器加载的页面

我的问题的背景是，我想将脚本中带有XmlHttpRequest的文件上载到服务器

控制台

File(234321) {name: "refresh2.gpx", lastModified: 1503041677210,
              lastModifiedDate: Fri Aug 18 2017 09:34:37 GMT+0200 (...),
              webkitRelativePath: "", size: 234321, …}

{"key":"value","userfile":{}}

HTML正文

<body>
<form id="file-form" action="handler.php" method="POST">
  <input type="file" id="file-select" />
  <button type="submit" id="upload-button">Upload</button>
</form>
</body>


上传

脚本

<script>
document.getElementById('file-form').onsubmit = function(event) {
    event.preventDefault();

    // Get the selected files from the input.
    var files = document.getElementById('file-select').files;

    // Create a new FormData object.
    var formData = new FormData();
    console.log(files[0]);
    formData.append("key", "value");
    formData.append("userfile", files[0]);

    // dump formData object
    var object = {};
    formData.forEach(function(value, key){
        object[key] = value;
    });
    var json = JSON.stringify(object);
    console.log(json);

    // xmlhttprequest part comes here....
}
</script>
</html>


document.getElementById（'file-form'）.onsubmit=函数（事件）{
event.preventDefault（）；
//从输入中获取所选文件。
var files=document.getElementById（'file-select'）.files；
//创建一个新的FormData对象。
var formData=new formData（）；
console.log（文件[0]）；
formData.append（“键”、“值”）；
append（“userfile”，files[0]）；
//转储formData对象
var对象={}；
forEach（函数（值、键）{
对象[键]=值；
});
var json=json.stringify（对象）；
log（json）；
//xmlhttprequest部分出现在这里。。。。
}

谢谢你的帮助

CachingFoX

您的

表单数据

包含该文件，但未显示该文件，因为JSON.stringify会将该文件记录为空对象

请使用此选项记录所有表单数据

for (var pair of formData.entries()) {
    console.log(pair[0]+ ', ' + pair[1]); 
}

谢谢你的回答。这对我帮助很大。