课程名称：2022全面升级. Vue3 + TS 仿知乎专栏企业级项目
课程章节： 7-3 使用 swagger在线文档查看接口详情，7-4 axios 的基本用法和独家后端API 使用（必看），7-5 后端Icode终极使用方案
主讲老师：张轩
课程内容：
了解后端生成的swagger文档
课程收获：
由于前后端分离，前端或者后端无法做到及时协商，最终导致问题爆发，所以程序猿写代码时都是很暴躁的。
这个时候，就可以用到Swagger了，它号称世界上最流行的API框架，Restful Api文档在线自动生成器。还可以在线测试API接口，不必特意去下载Postman，ApiPost去测试接口。还支持多种语言,如：Java，PHP(PHP是世界上最好的语言！)等
接口文档需要包括的点
1.endpoints:具体路径
2.使用什么样的method？
3.发送请求的具体参数
4.请求返回数据的格式
axios是当今前端最流行的请求接口的一个工具，Axios，可以理解为ajax i/o system，这不是一种新技术，本质上还是对原生XMLHttpRequest的封装，可用于浏览器和nodejs的HTTP客户端，只不过它是基于Promise的，符合最新的ES规范。具备以下特点：
1.在浏览器中创建XMLHttpRequest请求
2.在node.js中发送http请求
3.支持Promise API
4.拦截请求和响应
5.转换请求和响应数据
6.取消要求
7.自动转换JSON数据
8.客户端支持防止CSRF/XSRF(跨域请求伪造)
慕课网提供的 Icode 经过几次升级，现在把最终的解决方案整理如下，供同学们参考。
可以在 main.ts 中的拦截器里面一劳永逸的添加。
慕课网提供的 Icode 经过几次升级，现在把最终的解决方案整理如下，供同学们参考。
可以在 main.ts 中的拦截器里面一劳永逸的添加。
// 替换 baseURL
axios.defaults.baseURL = 'http://apis.imooc.com/api/'
// 下面的 icode 值是从慕课网获取的 token 值，可以在课程右侧的项目接口校验码找到
axios.interceptors.request.use(config => {
... 其他代码
// get 请求，添加到 url 中
config.params = { ...config.params, icode: '******' }
// 其他请求，添加到 body 中
// 如果是上传文件，添加到 FormData 中
if (config.data instanceof FormData) {
config.data.append('icode', '******')
} else {
// 普通的 body 对象，添加到 data 中
config.data = { ...config.data, icode: '******' }
}
return config
})
随时随地看视频
