0

我集成Angular (11) frontend在Laravel 8应用程序中。为了发出 API 请求，用户必须登录。每次前端 Angular 向后端 API 发出请求时，我都会收到以下错误：

Status Code: 401 Unauthorized

我已经设置VueJs frontend测试相同的 API 端点 URL，VueJs 可以到达 API 端点并从后端获取响应。当我将Request HeadersVueJS 发出的 API 请求与 Angular 11 发出的请求进行比较时，我Request Headers发现Angular 11没有X-XSRF-TOKEN. 所以我认为这就是我收到上述错误的原因。

以下是在 Laravel 8 中如何设置VueJs以及如何在.AXIOSX-XSRF-TOKENAPI 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;
}

如何设置X-XSRF-TOKENor X-CSRF-TOKENin API Request Headersmaking by Angular 11inside Laravel 8？

注意：Angular 11 前端和 VueJs 前端都集成在 Laravel 8 应用程序的前端网页上，因此它们在同一个域中。所以我认为laravel-cors不需要包。

4

2 回答 2

0 
imports: [ HttpClientModule,HttpClientXsrfModule.withOptions({cookieName: 'My-Xsrf-Cookie',headerName: 'My-Xsrf-Header'})]; // headerName is optional
于 2021-10-13T09:40:00.257 回答
0

要获取 XSRF 令牌，您必须使用包含带有值 Fetch 的标头 X-CSRF-Token 的非修改 HTTP 方法。仅当用户已通过身份验证时才会颁发令牌。如果用户没有被认证，任何带有修改方法的请求都会被这个过滤器拒绝。有关 XSRF 保护的更多信息，请单击此处！

于 2021-04-12T11:52:25.607 回答