Laravel 5.5 Ajax Call 419 (unbekannter Status)

Ich mache einen Ajax-Anruf, erhalte aber immer wieder den folgenden Fehler:

419 (unbekannter Status)

Keine Ahnung, was dies verursacht. Ich habe in anderen Posts gesehen, dass es etwas mit dem CSRF-Token zu tun hat, aber ich habe kein Formular, daher weiß ich nicht, wie ich das beheben soll.

Mein Anruf:

$('.company-selector li > a').click(function(e) {
     e.preventDefault();

     var companyId = $(this).data("company-id");


      $.ajax({
          headers: {
          'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
          },
          url: '/fetch-company/' + companyId,
          dataType : 'json',
          type: 'POST',
          data: {},
          contentType: false,
          processData: false,
          success:function(response) {
               console.log(response);
          }
     });
  });

Meine Route:

Route::post('fetch-company/{companyId}', 'HomeController@fetchCompany');

Meine Controller-Methode

/**
 * Fetches a company
 *
 * @param $companyId
 *
 * @return array
 */
public function fetchCompany($companyId)
{
    $company = Company::where('id', $companyId)->first();

    return response()->json($company);
}

Das ultimative Ziel ist es, etwas aus der Antwort in einem HTML-Element anzuzeigen.

Verwenden Sie dies im Kopfbereich:

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

und erhalte das csrf-Token in Ajax:

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

Bitte beziehen Sie sich auf die Laravel-Dokumentation csrf_token

Eine andere Möglichkeit, dies zu beheben, besteht darin, das _tokenFeld in Ajax-Daten zu verwenden und den Wert {{csrf_token()}}in Blade festzulegen. Hier ist ein Arbeitscode, den ich gerade an meinem Ende ausprobiert habe.

$.ajax({
    type: "POST",
    url: '/your_url',
    data: { somefield: "Some field value", _token: '{{csrf_token()}}' },
    success: function (data) {
       console.log(data);
    },
    error: function (data, textStatus, errorThrown) {
        console.log(data);

    },
});

Dies ähnelt Kannans Antwort. Dies behebt jedoch ein Problem, bei dem das Token nicht an domänenübergreifende Sites gesendet werden sollte. Dadurch wird der Header nur festgelegt, wenn es sich um eine lokale Anforderung handelt.

HTML:

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

JS:

$.ajaxSetup({
    beforeSend: function(xhr, type) {
        if (!type.crossDomain) {
            xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'));
        }
    },
});

Verwenden Sie dies auf Ihrer Seite

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

und in Ihrem Ajax verwendet es in Daten:

_token: '{!! csrf_token() !!}',

das ist:

$.ajax({
          url: '/fetch-company/' + companyId,
          dataType : 'json',
          type: 'POST',
          data: {
                   _token: '{!! csrf_token() !!}',
                 },
          contentType: false,
          processData: false,
          success:function(response) {
               console.log(response);
          }
     });

Vielen Dank.

Möglicherweise stimmt Ihre Sitzungsdomäne nicht mit Ihrer App-URL und / oder dem Host überein, der für den Zugriff auf die Anwendung verwendet wird.

1.) Überprüfen Sie Ihre .env-Datei:

SESSION_DOMAIN=example.com
APP_URL=example.com

2.) Überprüfen Sie config / session.php

Überprüfen Sie die Werte, um sicherzustellen, dass sie korrekt sind.

Wenn Sie die obigen Vorschläge bereits gemacht haben und das Problem immer noch haben.

Stellen Sie sicher, dass die env-Variable:

SESSION_SECURE_COOKIE

Wird auf gesetzt, false wenn Sie kein SSL-Zertifikat haben, wie auf lokal.

In meinem Fall habe ich vergessen, dem übermittelten Formular die Eingabe csrf_token hinzuzufügen. Also habe ich diesen HTML-Code erstellt:

<form class="form-material" id="myform">
...
<input type="file" name="l_img" id="l_img">
<input type="hidden" id="_token" value="{{ csrf_token() }}">
..
</form>

JS:

//setting containers
        var _token = $('input#_token').val();
        var l_img = $('input#l_img').val();
        var formData = new FormData();
        formData.append("_token", _token);
        formData.append("l_img", $('#l_img')[0].files[0]);

        if(!l_img) {
            //do error if no image uploaded
            return false;
        }
        else
        {
            $.ajax({
                type: "POST",
                url: "/my_url",
                contentType: false,
                processData: false,
                dataType: "json",
                data : formData,
                beforeSend: function()
                {
                    //do before send
                },
                success: function(data)
                {
                    //do success
                },
                error: function(jqXhr, textStatus, errorThrown) //jqXHR, textStatus, errorThrown
                {
                    if( jqXhr.status === "422" ) {
                        //do error
                    } else {
                        //do error
                    }
                }
            });
        }
        return false; //not to post the form physically

Auch wenn Sie eine haben csrf_token, können Sie, wenn Sie Ihre Controller-Aktionen mit Laravel authentifizieren Policies, auch eine 419-Antwort erhalten. In diesem Fall sollten Sie Ihrer PolicyKlasse die erforderlichen Richtlinienfunktionen hinzufügen .

Wenn Sie .js aus einer Datei laden, müssen Sie eine Variable mit dem csrf_token in Ihrer "main" .blade.php-Datei festlegen, in die Sie die .js importieren, und die Variable in Ihrem Ajax-Aufruf verwenden.

index.blade.php

...
...
<script src="{{ asset('js/anotherfile.js') }}"></script>
<script type="text/javascript">
        var token = '{{ csrf_token() }}';
</script>

anotherfile.js

$.ajax({
    url: 'yourUrl',
    type: 'POST',
    data: {
        '_token': token
    },
    dataType: "json",
    beforeSend:function(){
        //do stuff
    },
    success: function(data) {
        //do stuff
    },
    error: function(data) {
        //do stuff
    },
    complete: function(){
        //do stuff
    }
});

einige refs =>

...
<head>
    // CSRF for all ajax call
    <meta name="csrf-token" content="{{ csrf_token() }}" />
</head>
 ...
 ...
<script>
    // CSRF for all ajax call
    $.ajaxSetup({ headers: { 'X-CSRF-TOKEN': jQuery('meta[name="csrf-token"]').attr('content') } });
</script>
...

Serialisieren Sie einfach die Formulardaten und lösen Sie Ihr Problem.

data: $('#form_id').serialize(),

Sie müssen das csrf-Token erhalten.

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

Nachdem das gleiche Problem aufgetreten ist, fügen Sie einfach dieses Meta-Tag hinzu< meta name="csrf-token" content="{{ csrf_token() }}" >

Danach tritt auch der Fehler auf, Sie können den Ajax-Fehler überprüfen. Überprüfen Sie dann auch den Ajax-Fehler

$.ajax({
    url: 'some_unknown_page.html',
    success: function (response) {
        $('#post').html(response.responseText);
    },
    error: function (jqXHR, exception) {
        var msg = '';
        if (jqXHR.status === 0) {
            msg = 'Not connect.\n Verify Network.';
        } else if (jqXHR.status == 404) {
            msg = 'Requested page not found. [404]';
        } else if (jqXHR.status == 500) {
            msg = 'Internal Server Error [500].';
        } else if (exception === 'parsererror') {
            msg = 'Requested JSON parse failed.';
        } else if (exception === 'timeout') {
            msg = 'Time out error.';
        } else if (exception === 'abort') {
            msg = 'Ajax request aborted.';
        } else {
            msg = 'Uncaught Error.\n' + jqXHR.responseText;
        }
        $('#post').html(msg);
    },
});

formData = new FormData();
formData.append('_token', "{{csrf_token()}}");
formData.append('file', blobInfo.blob(), blobInfo.filename());
xhr.send(formData);

2019 Laravel Update, Ich hätte nie gedacht, dass ich dies veröffentlichen werde, aber für Entwickler wie mich, die die Browser-Abruf-API auf Laravel 5.8 und höher verwenden. Sie müssen Ihr Token über den Parameter headers übergeben.

var _token = "{{ csrf_token }}";
fetch("{{url('add/new/comment')}}", {
                method: 'POST',
                headers: {
                    'X-CSRF-TOKEN': _token,
                    'Content-Type': 'application/json',
                },
                body: JSON.stringify(name, email, message, article_id)
            }).then(r => {
                return r.json();
            }).then(results => {}).catch(err => console.log(err));

Ich hatte SESSION_SECURE_COOKIEauf true gesetzt, damit meine SESSION_SECURE_COOKIE=false Entwicklungsumgebung beim Anmelden nicht funktionierte. Deshalb habe ich meine Entwickler-ENV-Datei hinzugefügt und alles funktioniert einwandfrei. Mein Fehler bestand darin, die Datei session.php zu ändern, anstatt die Variable zur ENV-Datei hinzuzufügen.

Dieser Fehler tritt auch auf, wenn Sie vergessen haben, dies in Ihre Ajax-Übermittlungsanforderung (POST) aufzunehmen: contentType: false, processData: false,

Ich habe diesen Fehler erhalten, obwohl ich bereits ein CSRF-Token gesendet habe. Es stellte sich heraus, dass auf dem Server kein Speicherplatz mehr vorhanden war.

Dies funktioniert hervorragend in Fällen, in denen Sie kein Formular benötigen.

Verwenden Sie dies in der Kopfzeile:

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

und das in Ihrem JavaScript-Code:

$.ajaxSetup({
        headers: {
        'X-CSRF-TOKEN': '<?php echo csrf_token() ?>'
        }
    });

Eine einfache Möglichkeit, einen unbekannten 419-Status auf Ihrer Konsole zu beheben, besteht darin, dieses Skript in Ihr FORMULAR einzufügen. {{csrf_field ()}}

Das hat bei mir funktioniert:

$.ajaxSetup({
  headers: {
    'X-CSRF-TOKEN': "{{ csrf_token() }}"
  }
});

Danach stellen Sie den regulären AJAX-Aufruf ein. Beispiel:

    $.ajax({
       type:'POST',
       url:'custom_url',

       data:{name: "some name", password: "pass", email: "test@test.com"},

       success:function(response){

          // Log response
          console.log(response);

       }

    });