Как загрузить файл с помощью jQuery ajax в php или symfony

Отправить файл традиционным способом — это своего рода простая задача (форма, ввод файла и кнопка отправки). Однако это не так просто, когда мы хотим сделать это с помощью JavaScript, и это не так интуитивно понятно. Для выполнения этой задачи нам понадобится jQuery (или использовать функцию xmlHttpRequest) и терпение.

HTML-форма должна выглядеть следующим образом: простой ввод файла (параметры текста являются необязательными, служит только для доказательства того, что мы можем отправлять больше информации, а не только файл).

Чтобы отправить файл с помощью AJAX, вам нужно отправить запрос AJAX, отправляющий данные POST, следующий код поможет вам:

Примечание: в этом примере мы ожидаем от сервера json (dataType: json), вы можете отправить свой собственный тип ответа.

var form = document.getElementById("myform");
// or with jQuery
//var form = $("#myform")[0];
$.ajax({
url:"/web-service/that/will-process/our-image",
data: new FormData(form),// the formData function is available in almost all new browsers.
type:"post",
contentType:false,
processData:false,
cache:false,
dataType:"json", // Change this according to your response from the server.
error:function(err){
console.error(err);
},
success:function(data){
console.log(data);
},
complete:function(){
console.log("Request finished.");
}
});

Переменная форма будет элементом узла формы. Тогда нам просто нужно получить файл в бэкэнде.

Symfony 2

Мы получим файл с объектом запроса контроллера. Затем мы переместим его и вернем ответ JSON.

// Important to use these statemenets, the json response is optional for our response.
use Symfony\Component\HttpFoundation\Request;
use Symfony\Component\HttpFoundation\JsonResponse;
public function retrieveAction(Request $request){
// retrieve the file with the name given in the form.
// do var_dump($request->files->all()); if you need to know if the file is being uploaded.
$file = $request->files->get('upload');
$status = array('status' => "success","fileUploaded" => false);
// If a file was uploaded
if(!is_null($file)){
// generate a random name for the file but keep the extension
$filename = uniqid().".".$file->getClientOriginalExtension();
$path = "/path/where/we/want-to-save-the-file";
$file->move($path,$filename); // move the file to a path
$status = array('status' => "success","fileUploaded" => true);
}
return new JsonResponse($status);
}

Простой PHP

$info = pathinfo($_FILES['upload']['name']);
$ext = $info['extension']; // get the extension of the file
$newname = "thenamethat you want.".$ext;
$target = 'path-where-to-save-the-file/'.$newname;
move_uploaded_file( $_FILES['upload']['tmp_name'], $target);

Вы можете настроить бэкэнд в соответствии со своими потребностями (например, если вы не используете php), получайте удовольствие!