Загрузить изображение с помощью Ajax и PHP

Я хочу загрузить изображение на свой сервер и управлять эхом PHP в своем HTML-коде. Для этого я хочу использовать jQuery Ajax, но я не знаю, как отправить изображение с Ajax на PHP. Это проект для колледжа, поэтому я не могу использовать какой-либо плагин.

Мой фактический код:

HTML

<form action="upload_file.php" method="post" enctype="multipart/form-data"> <label for="file">Filename:</label> <input type="file" name="file" id="file"><br> <input type="submit" name="submit" value="Submit"> </form> 

Prueba.php

 define('MB', 1048576); $allowedExts = array("gif", "jpeg", "jpg", "png"); $temp = explode(".", $_FILES["file"]["name"]); $extension = end($temp); if ((($_FILES["file"]["type"] == "image/gif") || ($_FILES["file"]["type"] == "image/jpeg") || ($_FILES["file"]["type"] == "image/jpg") || ($_FILES["file"]["type"] == "image/pjpeg") || ($_FILES["file"]["type"] == "image/x-png") || ($_FILES["file"]["type"] == "image/png")) && ($_FILES["file"]["size"] < 1*MB) && in_array($extension, $allowedExts)) { if ($_FILES["file"]["error"] > 0) { echo "Return Code: " . $_FILES["file"]["error"] . "<br>"; } else { echo "Upload: " . $_FILES["file"]["name"] . "<br>"; echo "Type: " . $_FILES["file"]["type"] . "<br>"; echo "Size: " . ($_FILES["file"]["size"] / 1024) . " kB<br>"; echo "Temp file: " . $_FILES["file"]["tmp_name"] . "<br>"; if (file_exists("../public/images/productos/" . $_FILES["file"]["name"])) { echo $_FILES["file"]["name"] . " already exists. "; } else { move_uploaded_file($_FILES["file"]["tmp_name"], "../public/images/productos/" . $_FILES["file"]["name"]); echo "Stored in: " . "../public/images/productos/" . $_FILES["file"]["name"]; } } } else { echo "Invalid file"; } 

Я хочу использовать некоторые подобные …

JS

 $(".form").submit(function(){ $.ajax({ url: 'core/ctrlAdmin.php?prodInBD', type: 'POST', async: false, data: ???? success: function(respuesta){ /* RECIVE HERE THE PHP ECHO */ } }); });