建议把所有请求抽离到不同页面对应的js文件中,可以方便后期的修改和排查问题,小程序请求是通过微信后台来请求我们的后台地址来进行后端映射、你请求的接口实际到微信的后端做了一道映射,微信后端拿到你的 wx.request 调用的 url、用后端请求后端,所以不会出现跨域问题
一、新建network文件夹并建立netwrok.js文件
import baseURL from "./config.js";
// 引入baseURL 后面会讲到
export default function request(options){
// options为调用时传入的参数对象
return new Promise((resolve,reject)=>{
wx.request({
header:{
'pc-token':'4a82b23dbbf3b23fd8aa291076e660ec'
//定义公共头部信息
},
url:baseURL+options.url,
// 拼接请求地址
data:options.data||{},
// 传入data参数
method:options.method||'get',
// 传入请求类型默认为get
success:function(res){
resolve(res)
// 成功回调
},
fail:function(res){
reject(res)
// 失败回调
}
})
})
}
二、在network中建立config.js文件配置公共信息
const baseURL='http://xxxxxxxxxxx'
// 配置公共地址并暴露
export default baseURL
三、建立对应的js文件,配置单个请求文件
import requset from "./network";
// 引入requset请求
export function getList(page){
// 配置当前请求的地址和传入的参数
return requset({
url:"/getCarList",
data:{
page
},
method:'post'
})
}
四、使用
import {getList} from "../../network/req.js";
// 引入封装好的单个请求
// 调用请求获取数据
getList(1).then((res)=>{
this.setData({
list:res.data
})
})
五、跨域的配置,打上对勾即可!