第一步: npm i uni-request -S
uni-app目录中默认是没有package.json文件,我们需要通过npm init进行生 成,生成之后就可以执行上面的命令
第二步:
import uniRequest from 'uni-request'
uniRequest.defaults.baseURL = '这里输入请求的网址'
uniRequest.defaults.headers['X-Requested-With'] = 'XMLHttpRequest'
uniRequest.timeout = 1000 * 60 //这里设置超时
/* 下面就是对请求进行拦截,设置token
在拦截时,对请求加入了一个时间参数t,加入这个参数的目的就是防止从缓存直接读取,因为每一次请求t参数的值都是不一样的 */
uniRequest.interceptors.request.use(request => {
let token = uni.getStorageSync('token') || ''
if (token) {
request.headers['token'] = token
}
request.headers['Content-Type'] = 'application/json; charset=utf-8'
if (request.method == 'post') {
request.data = {
...request.data,
t: new Date().getTime()
}
} else if (request.method == 'get') {
request.params = {
...request.params,
t: new Date().getTime()
}
}
return request
}, err => {
return Promise.reject(err)
})
/* 对响应的结果进行处理,根据具体情况封装*/
uniRequest.interceptors.response.use( response => {
if (response.data && response.data.code === 500 && response.data.msg !== "手机号未注册") {
uni.showToast({
icon: 'error',
title: response.data.msg,
duration: 2000
})
}
if (response.data && response.data.code === 401) {
uni.reLaunch({
url: '@/pages/login/login'
})
}
return response
}, error => {
if (error.response && error.response.data && error.response.data.msg) {
uni.showToast({
icon: 'error',
title: error.response.data.msg,
duration: 2000
})
}
return Promise.reject(error)
})
function doRequest(method, {url, params = {}, data={}, headers={}}) {
return uniRequest({
url,
method,
data,
params,
headers
})
}
/* 这里只对get post 请求进行,还有其它的,根据具体情况自己可以加的
这样处理完成之后,get,post请求其实形式上是完全一致的, 都是 get | post (url, 参数)*/
const post = (url,data = {}) => doRequest('POST', {url, params: {}, data, headers: {}})
const get = (url, params = {}) => doRequest('GET', {url, params, data: {}, headers: {}})
export default {
post,
get
}