我尝试在JavaScript中将File
对象追加到FormData
对象,但是它不起作用,仅添加了一个空对象。如果我尝试附加键/值,则效果很好。
控制台中没有错误/警告消息。我激活了所有频道。
我从网络和MDN尝试示例。但是没有任何帮助。我不明白为什么?是否出于安全原因阻止了文件访问?
我正在使用Firefox 64.0或Chrome 71.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>
谢谢您的帮助
CachingFoX
答案 0 :(得分:1)
您的FormData
有文件,但未显示,因为JSON.stringify会将文件记录为空obj。
请使用它来记录您所有的表单数据
for (var pair of formData.entries()) {
console.log(pair[0]+ ', ' + pair[1]);
}