1.新建一个api.js,例举一个登录,有多个接口都可以写在api.js
var loginInfo = '/app/appuser/login';
........多个var省略
export default {
// login:login,//登陆
loginInfo:loginInfo,
..........多个变量省略
};
2.新建一个request.js,用来封装接口
const Url ='http://接口地址';
//登陆 ,未绑定时进行绑定 请求
function loginRequest(url,data){
var promise = new Promise((resolve,reject)=>{
var that = this;
var params = data;
uni.request({
url:Url + url,
data:params,
method:'POST',
header:{
'content-type': 'application/x-www-form-urlencoded'
},
success:function(res){
resolve(res)
},
error:function(error){
reject(error)
}
})
})
return promise
}
//get请求封装
function getRequest(url,data,token){
var promise = new Promise((resolve,reject)=>{
var that = this;
var params;
if(data == undefined || data == ""){
params = {};
}else{
params = data;
}
uni.request({
url:Url + url,
data:params,
method:'GET',
header:{
'content-type': 'application/x-www-form-urlencoded',
'Authorization': token
},
success:function(res){
// uni.hideLoading();
resolve(res)
},
error:function(error){
// uni.hideLoading();
reject(error)
// console.log('js里面的token',token);
}
})
})
return promise
}
//post请求封装
//post 封装
function postRequest(url,data,token){
var promise = new Promise((resolve,reject)=>{
var that = this;
var params = data;
uni.request({
url:Url+url,
data:params,
method:'POST',
header:{
'content-type': 'application/x-www-form-urlencoded',
'Authorization':token
},
success:function(res){
resolve(res)
},
error:function(error){
reject(error)
}
})
})
return promise
}
//将封装的请求方法供外部访问
export default{
postRequest:postRequest,
getRequest:getRequest,
loginRequest:loginRequest
}
3.新建一个httpApi.js文件
const Url ='http://www.hn...';//服务接口地址
export default{
Url:Url,//接口请求头
}
4.在main.js注册
import httpApi from './js/httpApi.js';
import api from './js/api.js';
import request from './js/request.js'
// 赋值到vue里面
Vue.prototype.$httpApi = httpApi
Vue.prototype.$api = api
5.vue页面请求使用
let params = {};
that.$request.getRequest(that.$api.loginInfo ,params,that.token).then(res=>{
// console.log("成功的:",res)
if (res.data.Dispatchlist.length == 0) {
//代码省略
}
}
uniapp封装url
于 2023-01-04 10:37:50 首次发布