Trouble with sending .zip file on server with fetch()

Question

I try to send my.zip file on server, this way:

function sendData(){
    let zipFile = document.getElementById('fileReciever').files[0];
    let formData = new FormData();

    formData.append('id', btoa('7804044924'));
    formData.append('data', zipFile);
    fetch('http://localhost/xmlReader/reciever.php', {method: "POST", body: formData});
}

but on server (php) in $_POST i getting only "id" field, "data" is absent. What i am doing wrong?

i try this way:

let zipFile = document.getElementById('fileReciever').files[0];
let formData = new FormData();

formData.append('id', btoa('7804044924'));
formData.append('data', zipFile);
//fetch('http://localhost/xmlReader/reciever.php', {method: "POST", body: formData});

let req = new XMLHttpRequest();
req.open("POST", 'http://localhost/xmlReader/reciever.php');
req.send(formData);

but result is same - on server in $_POST i getting only one field - "id", field "data" is absent.

Answer 1

If you want to catch the files you have to use $_FILES instead of $_POST.

Let's say you sent an image than you var_dump($_FILES), you will get an array content

• [Name]: the name (comes from the browser, so treat as tainted)
• [type] => image/jpeg (type of the file)
• [tmp_name] => /tmp/php/php1h4j1o (depending on your config settings, but the user has no control, so this isn't tainted)
• [error] => UPLOAD_ERR_OK (= 0)
• [size] => 123 (the size in bytes)

and so you get your file-data.

Here you find good examples like the one i used here.