ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

【Angular学习笔记】Angular基本原理 HttpClient

2020-04-06 21:08:12  阅读:275  来源: 互联网

标签:基本原理 RxJS 响应 JSONP 数据 Angular HttpClient


Angular入门开发指南,学习重点知识笔记。

 

 

Angular 基本原理 HttpClient

参考文档:https://angular.cn/guide/http

 

为什么要写服务?

在实战中,数据访问很少能一直这么简单。你通常要对数据做后处理、添加错误处理器,还可能加一些重试逻辑,以便应对网络抽风的情况。

该组件很快就会因为这些数据方式的细节而变得杂乱不堪。组件变得难以理解、难以测试,并且这些数据访问逻辑无法被复用,也无法标准化。

这就是为什么最佳实践中要求把数据展现逻辑从数据访问逻辑中拆分出去,也就是说把数据访问逻辑包装进一个单独的服务中,并且在组件中把数据访问逻辑委托给这个服务。就算是这么简单的应用也要如此。

 

读取完整的响应体

响应体可能并不包含你需要的全部信息。有时候服务器会返回一个特殊的响应头或状态码,以标记出特定的条件,因此读取它们可能是必要的。

要这样做,你就要通过observe选项来告诉HttpClient,你想要完整的响应信息,而不是只有响应体。

 

发起JSONP请求

当服务器不支持CORS协议时,应用程序可以使用HttpClient跨域发出JSONP请求。

Angular的JSONP请求会返回一个Observable,遵循订阅可观察对象变量的模式,并在使用ansync管道管理结果之前,使用RxJS map 运算符转换响应。

在Angular中,通过在NgModule的imports中包含HttpClientJsonpModule来使用JSONP。

 

获取错误详情

在数据访问失败时给用户一些反馈,确实是个好主意。不过,直接显示由HttpClient返回的原始错误数据还远远不够。

检测错误的发生是第一步,不过如果知道具体发生了什么错误才会更有用。

 

可观察对象(Observable)与操作符(operator)

RxJS是一个库,用于把异步调用和基于回调的代码组合成函数式(functional)的、响应式(reactive)的风格。

很多Angular API,包括HttpClient都会生成和消费RxJS的Observable。

RxJS本身超出了本章的范围。你可以在网络上找到更多的学习资源。虽然只用少量的RxJS知识就可以获得解决方案,不过以后你会逐步提高RxJS技能,以便更高效的使用HttpClient

 

HTTP标头

许多服务器需要额外的标头进行保存操作。例如,它们可能需要Content-Type标头来显式声明请求正文的MIME类型;否则服务器可能需要一个授权令牌。

 

添加请求头

 

标签:基本原理,RxJS,响应,JSONP,数据,Angular,HttpClient
来源: https://www.cnblogs.com/cathy1024/p/12646193.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有