uniapp请求封装

最近使用了uniapp开发了几个项目，参考了网上的一些案例根据自己的项目需求对网络请求做了封装，顺便记下方便以后使用。

首先新建一个utils文件夹，用于放置请求文件，在文件夹中新建两个文件http.js、api.js，http.js用于封装请求和拦截，api.js用于封装具体的接口。

忽略另外两个文件

接下来就是http.js里对请求的封装：

具体的状态码根据后端返回的进行修改

这是基本的接口请求，后面还有上传图片uploadFile的接口请求封装。另外这里的baseUrl = '/api'是h5因为需要跨域做了反向代理，app和小程序只需要将‘/api’替换为请求接口的域名。h5需要在配置文件manifest.js进行配置，点击源码试图在h5可进行配置，配置如下devServer：

target就是后端给的接口域名

下面是上传图片的接口请求：

上传图片的接口是根据uploadFile接口做的封装，file就是图片文件，data是同图片带过去的参数

最后记得将他们export出去：

接下来就是api.js封装接口了：

首先要把http.js文件接过来然后使用它里面的请求，request就是http.js文件，命名可以自己命名；getCode是具体的接口，也是自由命名；params就是参数了

最后就是使用方法了：这种方法可以在页面需要请求时引入，但是这样太烦了尤其是请求很多的时候，所以我将api.js全局挂载到main.js

由于api.js里面有很多个接口，这种引入的方法相当于引入了api列表

使用就很简单了：

在页面直接调用this.$api就可以了