重新发送请求角度2

2024-02-14

在 Angular 2 应用程序中,每个对 API 的请求都有带有令牌的标头,以防令牌过期,API 会使用 401 http 代码进行响应。我有一种更新令牌的方法,但是在获取新令牌的过程中如何重新发送先前的请求以暂停其他请求?


您可以延长Http类以这种方式,使用捕获错误catch可观测量算子:

一种方法是扩展 HTTP 对象来拦截错误:

@Injectable()
export class CustomHttp extends Http {
  constructor(backend: ConnectionBackend, defaultOptions: RequestOptions) {
    super(backend, defaultOptions);
  }

  request(url: string | Request, options?: RequestOptionsArgs): Observable<Response> {
    console.log('request...');
    return super.request(url, options).catch(res => {
      // do something
    });        
  }

  get(url: string, options?: RequestOptionsArgs): Observable<Response> {
    console.log('get...');
    return super.get(url, options).catch(res => {
      // do something
    });
  }
}

并按如下所述注册:

bootstrap(AppComponent, [HTTP_PROVIDERS,
    new Provider(Http, {
      useFactory: (backend: XHRBackend, defaultOptions: RequestOptions) => new CustomHttp(backend, defaultOptions),
      deps: [XHRBackend, RequestOptions]
  })
]);

在定义的回调中catch运算符,您可以调用您的方法来更新令牌,获取结果,在源请求上设置新令牌并再次执行它。这将是完全透明的。

这是一个示例:

get(url: string, options?: RequestOptionsArgs): Observable<Response> {
    return super.get(url, options).catch(res => {
      if (res.status === 401) {
        return this.getToken().flatMap(token => {
          var sourceOptions = options || {};
          var headers = sourceOptions.headers || new Headers();
          headers.append('Authorization', token); // for example
          return super.get(url, options);
        });
      }

      return Observable.throw(res);
    });
  }

Edit

要“暂停”其他请求,您需要在getToken方法使用do and share运营商:

getToken() {
  if (hasTokenExpired()) {
    this.token = null;
    this.tokenObservable = null;
  }

  if (this.token) {
    // Gotten the new token
    return Observable.of(this.token);
  } else if (this.tokenObservable) {
    // Request in progress...
    return this.tokenObservable;
  } else {
    // Execute the "refresh token" request
    return this.get('/refreshToken')
      .map(res => res.json)
      .do(token => {
        this.token = token;
        this.tokenObservable = null;
      })
      .share();
  }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

重新发送请求角度2 的相关文章

  • 如何等待,直到我从 Angular 7 中的后端 Spring Boot API 得到响应

    我想使用 http post 方法的结果从一条路线导航到另一条路线 但导航是在没有 http post 响应的情况下发生的 当我调试代码时 响应越来越晚 我怎样才能解决这个问题 有什么办法可以等待执行直到后端返回响应吗 当我单击按钮时 将执
  • 使用 Angular 4 将新行添加到 mat-table 中

    如何从输入字段手动将新行添加到 Angular Material 表中 请看这张图片 如果我添加状态名称和状态代码 它应该出现在下表中 请帮助我如何使用 Angular 4 来实现它 我整理了一个简单的示例 应该可以很好地提示您从哪里开始
  • mat-tab-group 不是 Angular 9 中的已知元素

    我正在使用 Angular 9 和 Angular Material 9 2 4 我正在尝试使用mat tab 组在我的 component html 中 但我不断收到错误 mat tab group is not a known elem
  • 在请求标头中设置 Cookie Angular2

    我是 angular2 的新手 我的服务器 spring 在其响应标头中使用 set cookie 值来响应身份验证 如何将该 cookie 设置为下一次 API 调用的请求标头 我搜索了很多 但找不到合适的解决方案 作为http get
  • Angular 2 - 加载时共享服务

    我正在尝试将服务共享给组件 为此 我创建了 service ts 其中代码如下 import Subject from rxjs Subject export class CommonService CommonList new Subje
  • 如何向离子推送通知添加操作按钮?

    我想向离子推送通知添加一些操作按钮 我正在使用科尔多瓦pushv5 通知工作正常 但我不知道如何添加这些按钮 如何添加这些按钮 应在 POST 请求中添加操作按钮 registration ids my device id data tit
  • Angular 2 - 突出显示更新的表格单元格

    如何在表中刷新改变其值的单元格 tr td product productName td td product price td tr 在组件中我有产品的输入 Input products Array
  • 获取“回调 URL 与 Auth0 不匹配”

    我有一个 Auth0 客户端 配置了以下回调 URL http 本地主机 4200 http localhost 4200 我可以正常登录 问题是当我导航到应用程序中的某个 URL 时 http localhost 4200 places
  • 无法在 Angular 4 中使用自定义主题

    我正在尝试在我的角度项目中使用我的自定义主题 它没有按预期工作 我收到以下错误 node modules css loader sourceMap false importLoaders 1 node modules postcss loa
  • 不同事件的角度停止传播

    在我的 Angular 4 应用程序中 我有一个带有 dblclick 处理程序的父组件和一个带有 click 处理程序的子组件 组件 html
  • 如何在 RxJS 订阅方法中等待

    在 RxJS 主题的订阅回调内部 我想要await on an async功能 下面是打字稿转译器抱怨的代码示例 错误 131 21 TS2304 找不到名称 await async ngOnInit this subscriber dat
  • 如何测试包含自定义表单控件的组件?

    我有一个这样的组件 Component selector app custom form control templateUrl
  • Angular 9:上传图像时如何将 HEIF 文件格式转换为已知的 Web 格式

    我正在维护一个用 Angular 9 编写的 Web 应用程序 PWA 用户可以在 Cropperjs 中上传图像并裁剪 旋转等 在 iOS 上 新的图像格式 HEIF 正在成为标准 这些用 户抱怨他们无法上传照片 似乎iOS有时会自动转换
  • 如何使用 Angular 2 动画实现翻转效果?

    我一直在我的项目中使用纯CSS翻转卡片 但这个解决方案不是合适的 有人可以通过点击按钮来呈现角度 2 的翻转吗 我在 angularjs 中找到了一个https codepen io Zbeyer pen oXQrZg https code
  • 元素不适应 Firefox 上的

    使用 ES6 ish D3js 模块运行 Angular 6 应用程序会导致 Firefox 出现问题 Chromium Chrome Safari 和 IE Edge 工作正常 伪代码看起来类似于 生产代码可以在下面找到
  • 没有导出的成员/节点模块

    我刚刚开始使用 5 分钟快速入门找到的 Angular 2 Typescripthere https angular io docs ts latest quickstart html 我遇到了一个看起来很常见的问题 但可能有点不同 我遇到
  • Angular 2+ 源代码中的 ɵ(类似 Theta)符号

    在深入研究 Angular 4 3 源代码后 我经常遇到 符号 例如 在异步管道源 https github com angular angular blob 4 3 2 packages common src pipes async pi
  • 如何转义角度 HttpParams?

    在 Angular 服务中 我使用 HttpParams 将字符串发送到服务 get phone string Observable
  • Angular2 与 ASP.NET 5 [关闭]

    Closed 此问题正在寻求书籍 工具 软件库等的推荐 不满足堆栈溢出指南 help closed questions 目前不接受答案 我正在将 Angular2 与 ASP NET5 gulp 和 typescript 结合使用 当我解决
  • 观众:覆盖单个测试的提供者(角度通用)

    我构建了一个小型角度应用程序 现在正在编写单元测试 到目前为止一切顺利 但是当我尝试测试我的 authGuard 时 我遇到了一些问题 我在用观众 https github com ngneat spectator 我在规范的提供者部分中提

随机推荐

  • 有没有办法为元组项目指定有意义的名称?

    从 a 中检索项目Tuple是通过访问来完成的ItemX财产 有没有一种方法可以命名每个项目 以便使用元组更具可读性 Code 寻找这样的东西 Dim l As New Tuple Of String Integer l Name l ID
  • 使用 Open MPI 运行并行程序时出现分段错误

    在我之前的文章中 我需要在 10 台计算机之间分发 pgm 文件的数据 在 Jonathan Dursi 和 Shawn Chin 的帮助下 我集成了代码 我可以编译我的程序 但出现分段错误 我跑了 但什么也没发生 mpirun np 10
  • TypeScript:构造函数中的位置或命名参数

    我有一个类当前采用 7 个以上的位置参数 class User constructor param1 param2 param3 etc 我想通过选项对象将其转换为命名参数 type UserOptions param1 string cl
  • 如何管理 Rails 引擎 + 虚拟应用程序的迁移

    我刚刚加入了一个开发 Rails 引擎的项目 该项目还有一个用于测试的虚拟应用程序 foo foo spec dummy 存在相同的迁移 foo db migrate foo spec dummy db migrate If I rake
  • 如何捕获 sqlalchemy 上的特定异常?

    我想捕获特定的异常 例如UniqueViolation关于 sqlalchemy 但是 sqlalchemy 只能通过以下方式抛出异常IntegrityError 所以我用下面的代码捕获了特定的异常 except sqlalchemy ex
  • 为什么 Apache 需要 SSLCertificateKeyFile?

    需要 SSLCertificateKeyFile 私钥 的技术原因是什么 它在哪里使用以及用于什么 SSL 证书文件包含 X 509 证书 该证书又包含用于加密的公钥 SSL 证书Key文件包含与证书中的公钥对应的私钥 为了让网络服务器加密
  • 使用特定数字类型而不是其他数字类型有何含义

    将整数存储为特定数字类型 uint8 int16 uint32 int64 等 对内存有何影响 我知道每种类型可以采用的整数范围 但是通过使用适当的类型是否可以实现一定的内存效率 例如 在 Golang 中 将某人的年龄存储为 uint8
  • std::out_of_range 异常不会抛出

    The following code works fine throwing a std out of range exception std vector
  • 了解 sprintf(...) 的危险

    OWASP http www owasp org index php Buffer Overruns and Overflows says C 库函数 例如 strcpy strcat sprintf 和 vsprintf 对以 null
  • 使用裸函数指针调用成员函数

    如果您有一个对象和一个指向成员的裸函数指针 那么调用成员函数的最佳方法是什么 本质上我想调用函数指针thiscall调用约定 背景 我正在动态查找共享库中的符号 获取工厂函数指针和指向我想要调用的某个成员函数的指针 成员函数本身不是虚拟的
  • 在 Skylake 中使用 MSR 正确禁用硬件预取

    我正在尝试禁用我的机器上的硬件预取 CPU系列 6 型号 78 型号名称 Intel R Core TM i5 6200U CPU 2 30GHz 我已经检查过 gcc march native Q help target grep Mar
  • 使用 EF 4.1 将父记录和多个子记录作为单个“工作单元”插入

    我正在练习一组代码优先的类 它们之间具有父子关系 public class Parent public int Id get set public string Name get set public List
  • 在 ejb3 中使用数据传输对象是否被认为是最佳实践

    虽然显然单个设计无法涵盖所有 场景 但现在是否普遍认为 ORM 类应该在表示层和业务层 本地或远程 之间来回传递 从而取代对数据传输对象的需求 据我所知 使用 ORM 类带来了不必要的急切加载 上下文管理问题和紧密耦合的问题 但也节省了大量
  • python27 errno 0 和 2 在简单的 for 循环打印中

    我只是使用 python27 在一个简单的 for 循环中打印变量 可以打印出部分结果 但是在输出过程中突然停止 并出现errno 0和2 描述为IOerror 我对这个错误感到非常困惑 这是我的简单代码 def checkPrint fo
  • touchesEnded:withEvent:如何解决触发前的延迟

    在 iPhone OS 上 touchesEnded withEvent 当您离开手指时会快速触发 除非有拖动 如果 touchesMoved withEvent 已触发 则在获得 TouchesEnded withEvent 之前大约有
  • 文本旁边的垂直对齐按钮中间

    我试图将按钮垂直对齐到中间 以便它更适合文本 我尝试过 center block 和 text center 但没有任何运气 我想要一个通用的解决方案 这样我就不会硬编码边距 填充等 这是我的小提琴 http jsfiddle net jh
  • 如何进行选择性 Mongo 恢复?

    假设我有一个Mongo具有两个数据库的副本集 一个主数据库和几个辅助数据库 db1 and db2 中学一所Mongo崩溃并丢失数据 现在当这个Mongo重新启动就会recover并复制both db1 and db2从初级开始 由于这样的
  • 如何在 matlab 中检索函数参数的名称?

    除了解析函数文件之外 还有没有办法获取matlab中函数的输入和输出参数的名称 例如 给定以下函数文件 divide m function value remain divide left right value floor left ri
  • Apple 在应用程序配置中“无法添加卡”

    我正在实施苹果应用程序内配置 并且遵循苹果指南中的所有步骤 但最后 我收到一条消息 无法添加卡 但没有任何错误抛出此过程 这就是我的创作方式PKAddPaymentPassViewController let cardInfoPass PK
  • 重新发送请求角度2

    在 Angular 2 应用程序中 每个对 API 的请求都有带有令牌的标头 以防令牌过期 API 会使用 401 http 代码进行响应 我有一种更新令牌的方法 但是在获取新令牌的过程中如何重新发送先前的请求以暂停其他请求 您可以延长Ht