1. Create a request.js file under the common file, and copy the following content into it
let baseUrl;
// 不带token请求
const httpRequest = (opts, data) => {
if(opts.type == 2){
baseUrl = 'https://www.xxxxx.com/';
}else{
baseUrl = 'https://api.xxxxx.com/';
}
uni.onNetworkStatusChange(function(res) {
if (!res.isConnected) {
uni.showToast({
title: '网络连接不可用！',
icon: 'none'
});
}
return false
});
let httpDefaultOpts = {
url: baseUrl + opts.url,
data: data,
method: opts.method,
header: opts.method == 'get' ? {
'X-Requested-With': 'XMLHttpRequest',
"Accept": "application/json",
"Content-Type": "application/json; charset=UTF-8"
} : {
'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/json; charset=UTF-8'
},
dataType: 'json',
}
let promise = new Promise(function(resolve, reject) {
uni.request(httpDefaultOpts).then(
(res) => {
resolve(res[1])
}
).catch(
(response) => {
reject(response)
}
)
})
return promise
};
//带Token请求
const httpTokenRequest = (opts, data) => {
if(opts.type == 2){
baseUrl = 'https://www.xxxxx.com/';
}else{
baseUrl = 'https://api.xxxxx.com/';
}
uni.onNetworkStatusChange(function(res) {
if (!res.isConnected) {
uni.showToast({
title: '网络连接不可用！',
icon: 'none'
});
}
return false
});
let token = uni.getStorageSync('token');
// hadToken()
if (token == '' || token == undefined || token == null) {
uni.showToast({
title: '账号已过期，请重新登录',
icon: 'none',
complete: function() {
uni.reLaunch({
url: '/pages/login/index'
});
}
});
} else {
let httpDefaultOpts = {
url: baseUrl + opts.url,
data: data,
method: opts.method,
header: opts.method == 'get' ? {
'X-Access-Token': token,
'X-Requested-With': 'XMLHttpRequest',
"Accept": "application/json",
"Content-Type": "application/json; charset=UTF-8"
} : {
'X-Access-Token': token,
'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/json; charset=UTF-8'
},
dataType: 'json',
}
let promise = new Promise(function(resolve, reject) {
uni.request(httpDefaultOpts).then(
(res) => {
if (res[1].data.code == 200) {
resolve(res[1])
} else {
if (res[1].data.code == 5000) {
// uni.showModal({
// title: '提示',
// content: res[1].data.message,
// success: function (res) {
// if (res.confirm) {
// uni.reLaunch({
// url: '/pages/login/login'
// });
// uni.clearStorageSync();
// }
// }
// });
uni.reLaunch({
url: '/pages/login/index'
});
uni.clearStorageSync();
} else {
resolve(res[1])
// uni.showToast({
// title: '' + res[1].data.message,
// icon: 'none'
// })
}
}
}
).catch(
(response) => {
reject(response)
}
)
})
return promise
}
// let token = uni.getStorageSync('token')
//此token是登录成功后后台返回保存在storage中的
};
// 拦截器
const hadToken = () => {
let token = uni.getStorageSync('token');
if (token == '' || token == undefined || token == null) {
uni.showToast({
title: '账号已过期，请重新登录',
icon: 'none',
complete: function() {
uni.reLaunch({
url: '/pages/login/index'
});
}
});
return false;
}
return true
}
export default {
baseUrl,
httpRequest,
httpTokenRequest,
hadToken
}
2. Global introduction
// 导入封装的请求对象
import request from './common/request.js'
Vue.prototype.request = request
3. Single file import
import request from '@/common/request.js'
4. use
let opts = {
url: 'api/blog/detail?id=' + id,
method: 'get'
};
// 全局导入的使用方法
this.$request.httpRequest(opts).then(res => {
console.log(res);
});
// 单文件引入使用方法
request.httpRequest(opts).then(res => {
console.log(res);
});