uniapp封装request头部带token
文章描述:
uniapp封装request方法中如何在header里面加入参数
一、根目录新建utils文件夹,在文件夹里面新建config.js、http.js文件
config.js
let baseurl = null;
if(process.env.NODE_ENV=='development'){
//本地服务器
baseurl = "http://localhost:10003"
}else{
baseurl = "https://www.miyil.com/api"
}
export default baseurl
http.js
import baseurl from "./config.js";
const http = (option)=>{
// console.log(option)
/*
option ={
url:"XXX",
method:"XXX",
data:{XXX},
header:{XXX}
}
*/
return new Promise((resolve,reject)=>{
uni.request({
url:baseurl+option.url,
method:option.method || 'get',
data:option.data||{},
header:option.header || {"content-type":"application/json"},
success:resolve,
fail:reject
})
})
}
export default http
二、在根目录main.js文件载入
/* http */
import http from "./utils/http.js"
Vue.prototype.$http = http
三、页面中使用接口
async getItems(){
let option = {
url: "/index.php",
method:"POST",
header:{'X-Access-Token':'12345678'},
data:{id:'123'}
}
let res = await this.$http(option)
console.log(res)
if(res.data.meta.status !== 200) return uni.$showMsg();
},
根目录main.js封装弹出层方法
// 封装弹框的方法
uni.$showMsg = function(title='数据请求失败', duration = 1500){
uni.showToast({
title,
duration,
icon:'none'
})
}
发布时间:2022/06/09
发表评论