Я пытаюсь добавить объект File
к объекту FormData
в JavaScript, но он не работает, и добавляется только пустой объект. Если я пытаюсь добавить ключ / значение, он работает нормально.
В консоли нет сообщения об ошибке / предупреждения. Я активировал все каналы.
Я пробую примеры из Интернета и из MDN. Но ничего не помогает. Я не понимаю почему? Доступ к файлам заблокирован по соображениям безопасности?
Я использую Firefox 64.0 или Chrome 71.0. В настоящее время пример не содержит связи клиент-сервер. Но я попробовал это двумя способами: в качестве локального файла и страницы, загруженной с веб-сервера.
Основой для моего вопроса является то, что я хотел бы загрузить файлы с 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