Laravel-datatables: 401 no autorizado

Creado en 3 sept. 2015  ·  15Comentarios  ·  Fuente: yajra/laravel-datatables

Actualicé hoy a la versión 5.11.7 y tengo un error aleatorio no autorizado del ajax cuando entro a la página donde tengo el componente Datatables.
mi codigo es asi

    public function anyData()
    {
      $Patient = Patient::select('*')->withTrashed();
      return \Datatables::of($Patient)->make(true);
    }

y la declaración de la tabla de datos es

$(document).ready(function() {
    $('#dataTables-patients').DataTable({
      responsive: true,
      processing: true,
      serverSide: true,
      ajax: base_url+'/patient/data',
      language:{
        url:base_url+'/js/dataTables.Spanish.json'
      },
      columns:[
        {data:'dni', name:'dni'},
        {data:'first_name', name:'first_name'},
        {data:'last_name', name:'last_name'},
        {data:'birthday', name:'birthday'},
        {data:'id', name:'id'},
        {data:'active', name:'active'},
      ],
      "columnDefs": [{
        "targets": 4,
        "data": "id",
        "render": function ( data, type, row ) {
          if(row.active=="0"){
            return '<a class="btn btn-primary" href="'+base_url+'/patient/show/'+data+'">'+patient.view+'</a>'+
                   '<a class="btn btn-success respatient" data-id="'+data+'" href="#" >'+patient.restore+'</a>';
          }else{
            return '<a class="btn btn-primary" href="'+base_url+'/patient/show/'+data+'">'+patient.view+'</a>'+
                   '<a class="btn btn-danger delpatient" data-id="'+data+'" href="#" >'+patient.delete+'</a>';
          }
        }

      },
      { "orderable": false, "targets": [ 4 ] },
      { "bSearchable": false, "aTargets": [ 5 ] },
      { "visible": false,  "targets": [ 5 ] }
      ]
    });

});

cuando explota No autorizado, tengo que volver a iniciar sesión en la aplicación. y pasa aleatoriamente: puedo recargar 6 veces la pagina y no pasa nada, ya veces entro dos veces y pasa sin autorización.

Comentario más útil

Leyendo los comentarios,
Resolví bien el problema.
en la vista
var token = '{{ csrf_token() }}';

ajax: { url:'$url', type:'post', data: { '_token': token } },

`var tabla = $('#miTabla');

        oTable = table.dataTable({
            processing: true,
            serverSide: true,
            order: [[1, 'desc']],
            buttons: [
                { extend: 'print',  className: 'btn dark btn-outline'       },
                { extend: 'copy',   className: 'btn red btn-outline'        },
                { extend: 'pdf',    className: 'btn green btn-outline'      },
                { extend: 'excel',  className: 'btn yellow btn-outline'     },
                { extend: 'csv',    className: 'btn purple btn-outline'     },
                { extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
            ],
            ajax: {
                url:'$url',
                type:'post',
                data: {
                    '_token': token
                }
            },
            $col,
            \"oLanguage\": {
                \"sEmptyTable\":   \"No se encontraron resultados\",
                \"sInfo\":         \"Mostrando _START_ a _END_ de _TOTAL_ filas\",
                \"sInfoEmpty\":    \"No se encontraron resultados\",
                \"sInfoFiltered\": \"(Filtrado de _MAX_ total de filas)\",
                \"sLengthMenu\":   \"Ver _MENU_ filas\",
                \"sSearch\":       \"Buscar:\",
                \"sZeroRecords\":  \"No se encontraron resultados\"
            },
            \"aoColumnDefs\": [
                { \"bSortable\": false, \"aTargets\": [ 0,-1 ] }

,
{ \"iDataSort\": 1, \"aObjetivos\": [ 0 ] },

                { \"sWidth\": \"20px\",   \"aTargets\": [ 0,-1 ]  },


            ]
        });


        table.on(\"keyup\", \"input[type=search]\", function () {
            /* Filter on the column (the index) of this element */
            oTable.fnFilter(this.value, $(\"thead input\").index(this));
        });

        $('#sample_1_tools > li > a.tool-action').on('click', function() {
            var action = $(this).attr('data-action');
            //console.log(action);
            oTable.DataTable().button(action).trigger();
        });

`

Todos 15 comentarios

@ mantrax314 , este es un error fantasma que es realmente difícil de depurar. Varios usuarios ya informaron el mismo problema y no pueden encontrar nada que lo provoque. Ni siquiera puedo reproducir el mismo error en mi máquina local. Sería genial y apreciado si pudiera ayudar y proporcionar un PR si es posible para solucionar este problema de una vez por todas. ¡Gracias!

Hola,
Me encontré con este problema e intenté depurar durante horas, pero fue en vano.
Parece que una solución es configurar su ajax como una solicitud POST en lugar de GET
Esto funcionó para mí y lo probé actualizando mi página 50 veces sin que me expulsaran a la página de inicio de sesión.

La solución se basa en este problema.
https://github.com/yajra/laravel-datatables/issues/19

Lo mismo con @Xyten . Resolví esto usando la solicitud POST, pero recibo un error con el token CSRF cuando uso POST. ¿Alguna sugerencia para eso? gracias por cierto

@mrofi , siga los documentos para el problema del token. http://laravel.com/docs/5.1/routing#csrf-x-csrf-token

Acabo de leer el problema https://github.com/Chumper/Datatable/issues/170 en Chumper Datatable y podría ser aplicable a nosotros.

mgsmus comentó el 16 de septiembre de 2014
He tenido este problema. Estaba usando el servidor web incorporado de PHP a través de "servicio artesanal". Cambié a Apache y el problema está resuelto. Supongo que la razón es el subprocesamiento múltiple que el servidor incorporado no admite.

¿Alguno de ustedes usa "servicio artesanal"?

Estoy usando "servicio artesanal". Buena nota. Usar un servidor incorporado es bastante fácil, pero no puede representar el entorno real, consideraré usar Apache en su lugar después de esto.

Gracias, @yajra . Por cierto, resolví el problema del token csrf con tu sugerencia. Extrañé esa documentación de Laravel. ¿Dónde puedo encontrar la forma de cambiar el tipo de solicitud de ajax en el generador de html?

@mrofi , gracias por confirmar. Este problema puede deberse realmente al "servicio artesanal".

Para ajax, puede enviarle un parámetro de matriz como se muestra a continuación.

->ajax([
  'url' => 'url',
  'type' => 'post'
])

Varios usuarios confirmaron que el problema se debió al "servicio artesanal". El uso de apache/nginx solucionará el problema. ¡Gracias!

Estoy usando apache en una máquina Fedora, usando localmente a través del archivo de hosts y tengo exactamente el mismo problema. ¿Algunas ideas?

Resolví este pequeño problema de la siguiente manera
reemplaza: ajax: 'recurso',

por:
ajax: {
URL: 'recurso',
encabezados: {'X-CSRF-TOKEN': token},
tipo de datos: 'JSON',
antesEnviar: función (xhr) {
xhr.setRequestHeader('Autorización');
}
},

Algunos consejos
1) Ajax tal vez llame haciendo POST o GET, por lo que necesita configurar su ruta en CUALQUIER
```
Route::any('campos/data','CamposController @data ')->name('campos.data');

2) Dont forget add the token before the ajax calling (in my case is Laravel)

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

3) I have that issue in using php artisan on Windows. If you use on Linux or Apache you wont have errors. 
4) Error 401 is becouse the session was expired. You need a login again. You could handler the error and take some action

"ajax": "/recurso",
"error": función (razón) {
console.log("¡Error encontrado!");
// razón del proceso aquí para saber el tipo de error
// y luego tomar la acción apropiada
}
```

Leyendo los comentarios,
Resolví bien el problema.
en la vista
var token = '{{ csrf_token() }}';

ajax: { url:'$url', type:'post', data: { '_token': token } },

`var tabla = $('#miTabla');

        oTable = table.dataTable({
            processing: true,
            serverSide: true,
            order: [[1, 'desc']],
            buttons: [
                { extend: 'print',  className: 'btn dark btn-outline'       },
                { extend: 'copy',   className: 'btn red btn-outline'        },
                { extend: 'pdf',    className: 'btn green btn-outline'      },
                { extend: 'excel',  className: 'btn yellow btn-outline'     },
                { extend: 'csv',    className: 'btn purple btn-outline'     },
                { extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
            ],
            ajax: {
                url:'$url',
                type:'post',
                data: {
                    '_token': token
                }
            },
            $col,
            \"oLanguage\": {
                \"sEmptyTable\":   \"No se encontraron resultados\",
                \"sInfo\":         \"Mostrando _START_ a _END_ de _TOTAL_ filas\",
                \"sInfoEmpty\":    \"No se encontraron resultados\",
                \"sInfoFiltered\": \"(Filtrado de _MAX_ total de filas)\",
                \"sLengthMenu\":   \"Ver _MENU_ filas\",
                \"sSearch\":       \"Buscar:\",
                \"sZeroRecords\":  \"No se encontraron resultados\"
            },
            \"aoColumnDefs\": [
                { \"bSortable\": false, \"aTargets\": [ 0,-1 ] }

,
{ \"iDataSort\": 1, \"aObjetivos\": [ 0 ] },

                { \"sWidth\": \"20px\",   \"aTargets\": [ 0,-1 ]  },


            ]
        });


        table.on(\"keyup\", \"input[type=search]\", function () {
            /* Filter on the column (the index) of this element */
            oTable.fnFilter(this.value, $(\"thead input\").index(this));
        });

        $('#sample_1_tools > li > a.tool-action').on('click', function() {
            var action = $(this).attr('data-action');
            //console.log(action);
            oTable.DataTable().button(action).trigger();
        });

`

@jarm-mcs gracias por la solución, funciona :)

Hola, yo también tuve este problema y lo resolví usando encabezados axios en la configuración de Ajax. Estoy usando Laravel Passport, no se si tiene relacion, porque con una simple llamada axios funciona

mi bootstrap.js

window.axios = require('axios');

window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';

/**
 * Next we will register the CSRF Token as a common header with Axios so that
 * all outgoing HTTP requests automatically have it attached. This is just
 * a simple convenience so we don't have to attach every token manually.
 */

let token = document.head.querySelector('meta[name="csrf-token"]');

if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

mi script de tablas de datos

$(function() {
            $('#users-table').DataTable({
                processing: true,
                serverSide: true,
                ajax: {
                    'url':'{!! route('api.games.index') !!}',
                    'headers':window.axios.defaults.headers.common
                },
                columns: [
                    { data: 'id', name: 'id' },
                    { data: 'name', name: 'name' },
                    { data: 'created_at', name: 'created_at' },
                    { data: 'updated_at', name: 'updated_at' }
                ]
            });
        });

Leyendo los comentarios,
Resolví bien el problema.
en la vista
var token = '{{ csrf_token() }}';

ajax: { url:'$url', type:'post', data: { '_token': token } },

`var tabla = $('#miTabla');

        oTable = table.dataTable({
            processing: true,
            serverSide: true,
            order: [[1, 'desc']],
            buttons: [
              { extend: 'print',  className: 'btn dark btn-outline'       },
              { extend: 'copy',   className: 'btn red btn-outline'        },
              { extend: 'pdf',    className: 'btn green btn-outline'      },
              { extend: 'excel',  className: 'btn yellow btn-outline'     },
              { extend: 'csv',    className: 'btn purple btn-outline'     },
              { extend: 'colvis', className: 'btn dark btn-outline', text: 'Columns'}
          ],
            ajax: {
                url:'$url',
                type:'post',
                data: {
                    '_token': token
                }
            },
            $col,
            \"oLanguage\": {
              \"sEmptyTable\":   \"No se encontraron resultados\",
              \"sInfo\":         \"Mostrando _START_ a _END_ de _TOTAL_ filas\",
              \"sInfoEmpty\":    \"No se encontraron resultados\",
              \"sInfoFiltered\": \"(Filtrado de _MAX_ total de filas)\",
              \"sLengthMenu\":   \"Ver _MENU_ filas\",
              \"sSearch\":       \"Buscar:\",
              \"sZeroRecords\":  \"No se encontraron resultados\"
          },
          \"aoColumnDefs\": [
              { \"bSortable\": false, \"aTargets\": [ 0,-1 ] }

,
{ "iDataSort": 1, "objetivos": [ 0 ] },

              { \"sWidth\": \"20px\",   \"aTargets\": [ 0,-1 ]  },


            ]
        });


        table.on(\"keyup\", \"input[type=search]\", function () {
          /* Filter on the column (the index) of this element */
          oTable.fnFilter(this.value, $(\"thead input\").index(this));
      });

        $('#sample_1_tools > li > a.tool-action').on('click', function() {
            var action = $(this).attr('data-action');
            //console.log(action);
            oTable.DataTable().button(action).trigger();
        });

`

Gracias por la solución.

¿Fue útil esta página
0 / 5 - 0 calificaciones