Как отправить переменную javascript на PHP-сервер как $ _FILE

У нас есть PHP-код на сервере, который получает файлы в $ _FILE, а затем сохраняет их на основе соображений пользователя / безопасности.

На клиенте мы можем отправить файл на сервер как есть или мы хотели бы обработать файл локально (в памяти в js в браузере), а затем доставить файл на сервер. Мы можем отправить обработанный файл на сервер с помощью JSON, однако есть проблемы с этим.

Мы предпочли бы отправить содержимое переменной javascript клиента на сервер, который будет получен в $ _FILE. (Мы не можем предположить, что клиент будет иметь возможность сохранять файл локально.) Нужно ли нам как-то подражать представлению FORM?

Как отправить переменную javascript, которая будет получена как PHP $ _FILE?

Благодаря!

UPDATE Blob определенно представляется правильным направлением, но мы замечаем, что размер Blob выходит на 50% больше, чем файл, который поступает к нему. Файл в $ _FILE также на 50% больше. Мы попытались переопределить тип файла при создании Blob, основываясь на других сообщениях, таких как BlobBuilder разрушает двоичные данные , однако он не зафиксировал увеличение на 50%. Мы устанавливаем тип файла Blob на основе типа файла перетаскивания, который мы получаем. Например, мы загружаем файл PDF 900K. Тип был чем-то вроде «application / pdf». Получившийся blob был как 1400K. Также пробовал с PNG.

Если клиент поддерживает Blob и XHR2 ( FormData ), значит, вы золото. Предполагая, что ваши данные хранятся в строковых data , все, что вам нужно сделать, это

 // Set the file media type appropriately var blob = new Blob([ data ], { type: "image/png" }); var formData = new FormData(); formData.append("theFile", blob, "filename.png"); var xhr = new XMLHttpRequest(); xhr.open("POST", "/destination"); xhr.send(formData); xhr.onload = function() { // ... }; 

UPDATE : если ваш клиент не поддерживает XHR2, есть способ отправить файлы только с помощью AJAX, хотя это немного сложно .

В принципе, вы должны подражать запросу multipart / form-data и вручную создавать части тела запроса. Не очень просто, но возможно, и должен работать с IE6-9.

У меня была аналогичная проблема, и я заметил, что мне не удалось отправить файл на PHP через глобальный $ _FILE , но мы можем сделать то же самое с $ _SERVER ['HTTP_X_FILENAME'] . Я написал следующую JS-функцию.

 function UploadFile(file) { var xhr = new XMLHttpRequest(); if (xhr.upload && file.size <= $id("MAX_FILE_SIZE").value) { // start upload xhr.open("POST", $id("upload").action, true); xhr.setRequestHeader("X-FILENAME", file.name); xhr.onload = function(e) { if (this.status == 200) { ... Some processing script for returning messages } }; xhr.send(file); } } 

На стороне PHP для доступа к файлу используйте следующее:

 $fn = (isset($_SERVER['HTTP_X_FILENAME']) ? $_SERVER['HTTP_X_FILENAME'] : false); if ($fn) { $file = "desired location/" . $fn; file_put_contents($file,file_get_contents('php://input')); } 

Вам необходимо передать переменную JS в функцию UploadFile и написать обработчик для возвращаемых данных.

Чтобы выполнить ответ MaxArt

Код для получения данных в Php:

 $file = $_POST['theFile'];//sent from javascript $filePath = "/your_destination_directory/filename.ext"; if(file_put_contents($filePath,$file)) { //OK }else{ //ERROR } 

Если вы используете jQuery на стороне клиента, то JQuery Form Plugin также является хорошим вариантом для загрузки файлов через Ajax, и вы легко получите $_FILE через PHP. Этот плагин также имеет некоторые дополнительные функции для отображения прогресса при загрузке файла.

Вот демонстрация плагина: http://malsup.com/jquery/form/progress3.html