Как передать файл через fetch на страницу php?

Question

[yura_born]

Надо со страницы передать json файл с использованием drag and drop на сервер, там его разобрать и вернуть текст файла на страницу.
Написал JS - вот последняя функция на отправку уже файла:

function uploadFile(file) {
      console.log(file);
      const url = './serv.php';
      const formData = new FormData();
      formData.append('file', file);
      fetch(url, {
        method: 'POST',
        body: formData
      })
      .then(() => {console.log('Загружено'); })
      .catch(() => { console.log('Ошибка');})
    }

Файл отправляется, вот сообщение из консоли:


В serv.php хочу посмотреть что приходит:

<?php
var_dump($_FILES);

И получаю: array(0) { }.

Answer 1

[alekssamos]

Больше примеров здесь
Может попробовать так:
formData.append('file', file[0]);

Answer 2

[Надим]

Замени строку, так как нужно третьим параметром передать еще и имя файла:
formData.append('file', file, file.name);

Comments

[yura_born]

Так у меня файл со страницы уходит, я так понимаю, я почему-то не вижу его на странице serv.php

[Надим]

yura_born, попробуй так:

async function uploadFile(file) {
	
	console.log('Отправка файла:');
	console.dir(file);
	
	var form_data = new FormData();
	form_data.append('file', file, file.name);
	
	var response = await (await fetch('https://yousite.ru/serv.php', {
		method: 'POST',
		body: form_data
	})).text();
	
	console.log("Ответ сервера:\n" + response);
	
}

В обработчике serv.php размести:

<?php

ini_set('error_reporting', E_ALL);
ini_set('display_errors', 1);
ini_set('display_startup_errors', 1);

header('Content-Type: text/plain; charset=UTF-8');

echo "Переменная \$_POST:\n\n";

print_r($_POST);

echo "\nПеременная \$_FILES:\n\n";

print_r($_FILES);

echo "\nПеременная \$_GET:\n\n";

print_r($_GET);