我有一个Angular（v10）WebApp，它可以通过在我的导入文件中使用来正确处理X-CSRF-TOKEN cookie，如《Angular指南》中所述HttpClientXsrfModule。
// app.module.ts
HttpClientModule,
HttpClientXsrfModule.withOptions({
cookieName: 'XSRF-TOKEN',
headerName: 'X-XSRF-TOKEN',
}),
并在我的服务请求中设置相对路径，例如：
// some service.ts
public deleteX(x_id: number): Observable<any> {
return this.httpClient.delete(`api/X/${x_id}`);
}
现在，浏览器本身可以处理从服务器获取令牌的操作，并成功通过随后的每个POST / DELETE / PUT / PATCH请求发送令牌。
但是，如果我现在使用cordova将应用程序编译为Android应用程序，则该应用程序会向发送一个请求（x_id = 1068）file:///android_asset/www/api/X/1068。我可以修改http服务以轻松使用特定于平台的绝对/相对路径，例如：
// some service.ts
public deleteX(x_id: number): Observable<any> {
if (this.cordovaService.platform === CordovaService.PLATFORM_ANDROID) {
return this.httpClient.delete(`${environment.baseUrl}/api/X/${x_id}`);
} else {
return this.httpClient.delete(`api/X/${x_id}`);
}
}
但是，我的请求来自Android应用程序的响应是
error: "access_denied"
error_description: "Invalid CSRF Token 'null' was found on the request parameter '_csrf' or header 'X-XSRF-TOKEN'."
我该怎么做，以便为我的cordova编译的Android应用程序正确处理X-XSRF-TOKEN？
我最终使用了cordova-plugin-advanced-http，它提供了这里描述的response-cookie-fetching机会。我为每个HTTP方法（GET，HEAD，PATCH，PUT，POST，DELETE）创建了一个通用http服务包含通用方法，该方法首先检查正在运行的平台，然后转发调整后的请求。
通用GET（伪代码）示例：
// generic-http-service.ts
public get<T>(url: string, queryParams?: any): Observable<T> {
if (this.cordovaService.platform === CordovaService.PLATFORM_ANDROID) {
// android-specific solution
// 1. adjust params
// 2. set general headers + the XSRF-TOKEN from the previous sendt request
// 3. return Observable(obs) {
// 4. send:
cordova.plugin.http.get(`${environment.baseUrl}/${url}`, adjustedParams, adjustedHeaders,
successResponse => {
// 5. fetch & save XSRF-TOKEN
obs.next(JSON.parse(successResponse.data) as T);
}, errorResponse => {
obs.error(errorResponse);
})
}
} else {
// web-specific solution based on the angular guide
return this.httpClient.get(`${url}`);
}
}
之后，我只需要稍微调整一下服务即可。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句