1、创建拦截器

import {
HttpEvent,
HttpInterceptor,
HttpHandler,
HttpRequest,
} from '@angular/common/http';
import { Observable } from 'rxjs'; export class AddHeaderInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
let xsrftoken = ''
document.cookie.split(';').forEach(it => {
if (it.split('=')[0]=='XSRF-TOKEN'||it.split('=')[0]==' XSRF-TOKEN') {
xsrftoken = it.split('=')[1]
}
})
const clonedRequest = req.clone({ headers: req.headers.set('X-XSRF-TOKEN', xsrftoken) }); // Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}
}

2、用HTTP_INTERCEPTORS提供的注册

import { HTTP_INTERCEPTORS } from '@angular/common/http';

@NgModule({
providers: [{
provide: HTTP_INTERCEPTORS,
useClass: AddHeaderInterceptor,
multi: true,
}],
})
export class AppModule {}

参照:https://www.cnblogs.com/sugartang/p/14338731.html

angular请求头部加XSRF-TOKEN的更多相关文章

  1. ajax请求头加Token时发生的跨域(CORS)请求问题

    首先描述下问题:需求是在请求头中加入token,我在ajax请求数据时添加了请求头‘Authorization’字段,并添加了响应的token值,在请求数据的时候浏览器报错如下: Request he ...

  2. 使用apache的HttpClient进行http通讯,隐藏的HTTP请求头部字段是如何自动被添加的

    我们用apache的HttpClient这个库消费云端的Restful API时,一般都需要两次HTTP调用,第一次获得某种token,比如获取防止跨域请求伪造攻击Cross-site request ...

  3. .NET Core实战项目之CMS 第十四章 开发篇-防止跨站请求伪造(XSRF/CSRF)攻击处理

    通过 ASP.NET Core,开发者可轻松配置和管理其应用的安全性. ASP.NET Core 中包含管理身份验证.授权.数据保护.SSL 强制.应用机密.请求防伪保护及 CORS 管理等等安全方面 ...

  4. Angular 请求数据

    Angular 请求数据 get post 以及 jsonp 请求数据 引入 HttpModule .JsonpModule 普通的 HTTP 调用并不需要用到 JsonpModule,不过稍后我们就 ...

  5. Angular通过XHR加载模板而限制使用file://(解决方案)

    编写angular项目时,遇到此困难: angular.js:12011 XMLHttpRequest cannot load file:///E:/angular/imooc/chapter2/bo ...

  6. 跨站请求伪造 CSRF / XSRF<二:应用>

    防御的方法主要有两种<java示例> 1.检查Referer字段 HTTP头中有一个Referer字段,这个字段用以标明请求来源于哪个地址.在处理敏感数据请求时,通常来说,Referer字 ...

  7. BaseHttpListActivity,几行代码搞定Android Http列表请求、加载和缓存

    Android开发中,向服务器请求一个列表并显示是非常常见的需求,但实现起来比较麻烦,代码繁杂. 随着应用的更新迭代,这种需求越来越多,我渐渐发现了实现这种需求的代码的共同点. 于是我将Activit ...

  8. http 请求头部解析

    作者:知乎用户链接:https://www.zhihu.com/question/42696895/answer/109035792来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请 ...

  9. 中断 http请求 正在加载 取消http请求

    中断 http请求  正在加载 取消http请求

  10. 使用zuul实现验证自定义请求头中的token

    路由:她会把外部所有对请求转发到具体的微服务实例上,是实现外部访问同一接口的基础 过滤: 就是权限的检查, 判断当前的请求是否有权限区访问那些服务集群 搭建后台网关: 导入eureka - clien ...

随机推荐

  1. debian11命令行安装字体

    一.需要用到三条命令mkfontscale/mkfontdir/fc-cache这三条命令属于两个软件包mkfontscale/mkfontdir属于xfonts-utils包,fc-cache命令属 ...

  2. pip python的包成功,但是import的时候报错

    今天,一位同学线上反馈import python包失败了,同时附带两张图: 图1.报错代码 图2.报错提示 结合上面两个图片,我们发现这个同学import全部失败,初步怀疑该同学的本地环境上没有num ...

  3. MySQL中的索引应用

    1.什么是索引(Index)? 官方的定义是索引是一种数据结构,从生活的纬度上讲,假如将一本书比作成一张表,这本书的目录就是表中的索引(Index). 2.索引的优势和劣势? 优势:数据量比较大时,为 ...

  4. CAD轴测图怎么画?快来试试浩辰CAD超级轴测命令!

    很多新手设计师小伙伴,不知道CAD轴测图怎么画?其实很简单,浩辰CAD中的超级轴测功能,可以方便地将CAD平面图转化为轴侧图,是绘制管线系统图的好帮手.今天就和小编一起来看看在浩辰CAD软件中通过调用 ...

  5. css 多行隐藏

    overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box- ...

  6. R语言3D图导出矢量图有bug

    谁不喜欢高清无码?rgl.snapshot就是个渣渣 首先,用rgl画3D图并调整好视角,代码如下: z <- 2 * volcano # Exaggerate the reliefx < ...

  7. Vue 局部过滤器和全局过滤器

    Vue 过滤器总结: 定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理) 语法: 1.注册过滤器: Vue.filter(name,callback) 或 new Vue{filt ...

  8. SQL SERVER 截断大日志文件

    1.改成完整模式下,先完整备份,然后只备份事务日志2. 改成简单模式,然后截断(运行下边示例代码)3.再备份事务日志(观察LDF文件有没有变小)-----收缩大日志  SELECT * FROM sy ...

  9. WindowsServer2012搭建FTP服务器站点

    公司需要搭建一个FTP服务器给银行推送账单,这个文章整理的比较详细,可以参考 数据来源: https://blog.csdn.net/u010483330/article/details/125931 ...

  10. Centos7.5下安装nginx

    #cd /usr/local #wget http://nginx.org/download/nginx-1.8.0.tar.gz #tar -xzvf nginx-1.8.0.tar.gz #cd ...