JS实现HTTP请求头-Basic Authorization

JavaScript013

JS实现HTTP请求头-Basic Authorization,第1张

HTTP协议中的 Authorization 请求消息头含有服务器用于验证用户代理身份的凭证,通常会在服务器返回 401 Unauthorized 状态码以及 WWW-Authenticate 消息头之后在后续请求中发送此消息头。

格式是Basic字符串+空格+ 用户名:密码 的Base64编码。

将凭证<credentials>部分进行Base64编码,然后再拼接字符串'Basic ',就可以生成基础验证方案。

因为DOMString 是16位编码的字符串,如果有字符超出了8位ASCII编码的字符范围时,在大多数的浏览器中对Unicode字符串调用 window.btoa将会造成一个 Character Out Of Range 的异常。

所以下列方法将UTF-16的 DOMStrin 转码为UTF-8的字符数组然后再编码。

将UTF-16的 DOMString 转码成UTF-8的字符串进行base64编码

使用 eoLinker 发送Basic Auth,输入用户名scar 密码123456

PS: eoLinker是一个很好用的接口管理网站,前端测试很方便

在JS Bin运行后,发现和eoLinker结果一致,成功!!

Authorization

Authentication

Javascript base64

Base64的编码与解码

Base64笔记-阮一峰老师

btoa方法

MockAPI顾名思义是一个模拟的API,它可以模拟真实API的请求并返回数据。MockAPI可用于前后端分离,在项目初期前端可使用MockAPI对系统进行开发,而不需要依赖后端开发好正式的API后才开始进行前端开发。

MockAPI可通过搭建MockServer服务器来实现创建。网上有很多教程,一般需要安装node.js、Mock-API等。搭建比较简单,但前置条件需要服务器或使用虚拟机。

API管理工具可以彻底解决服务器搭建问题,他们有现成的生成MockAPI的功能。以下以Eolinker为例,实现快速创建MockAPI并进行测试。

在Eolinker的API管理界面,新建一个API,若已经存在swagger文档,可快速导入。

手动创建一个用于用户登录的API,填写API所需的信息,其中请求参数有user_name、user_password,详细内容如下:

保存后可以查看详细的API文档。

在API文档上方可以找到MockAPI选项,创建MockAPI,当用户名为percy时,则MockAPI返回用户名不存在。

至此MockAPI就创建成功了,前端开发人员可开始调用MockAPI的url进行开发。

下面我们对该MockAPI进行测试,Eolinker不仅提供了API文档,还提供了测试功能。输入MockAPI的url与正确请求格式与参数,测试后可查看到成功返回设置的返回信息。

使用API管理工具不仅可以快速进行Mock与测试,还可以对API进行管理。相比较于传统的API文档,API管理工具更灵活、强大,为团队创造的价值也更加明显。

演示工具: www.eolinker.com