Как отправить изображение в Symfony Controller с помощью AJAX?

Question

Я отправил обрезанные изображения на контроллеры Symfony с AJAX с использованием Symfony 3, однако я не могу добиться того же с помощью веб-пакета Symfony 4.Я достиг этого ранее, используя метод on('change'), однако, вместе с on('click) и on('submit'), похоже, не работает.

Мой код указан ниже:

JavaScript app.js

 Routing.setRoutingData(Routes)
 var routeUrl = Routing.generate('getImage');
 .....................

 $('#upload_btn').on('click', function(){

            var block = getResponse.split(";");
            // Get the content type
            var contentType = block[0].split(":")[1];// In this case "image/gif"
            // get the real base64 content of the file
            var realData = block[1].split(",")[1];// In this case "iVBORw0KGg...."

            // Convert to blob
            var blob = b64toBlob(realData, contentType);

                    let formData = new FormData(form);
                    formData.append('image_path', blob);
                    $.ajax({
                    url: routeUrl,
                    method: 'POST',
                    data:  formdata,
                    contentType: false,
                    cache: false,
                    processData:false,
                    headers: {'X-Requested-With':'XMLHttpRequest'},
                    success:  function(data){

                                  $("#previewImg").attr('src', getResponse);
                }
          });
    });

Symfony Controller

    /**
* @Route("/getImage", name="getImage", methods={"POST"}, options={"expose"=true})
 * @param Request $request
 * @return JsonResponse
 * @Cache(vary={"X-Requested-With"})
*/

public function gteImageAjax(Request $request){


    if($request->isXmlHttpRequest()){

        $event = new Members();

        $form = $this->createForm(EventType::class, $event);
        $form->handleRequest($request);
        /** @var Symfony\Component\HttpFoundation\File\UploadedFile $file */
       // $file = $request->get('image');
        $file = $request->files->get('image_path');

       // $file = new UploadedFile($file['tmp_name'], $file['name'], $file['type']);

        $filename = md5(uniqid()).'.'.$file->guessExtension();

        $file->move($this->getParameter('image_directory'), $filename);

        $event->setImage($filename);  
        $em = $this->getDoctrine()->getManager(); 
        $em->persist($event);

        $em->flush();

        return $this->redirectToRoute('createEvent');
    }

    return new JsonResponse("This is not Ajax");
 }

Чтобы уточнить, я хочу отправить обрезанное изображениена мой контроллер Symfony, используя AJAX.Любая помощь будет оценена.

Answer 1

Передайте форму FormData, указав данные или нет

// whole form    
let formData: new FormData($(form)[0]);

//specifying
var formData = new FormData();
formData.append('category', 'general');

// file
var blob = $('input[type=file]')[0].files[0]);
formData.append('image_path', blob);

//send the request via AJax
$.ajax({
    url: routeUrl,
    data: formData,
    type: 'POST',
    contentType: false, // requires jQuery 1.6+
    processData: false, // required
    cache: false,
    success:  function(data){

    $("#previewImg").attr('src', getResponse);
    }
});

У вас все хорошо, просто проверьте свои var formData в своем запросе ajax, вы объявляете formData и отправляете formdata

изменить это

data:  formdata,

на это

data: formData,