方案1. 使用Angular  http

import {Injectable} from '@angular/core';
import {Http, Headers} from '@angular/http'; @Injectable()
export class HttpClient { constructor(private http: Http) {} createAuthorizationHeader(headers: Headers) {
headers.append('Authorization', 'Basic ' +
btoa('username:password'));
} get(url) {
let headers = new Headers();
this.createAuthorizationHeader(headers);
return this.http.get(url, {
headers: headers
});
} post(url, data) {
let headers = new Headers();
this.createAuthorizationHeader(headers);
return this.http.post(url, data, {
headers: headers
});
}
}

方案2.Angular 4.3.x及更高版本可以执行如下操作来添加请求头

2.1拦截器设置

import {
HttpEvent,
HttpInterceptor,
HttpHandler,
HttpRequest,
} from '@angular/common/http'; export class AddHeaderInterceptor implements HttpInterceptor {
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// Clone the request to add the new header
const clonedRequest = req.clone({ headers: req.headers.set('Authorization', 'Bearer 123') }); // Pass the cloned request instead of the original request to the next handle
return next.handle(clonedRequest);
}
}

2.2创建拦截器后,您应该使用HTTP_INTERCEPTORS提供的注册。

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

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

方案3.配置扩展BaseRequestOptions

3.1配置代码如下

import {provide} from 'angular2/core';
import {bootstrap} from 'angular2/platform/browser';
import {HTTP_PROVIDERS, Headers, Http, BaseRequestOptions} from 'angular2/http'; import {AppCmp} from './components/app/app'; class MyRequestOptions extends BaseRequestOptions {
constructor () {
super();
this.headers.append('My-Custom-Header','MyCustomHeaderValue');
}
} bootstrap(AppCmp, [
ROUTER_PROVIDERS,
HTTP_PROVIDERS,
provide(RequestOptions, { useClass: MyRequestOptions })
]);

3.2添加请求头

this.http._defaultOptions.headers.append('Authorization', 'token');
或者
this.http._defaultOptions.headers.set('Authorization', 'token');

3.3删除请求头

this.http._defaultOptions.headers.delete('Authorization');

参考来源:https://www.itranslater.com/qa/details/2112366855208829952

Angular在用户登录后设置授权请求头headers.append('Authorization', 'token');的更多相关文章

  1. Retrofit2 + OkHttp3设置Http请求头(Headers)方法汇总

    在构建网络层时会遇到一个问题就是要手动配置Http请求的Headers,写入缓存Cookie,自定义的User-Agent等参数,但是对于有几十个接口的网络层,我才不想用注解配置Headers,目前网 ...

  2. 如何修改linux 用户登录后默认目录

    1.linux用户登录后默认目录是在/etc/passwd文件设置的.如下图所示,一共显示了四行数据,其中第一行的/root即为root用户登录后的默认目录,第二行daemon用户的默认目录是/usr ...

  3. Linux下文件 ~/.bashrc 和 ~/.bash_profile 和 /etc/bashrc 和 /etc/profile 的区别 | 用户登录后加载配置文件的顺序

    转自 https://blog.csdn.net/secondjanuary/article/details/9206151 文件说明: /ect/profile 此文件为系统的每个用户设置环境信息, ...

  4. 【Java】系统漏洞:关于用户登录后操作的注意事项

    项目背景: SpringMVC + Mybatis  + MySql数据库(javaWeb项目开发) 相关模块:登录,个人详细信息修改,订单详情查询 相关漏洞介绍: 1.登录的验证码:登录的验证码一定 ...

  5. WordPress用户登录后重定向到指定页面

    这篇文章将向您展示WordPress用户登录后如何重定向到指定页面或者文章的技巧. 一.重定向到网站管理面板. 将以下代码添加到您的当前主题的 functions.php 文件中: function  ...

  6. js 中ajax请求时设置 http请求头中的x-requestd-with= ajax

    今天发现 AngularJS 框架的$http服务提供的$http.get() /$http.post()的ajax请求中没有带 x-requested-with字段. 这样的话,后端的php 就无法 ...

  7. selenium.Phantomjs设置浏览器请求头

    from selenium import webdriver from selenium.webdriver.common.desired_capabilities import DesiredCap ...

  8. php设置http请求头信息和响应头信息

    php设置http请求头信息和响应头信息 设置请求服务器的头信息可以用fsockopen,curl组件,header函数只能用来设置客户端响应的头信息,不能设置服务器的头信息. 例子;  一.head ...

  9. Devexpress xaf针对某个用户登录后在面板中设置导航无效的解决方法

    Devexpress xaf框架生成的项目默认情况下导航栏是显示在左侧,有时候我们用某个账户登录后,发现导航栏无法显示在左侧,操作十分不方便.我们可以去数据库删除当前登录用户的自定义布局 解决方法如下 ...

  10. angular学习笔记(二十四)-$http(2)-设置http请求头

    1. angular默认的请求头: 其中,Accept 和 X-Requested-With是$http自带的默认配置 Accept:application/json,text/plain       ...

随机推荐

  1. C# String.Empty和""的区别

    个人观点 Empty其实是string类中的一个静态的只读字段,因为是静态成员变量,所以String.Empty是在设计String类的时候就已经在内存上分配好了空间,故在使用Empty这个变量的时候 ...

  2. Sql Server性能排查和优化懒人攻略

    转载自作者zhang502219048的微信公众号[SQL数据库编程]:Sql Server性能排查和优化懒人攻略 很多年前,笔者那时刚从广东技术师范学院(现为广东技术师范大学,以前为广东民族学院)的 ...

  3. 论文笔记 - PRISM: A Rich Class of Parameterized Submodular Information Measures for Guided Subset Selection

    Motivation 与 Active Learning 类似,Target Learning 致力于 挑选外卖更"感兴趣"的数据,即人为为更重要的数据添加 bias.例如我们当前 ...

  4. 从0搭建vue3组件库: Input组件

    本篇文章将为我们的组件库添加一个新成员:Input组件.其中Input组件要实现的功能有: 基础用法 禁用状态 尺寸大小 输入长度 可清空 密码框 带Icon的输入框 文本域 自适应文本高度的文本域 ...

  5. SpringBoot 03: 常用web组件 - - - 拦截器 + Servlet + 过滤器

    常用web组件 拦截器 Servlet 过滤器 使用思想 创建自定义类 实现或者继承框架里的接口或类 将自定义类注册到框架中 使用自定义类 拦截器 说明 拦截器是SpringMVC中的一种对象,能拦截 ...

  6. onps栈使用说明(3)——tcp、udp通讯测试

    4. tcp客户端 在协议栈源码工程下,存在一个用vs2015建立的TcpServerForStackTesting工程.其运行在windows平台下,模拟实际应用场景下的tcp服务器.当tcp客户端 ...

  7. perl chmod

    chmod函数改变一列文件的权限.列表的第一个元素必须是数字模式.chmod函数返回成功改变了的文件的数目.如: $cnt = chmod 0755, 'file1', 'file2';  其中最前面 ...

  8. django 多 APP urls的实现

    项目下urls.py 引入admin from django.contrib import admin 引入path,include from django.urls import path,incl ...

  9. halcon如何识别硬币?

    halcon如何识别硬币? 前言 最近一直在学习halcon,在此做了一个案例,分享给大家,效果图如下: 1.思路分析 通过观察,发现1元,5角,1角,它们在面值的文字描述不一样,硬币显示的花纹不一样 ...

  10. gcc和g++,c和cpp

    gcc对.c文件当成c处理,把.cpp文件当成c++处理 g++对.c和.cpp都当成c++处理 小心会遇到错误