javascript — загрузка файлов с использованием js fileReader приводит к повреждению файлов

Я пытаюсь загрузить файл с помощью программы чтения файлов JS и AJAX на мой сервер.

я использовал FileAPI а также FileReader прочитать файл и преобразовать его в строку, а затем отправить его на сервер с помощью запроса AJAX.
Вот мой код js на стороне клиента:

function upload() {
var file = document.getElementById('periodExcel').files[0];
if (file) {
console.log(file);
var reader = new FileReader();
reader.readAsText(file, file.type);
console.log(reader);
reader.onload = uploadAndRun;
}
}
function uploadAndRun(event) {
console.log(event);
var result = event.target.result;
$('#js').html(result);
var fileName = document.getElementById('periodExcel').files[0].name; //Should be 'picture.jpg'

$.post('./upload.php', {data: result, name: fileName}, function(result2){
$('#php').html(result2);
});
}

Вот скрипт php для загрузки:

file_put_contents('upload/' . $_POST['name'], $_POST['data']);

это просто написать файл с помощью php file_put_contents функция.

Моя проблема в том, что загруженный файл поврежден и имеет размер, отличный от исходного файла (он больше).

Я пытался использовать php file_get_contents функция, чтобы прочитать тот же файл и записать его снова, используя file_put_contents и файл результатов был в порядке и такой же, как исходный.

Затем я попытался сравнить две строки (ту, которая исходит от программа для чтения файлов и тот, который исходит от file_get_contents ) и сравнивает две строки, используя strcmp, что дает мне, что строка, которая исходит от fileReader больше, чем один из file_get_contents,

Итак, в чем проблема с моим кодом и как использовать FileReader для загрузки файла таким образом при использовании readAsText функция.