How to correctly receive ajax's post data?

Published 2 months ago by AlexanderKim

Here's ajax:

            $.upload = function(file) {
                let out = new FormData();
                out.append('file', file, file.name);

                $.ajax({
                    method: 'POST',
                    url: '/summer-uploads',
                    //check laravel document: https://laravel.com/docs/5.6/csrf#csrf-x-csrf-token
                    headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')},
                    contentType: false,
                    cache: false,
                    processData: false,
                    dataType: 'JSON',
                    data: out,
                    success: function(url) {
                        console.log(url);
                        $('#description').summernote('insertImage', url);
                    },
                    error: function(jqXHR, textStatus, errorThrown) {
                        console.error(textStatus + " " + errorThrown);
                    }
                });
            };

Controller:

    public function summerUploads(Request $request)
    {
        if ($request->ajax()) {
            $file = $request->input('file');

            return response()->json($file->path());
        }

        return App::abort(404);
    }

But i'm keep getting an error: "Call to a member function path() on null"

I guess, it's not getting the values from ajax's data? Because $file is null.

rin4ik
rin4ik
2 months ago (200,520 XP)

with this?

$file = $request->file('file');
 return response()->json($file->getRealPath());

to check if that file exists. you can dd and check what request contains inside controller

dd($request)
AlexanderKim

with this?

$file = $request->file('file');
 return response()->json($file->getRealPath());

It's obvious.

How can i check dd() output when i'm doing POST request with ajax?

Cronix
Cronix
2 months ago (730,880 XP)

In your browsers development tools network tab. It shows each request, what was sent with the request, the headers, and what was received back.

AlexanderKim

Seems like $request->input('file') is empty at all, any ideas?

rin4ik
rin4ik
2 months ago (200,520 XP)

@AlexanderKim if you visit that route in browser you will get get the output

Cronix
Cronix
2 months ago (730,880 XP)
$.upload = function(file) {

How are you passing file to this function? Show that code, along with your html for the form or file input.

_Artak_

upload.html

<input type='file' class="" id="inputId" name="logo"/>

upload.js


                var file = $('#inputId').files[0];
                var name =  $('#inputId').attr('name');
                formData.append(name, file);


    $.ajax({
        url: '/url/',
        type: 'POST',
        contentType: false,
        cache: false,
        processData: false, 
        dataType: 'json',
        data: formData,
    })
    .done(function(success) {
        console.log(error.statusText);
    })
    .fail(function(error) {     
        console.log(error.statusText);
    })
    .always(function(complete) {
        console.log(complete.statusText);
    });


upload.php


        if($request->hasFile('logo'))
        {
            $logo = $request->file('logo');
            # code. . .
        }


Please sign in or create an account to participate in this conversation.