在Angular中httpClient怎么设置超时时间

在angular发送请求中,如果请求的时间太长,用户体验就会不好,比如前端调接口的时候,界面会显示“加载中”,如果请求过长界面就会一直显示“加载中”,当然后端是可以设置超时时间的,过了多少秒,就算连接断开的。
其实angular前端也可以去设置这个超时时间,用timeout(5000)来设置超时时间。

this.httpClient.get(url, { headers: headers })
        .timeout(30000)
        .subscribe(
            (response) => {
                ...
            },
            error => {
                ...
            }
                ...
            );

如果超时(30秒),每个请求都会被取消。它会走error里的处理代码的。
如果是angular6的话,超时处理的方法是pipe/timeout
示例:

this.http.get('https://httpstat.us/200?sleep=5000')
  .pipe(timeout(1000))
  .subscribe(response => {
    console.log('forceTimeout', response);
  }, (error) => {
    console.log('Error', error);
    this.error = error.constructor.name;
  })
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 概述 在PHP开发工作里非常多使用到超时处理的场合,我说几个场景: 异步获取数据如果某个后端数据源获取不成功则跳过...
    Success85阅读 666评论 1 2
  • https://nodejs.org/api/documentation.html 工具模块 Assert 测试 ...
    KeKeMars阅读 6,414评论 0 6
  • 导语 Angular2(已经统一更名为Angular,而Angular1表示1.x版本,以下统称Angular都是...
    cipchk阅读 2,795评论 1 46
  • Swift1> Swift和OC的区别1.1> Swift没有地址/指针的概念1.2> 泛型1.3> 类型严谨 对...
    cosWriter阅读 11,145评论 1 32
  • 桃花开谢了多少次, 燕子飞了多少来回, 无尽无穷的白天黑夜,日出日落, 春来冬去,周而复始。 而你是短暂微弱却又奇...
    zz栀子阅读 171评论 0 0