建议把所有请求抽离到不同页面对应的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',// 传入请求类型默认为getsuccess: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})})
五、跨域的配置,打上对勾即可!
如果觉得《微信小程序wx.request请求封装 和跨域的解决。》对你有帮助,请点赞、收藏,并留下你的观点哦!