1. Cree un request.js en la carpeta utils y escriba el siguiente wx.request() método de encapsulación
const baseURL = 'https:// + '域名' '; //公用总路径地址
export const request = (params) => { //暴露出去一个函数，并且接收一个外部传入的参数
let dataObj = params.data || {}; //拿到传递进来的参数
let headerObj = { //这里 可以添加一些请求头
'content-type': 'application/json'
}
return new Promise((resolve, reject) => { //通过 Promise 对 wx.request 方法进行异步处理。
wx.request({
url: baseURL + params.url, //通过默认的请求地址，再加上外部传入的 具体业务地址，组成一个完整的 请求地址。
method: params.method || "GET", //外部 业务调用请求时，并传入 所需的请求方法，如果没有传递请求方法，则默认为 GET 请求
data: dataObj, //这里的参数，来自于外部传入的参数
header: headerObj,
success: res => {
if (res.statusCode === 200) {
resolve(res); // 请求成功后，调用 Promise 的回调 resolve() 方法，将参数返回出去到 Promise 的实例对象身上。
wx.showToast({
title: "请求成功",
icon: "success"
})
return;
} else {
wx.showToast({
title: "请求失败",
icon: "error"
})
reject(res); //同样请求失败后，向 Promise 实例返回出 错误的信息
}
},
// fail: err => {
// reject(err) //同样请求失败后，向 Promise 实例返回出 错误的信息
// }
})
})
}
2. En el proyecto, cree una nueva carpeta API para la gestión modular de la interfaz de solicitud. La razón de esto es que aunque nuestra interfaz de solicitud está encapsulada, hay demasiados lugares para llamar a la interfaz en todo el proyecto. Si llama directamente colocarlos en sus respectivas páginas también hará que el código sea muy complicado. Por lo tanto, para evitar confusión entre las diferentes llamadas a la interfaz del módulo de funciones, se recomienda extraer la interfaz de solicitud API. De esta manera, la parte js de la página solo se enfoca en Procesamiento lógico de datos antes de la solicitud y después de la respuesta a la solicitud.
api/índice/js
import { request } from "../utils/request"; //导入我们封装的请求方法。
//首页请求接口
export const index = (params) => { //接收页面调用传递过来的参数
return request({ //调用请求方法
url: "/api/science/index", //传入请求地址
method: "GET", //传入请求方法
data : params //这里的参数来自于页面调用时，传过来的参数
})
}
3. El nombre de dominio blanco del servidor debe estar configurado y debe comenzar con https.
Finalmente: en la página, llame a la interfaz API correspondiente en el módulo anterior y pase los parámetros en secuencia. Al mismo tiempo, debido a que nuestro método de solicitud está encapsulado en la forma Promise , cuando se llama a la lógica de la página, también puede usar async y await El método para el código asincrónico está sincronizado.
// const { from } = require("form-data");
import {index} from '../../api/index.js';
// pages/demos/demos.js
Page({
/**
* 页面的初始数据
*/
data: {
},
async getdatas() {
let parameter = {} //页面中，收集处理好，要传递的参数
let data = await index(parameter);
console.log(data);
//data 身上就可以直接拿到，请求回来的数据。
// if (data.statusCode === 200) {
// wx.showToast({
// title: "首页加载成功",
// icon: "success"
// })
// }
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.getdatas();
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})Autor original: Wu Xiaotang
Hora de creación: 2023.12.22