我在Laravel 8应用程序中集成了Angular (11) frontend。发出API请求时,用户需要登录。每次前端Angular向后端API发出请求时,我都会收到以下错误:
Status Code: 401 Unauthorized我已经设置了VueJs frontend来测试相同的API端点URL,VueJs可以到达API端点并从后端获得响应。对比VueJS发起的接口请求的Request Headers和Angular 11发起的请求,发现Angular 11的Request Headers没有X-XSRF-TOKEN。所以我想这就是我得到上述错误的原因。
下面是如何在Laravel 8中设置VueJs和AXIOS以将X-XSRF-TOKEN放在API Request Headers中。
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
const token = document.head.querySelector('meta[name="csrf-token"]');
if (token) {
window.axios.defaults.headers.common["X-CSRF-TOKEN"] = token.content;
}Angular 11在Laravel 8中制作API Request Headers时如何设置X-XSRF-TOKEN或X-CSRF-TOKEN
注意: Angular 11前端和VueJs前端都集成在Laravel 8应用的前端网页上,因此它们在同一个域名上。所以我认为laravel-cors包是不需要的。
发布于 2021-04-12 19:52:26
要获得XSRF令牌,您必须使用一个非修改的HTTP方法,该方法包含头X-CSRF-Token和Fetch值。仅当用户已通过身份验证时,才会颁发令牌。如果用户尚未通过身份验证,则此筛选器将拒绝任何具有修改方法的请求。有关XSRF保护的更多信息,请单击here!
发布于 2021-10-13 09:40:00
imports: [ HttpClientModule,HttpClientXsrfModule.withOptions({cookieName: 'My-Xsrf-Cookie',headerName: 'My-Xsrf-Header'})]; // headerName is optionalhttps://stackoverflow.com/questions/67057145
复制相似问题