Saltar al contenido

jQuery agrega el token CSRF a todos los datos de las solicitudes $ .post ()

Solución:

De la documentación de Laravel:

Por ejemplo, podría almacenar el token en una etiqueta “meta”:

Una vez que haya creado la metaetiqueta, puede indicarle a una biblioteca como jQuery que agregue el token a todos los encabezados de solicitud. Esto proporciona una protección CSRF simple y conveniente para sus aplicaciones basadas en AJAX:

$ .ajaxSetup ({encabezados: {‘X-CSRF-TOKEN’: $ (‘meta[name=”csrf-token”]’) .attr (‘ contenido ‘)}});

Entonces, por ejemplo, puede hacer una solicitud como a continuación.

Agregue esta metaetiqueta a su vista:

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

Y este es un script de ejemplo con el que puede comunicarse con Laravel (envía una solicitud cuando hace clic en un elemento con y puede ver la respuesta en un elemento con):

<script type="text/javascript">
    $(document).ready(function(){

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

        $("#some-id").on("click", function () {
            var request;


            request = $.ajax({
                url: "/your/url",
                method: "POST",
                data:
                {
                    a: 'something',
                    b: 'something else',
                },
                datatype: "json"
            });

            request.done(function(msg) {
                $("#result").html(msg);
            });

            request.fail(function(jqXHR, textStatus) {
                $("#result").html("Request failed: " + textStatus);
            });
        });

    });
</script>

Tu $.ajaxPrefilter El enfoque es bueno. Sin embargo, no es necesario agregar un encabezado; simplemente necesita agregar una propiedad al data cuerda.

Los datos se proporcionan como segundo argumento para $.posty luego formateado como una cadena de consulta (id=foo&bar=baz&...) antes de que el prefiltro acceda al data opción. Por lo tanto, debe agregar su propio campo a la cadena de consulta:

var csrf_token = $('meta[name="csrf-token"]').attr('content');
$.ajaxPrefilter(function(options, originalOptions, jqXHR){
    if (options.type.toLowerCase() === "post") {
        // initialize `data` to empty string if it does not exist
        options.data = options.data || "";

        // add leading ampersand if `data` is non-empty
        options.data += options.data?"&":"";

        // add _token entry
        options.data += "_token=" + encodeURIComponent(csrf_token);
    }
});

Esto se convertirá id=userID dentro id=userID&_token=csrf_token.

En general, estoy de acuerdo con el concepto que sugirió Kornel, excepto en una cosa.

Sí, los consejos de documentación de Laravel para usar $.ajaxSetup, pero no se recomienda ya que este método afecta a todas las solicitudes ajax posteriores. Es más correcto establecer la configuración de ajax para cada solicitud. Aunque puedes restablecer cosas:

Todas las llamadas Ajax posteriores que usen cualquier función usarán la nueva configuración, a menos que sean anuladas por las llamadas individuales, hasta la próxima invocación de $ .ajaxSetup ()

Si utiliza $.ajax(), es más conveniente utilizar data propiedad o headers. Laravel permite el token CSRF como parámetro de solicitud o como encabezado.

Primero, agrega la siguiente metaetiqueta en la vista

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

Y luego haga una solicitud ajax de cualquier manera:

$.ajax({
    url: "/your/url",
    method: "POST",
    data:
    {
        a: 'something',
        b: 'something else',
        _token: $('meta[name="csrf-token"]').attr('content')
    },
    datatype: "json"
});

O

$.ajax({
    url: "/your/url",
    method: "POST",
    data:
    {
        a: 'something',
        b: 'something else',
    },
    headers: 
    {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    }
    datatype: "json"
});
¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *