默认使用方式
page({
...
chooseavatar(event){
const {avatarUrl}=event.detail;
this.setData({avatarUrl})
this.wxUploadFile(avatarUrl);
},
wxUploadFile(avatarUrl){
wx.uploadFile({
filePath: avatarUrl,
name: 'file',
url: 'https://gmall-prod.atguigu.cn/mall-api/fileUpload',
success: (result) => {
console.log("result",JSON.stringify(result))
},
fail: (res) => {},
complete: (res) => {},
})
}
...
})
<button open-type="chooseAvatar" bindchooseavatar="chooseavatar">
<image src="{{avatarUrl}}" mode=""/>
获取微信头像
</button>
封装uploadFile
class WxRequest {
......
request(options){
......
return new Promise((resolve,reject)=>{
......
if(options.method === "UPLOAD"){
wx.uploadFile({
...options,
success:(res)=>{
res.data=JSON.parse(res.data);
const mergeRes = Object.assign({},res,{config:options,isSuccess:true})
resolve(this.interceptors.response(mergeRes))
},
fail:()=>{
const mergeErr = Object.assign({},err,{config:options,isSuccess:false})
reject(this.interceptors.response(mergeErr))
}
})
return
}
......
})
uploadFile(url,filePath,name="file",config={}){
return this.request(Object.assign({url,filePath,name,method:"UPLOAD"},config))
}
}
chooseavatar(event){
const {avatarUrl}=event.detail;
instance.uploadFile("https://gmall-prod.atguigu.cn/mall-api/fileUpload",avatarUrl).then(res=>{
this.setData({avatarUrl:res.data})
})
},
完整代码
class WxRequest {
defaults={
baseURL:"",
url:"",
data:null,
method:"GET",
header:{
"Content-type":"application/json",
},
isLoading:true,
timeout:60000
}
interceptors={
request(config){
return config
},
response(response){
return response
}
}
queue = []
constructor (params={}) {
this.defaults=Object.assign({},this.defaults,params);
}
request(options){
this.timer && clearTimeout(this.timer)
options.url=this.defaults.baseURL+options.url;
options = {...this.defaults,...options}
options=this.interceptors.request(options)
if(options.isLoading && options.method !== "UPLOAD"){
this.queue.length===0 && wx.showLoading();
this.queue.push("request");
}
return new Promise((resolve,reject)=>{
if(options.method === "UPLOAD"){
wx.uploadFile({
...options,
success:(res)=>{
res.data=JSON.parse(res.data);
const mergeRes = Object.assign({},res,{config:options,isSuccess:true})
resolve(this.interceptors.response(mergeRes))
},
fail:()=>{
const mergeErr = Object.assign({},err,{config:options,isSuccess:false})
reject(this.interceptors.response(mergeErr))
}
})
return
}
wx.request({
...options,
success(res){
const mergeRes = Object.assign({},res,{config:options,isSuccess:true})
resolve(this.interceptors.response(mergeRes))
},
fail(err){
const mergeErr = Object.assign({},err,{config:options,isSuccess:false})
reject(this.interceptors.response(mergeErr))
},
complete(){
if(options.isLoading && options.method !== "UPLOAD"){
wx.hideLoading();
this.queue.pop();
this.queue.length === 0 && this.queue.push("request")
this.timer=setTimeout(()=>{
this.queue.pop();
this.queue.length === 0 && wx.hideLoading()
clearTimeout(this.timer)
})
}
}
})
})
}
get(url,data={},config={}){
return this.request(Object.assign({url,data,method:"GET"},config))
}
post(url,data={},config={}){
return this.request(Object.assign({url,data,method:"POST"},config))
}
put(url,data={},config={}){
return this.request(Object.assign({url,data,method:"PUT"},config))
}
delete(url,data={},config={}){
return this.request(Object.assign({url,data,method:"DELETE"},config))
}
uploadFile(url,filePath,name="file",config={}){
return this.request(Object.assign({url,filePath,name,method:"UPLOAD"},config))
}
}
const instance = new WxRequest()
instance.interceptors.request= config =>{
wx.showLoading();
const token="";
if(token){
config.header.token=token
}
return config
}
instance.interceptors.response = response => {
let {isSuccess,data} = response
if(!isSuccess){
wx.showToast({
title: '网络异常',
icon:"error"
})
return response
}
switch (data.code) {
case 200:
return data;
case 208:
return Promise.reject(response);
default :
break;
}
return response
}
export default instance