uniapp响应拦截器
时间: 2023-09-16 11:08:17 浏览: 244
Uniapp提供了一个全局的请求拦截器和响应拦截器来对网络请求进行处理。
首先,你需要在uniapp项目的根目录下创建一个`common`文件夹,在该文件夹下创建一个`http.js`文件(可以根据自己的需求选择其他名字),用于配置拦截器。
在`http.js`文件中,你可以使用`uni.request`来发送网络请求,并通过设置拦截器来处理请求和响应。
以下是一个示例代码:
```javascript
import Vue from 'vue'
import App from './App'
Vue.config.productionTip = false
App.mpType = 'app'
// 请求拦截器
uni.request.interceptor.request = (options) => {
// 在请求头中添加token等信息
options.header['Authorization'] = 'Bearer ' + uni.getStorageSync('token')
// 返回处理后的请求参数
return options
}
// 响应拦截器
uni.request.interceptor.response = (response) => {
// 处理响应数据,可以根据状态码进行判断
if (response.statusCode === 200) {
return response.data
} else {
// 错误处理
console.error('请求出错', response)
return Promise.reject(response)
}
}
const app = new Vue({
...App
})
app.$mount()
```
在上述代码中,我们通过`uni.request.interceptor.request`来设置请求拦截器,可以在请求头中添加一些信息。通过`uni.request.interceptor.response`来设置响应拦截器,对返回的数据进行处理。
需要注意的是,在请求拦截器和响应拦截器中,我们需要返回处理后的数据,否则请求将会被中断。
以上就是uniapp中设置请求拦截器和响应拦截器的方法,你可以根据自己的需求进行定制化处理。
阅读全文