Laravel Sanctum: Corrigiendo un “error no autenticado”

[vc_row el_class=”blog-info”][vc_column][vc_single_image source=”featured_image” img_size=”full” style=”vc_box_rounded”][vc_empty_space height=”40px”][vc_row_inner][vc_column_inner width=”1/6″][/vc_column_inner][vc_column_inner width=”2/3″][vc_column_text el_class=”font-weight-bold”]

Corrigiendo un “error no autenticado” al usar Laravel Sanctum para SPA

Laravel Sanctum

[/vc_column_text][vc_empty_space height=”40px”][/vc_column_inner][vc_column_inner width=”1/6″][/vc_column_inner][/vc_row_inner][vc_row_inner][vc_column_inner width=”1/6″][/vc_column_inner][vc_column_inner width=”2/3″][vc_column_text]


Puede estar trabajando localmente con el proyecto Laravel; Scaffold una aplicación de front-end con React/Vue/Angular y al realizar solicitudes a rutas envueltas dentro del middleware auth: sanctum, es posible que obtenga un error no autenticado. Es por errores de configuración. Arreglemos esto.

  • Asegúrese de que la aplicación laravel esté sirviendo desde localhost (127.0.0.1) haciendo el buen servidor php artisan serve. No utilice hosts virtuales porque no puede servir las aplicaciones de front-end desde el mismo host virtual.

 

  • Verifique los números de puerto de su aplicación front-end. Por lo general, la aplicación React sirve en http://localhost:3000 y la aplicación Vue sirve desde http://localhost:8080.

 

  • Es necesario que la (s) aplicación (es) front-end y la aplicación laravel sirvan desde el mismo dominio, localhost en nuestro caso.

 

  • Establezca dominios con estado de Laravel Sanctum en el archivo .env. Estas son las direcciones de nuestras aplicaciones frontales, incluidos los números de puerto.
SANCTUM_STATEFUL_DOMAINS=localhost:8080,127.0.0.1:8080,localhost:3000,127.0.0.1:3000
  • Configure el dominio de sesión en el archivo .env. Necesita cambiar esto en producción a su nombre de dominio.
SESSION_DOMAIN=localhost
  • Establecer rutas y supports_credentails en cors.php Las rutas de web.php a las que desea tener acceso en su aplicación front-end deben agregarse a la matriz de rutas.
'paths' => ['api/*', 'login', 'register', 'otp/*', 'sanctum/csrf-cookie'],'supports_credentials' => true,
  • Y finalmente, debe realizar solicitudes desde la aplicación de front-end a localhost/api/other-route pero no a 127.0.0.1/api/other-route usando axios.

[/vc_column_text][/vc_column_inner][vc_column_inner width=”1/6″][/vc_column_inner][/vc_row_inner][/vc_column][/vc_row][vc_row el_class=”social-info”][vc_column width=”1/6″][/vc_column][vc_column width=”2/3″][vc_row_inner][vc_column_inner width=”1/2″][vc_column_text][social_share_button themes=’theme1′][/vc_column_text][/vc_column_inner][vc_column_inner el_class=”youtube-inner-col” width=”1/2″][vc_column_text][likebtn theme=”youtube” lang=”auto” show_like_label=”0″ white_label=”1″ alignment=”right”][/vc_column_text][/vc_column_inner][/vc_row_inner][vc_row_inner el_class=”social-info-inner”][vc_column_inner width=”1/4″][vc_single_image image=”921″][/vc_column_inner][vc_column_inner width=”3/4″][vc_column_text]

Diego Pacheco

Ingeniero en Sitemas, MBA (Babson College). Desarrollador PHP/Java/JavaScript. Fundador & CEO de EpicStudio. Entusiasta de las tecnologías web (JavaScript, Vue, Laravel, AWS, Docker) Viajes, Negocios, Surf y Growth.[/vc_column_text][asvc_list_item icon_fontawesome=”fa fa-calendar-o” icon_size=”14px”]Programar una reunión[/asvc_list_item][/vc_column_inner][/vc_row_inner][/vc_column][vc_column width=”1/6″][/vc_column][/vc_row][vc_row][vc_column][vc_column_text]

Recent Post

[/vc_column_text][lvca_posts_carousel posts_query=”size:3|order_by:rand|post_type:post” image_linkable=”true” image_size=”full” taxonomy_chosen=”post_tag” display_title=”true” display_post_date=”true” display_summary=”true” autoplay_speed=”3000″ animation_speed=”300″ display_columns=”3″ scroll_columns=”3″ gutter=”3″ tablet_display_columns=”2″ tablet_scroll_columns=”2″ tablet_gutter=”3″ tablet_width=”800″ mobile_display_columns=”1″ mobile_scroll_columns=”1″ mobile_gutter=”3″ mobile_width=”480″][vc_empty_space height=”20px”][/vc_column][/vc_row]