AJAX call in Laravel returns Http Exception

Question

When I tried to use ajax in laravel it shows the following error,

{ "message": "", "exception": "Symfony\Component\HttpKernel\Exception\HttpException", "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Exceptions\Handler.php", "line": 203, "trace": [ { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Exceptions\Handler.php", "line": 175, "function": "prepareException", "class": "Illuminate\Foundation\Exceptions\Handler", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\app\Exceptions\Handler.php", "line": 49, "function": "render", "class": "Illuminate\Foundation\Exceptions\Handler", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 83, "function": "render", "class": "App\Exceptions\Handler", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 55, "function": "handleException", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\View\Middleware\ShareErrorsFromSession.php", "line": 49, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\View\Middleware\ShareErrorsFromSession", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Session\Middleware\StartSession.php", "line": 63, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Session\Middleware\StartSession", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse.php", "line": 37, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Cookie\Middleware\AddQueuedCookiesToResponse", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Cookie\Middleware\EncryptCookies.php", "line": 59, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Cookie\Middleware\EncryptCookies", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 104, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Router.php", "line": 667, "function": "then", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Router.php", "line": 642, "function": "runRouteWithinStack", "class": "Illuminate\Routing\Router", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Router.php", "line": 608, "function": "runRoute", "class": "Illuminate\Routing\Router", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Router.php", "line": 597, "function": "dispatchToRoute", "class": "Illuminate\Routing\Router", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Kernel.php", "line": 176, "function": "dispatch", "class": "Illuminate\Routing\Router", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 30, "function": "Illuminate\Foundation\Http\{closure}", "class": "Illuminate\Foundation\Http\Kernel", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\fideloper\proxy\src\TrustProxies.php", "line": 57, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Fideloper\Proxy\TrustProxies", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Middleware\TransformsRequest.php", "line": 31, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Foundation\Http\Middleware\TransformsRequest", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Middleware\TransformsRequest.php", "line": 31, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Foundation\Http\Middleware\TransformsRequest", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Middleware\ValidatePostSize.php", "line": 27, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Foundation\Http\Middleware\ValidatePostSize", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode.php", "line": 62, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 151, "function": "handle", "class": "Illuminate\Foundation\Http\Middleware\CheckForMaintenanceMode", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Routing\Pipeline.php", "line": 53, "function": "Illuminate\Pipeline\{closure}", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Pipeline\Pipeline.php", "line": 104, "function": "Illuminate\Routing\{closure}", "class": "Illuminate\Routing\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Kernel.php", "line": 151, "function": "then", "class": "Illuminate\Pipeline\Pipeline", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\vendor\laravel\framework\src\Illuminate\Foundation\Http\Kernel.php", "line": 116, "function": "sendRequestThroughRouter", "class": "Illuminate\Foundation\Http\Kernel", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\public\index.php", "line": 55, "function": "handle", "class": "Illuminate\Foundation\Http\Kernel", "type": "->" }, { "file": "C:\xampp\htdocs\TravelAssistant\server.php", "line": 21, "function": "require_once" } ] }

My controller code is,

public function getPublicAttraction(Request $request)
    {
        return response(['msg'=>'success']);
    }

The ajax call,

<script>
    function getAttraction()
    {

        var pass= {'_token':$('meta[name="csrf-token"]').attr('content')

    };
    $.ajax({
            type:'POST',
            url:'{{route("Attractions")}}',
            datatype:'json',
            data: pass,
            success:function(data){
                $("#public_attractions").html(data.msg);
            }
        }).fail(function(jqXHR, textStatus, error){
            $("#public_attractions").html(jqXHR.responseText);
        });


    }
    $(document).ready(function(){
         getAttraction();
    });
</script>

meta tag with csrf token,

<meta name="csrf-token" content="!!{csrf_token()}!!">

the route file web.php entry,

Route::post('/getAttractions','AjaxController@getPublicAttraction')->name('Attractions');

I think I am stuck, please help.

Answer 1

Why you reinvent something which is working fine.

1st Token in blade should look like this: (you have additional !! for what ever reason)

<meta name="csrf-token" content="{{ csrf_token() }}">

2nd Put this code somewhere in the master blade:

$.ajaxSetup({
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
});

Source https://laravel.com/docs/5.7/csrf#csrf-x-csrf-token

Answer 2

Ok, everything looks fine except the way that the CSRF meta tag, Because you don't need to escape anything in the csrf token, so the correct way to print the token will be: <!-- CSRF Token --> <meta name="csrf-token" content="{{ csrf_token() }}"> This is the best guess i cant give you, because you do not provide what are the HTTP status of the response, neither which situation the exception is thrown, The exception message is also empty so ..