微信小程序网络请求封装API集中管理

common/api目录下创建两个js文件 { apiList.js,api.js }

API列表

javascript 复制代码
// common/api/apiList.js
const BASE_URL = 'https://api.example.com'; // 定义 API 的基础域名

const apiList = {
  getData: BASE_URL + '/data',
  postData: BASE_URL + '/postData',
  // 其他接口路径...
};

module.exports = apiList;

请求封装

javascript 复制代码
// common/api/api.js
const apiList = require('./apiList.js');

const request = (url, method, data) => {
  return new Promise((resolve, reject) => {
    wx.request({
      url: apiList[url], // 使用apiList中的接口路径
      method: method,
      data: data,
      header: {
        'content-type': 'application/json'
      },
      success(res) {
        resolve(res.data);
      },
      fail(err) {
        reject(err);
      }
    })
  })
}

module.exports = {
  request: request
};

使用

javascript 复制代码
// 在需要发送请求的页面或组件中引入api.js
const api = require('../../common/api/api.js');

// 使用封装的请求函数,传入对应的apiList中的接口名称即可
api.request('getData', 'GET', { key: value }).then(res => {
    console.log(res);
    // 请求成功的处理逻辑
}).catch(err => {
    console.log(err);
    // 请求失败的处理逻辑
});

封装完毕 !

每次发起请求时带上 Code

javascript 复制代码
const apiList = require('./apiList.js');

// 定义一个函数来获取用户的code
const getUserCode = () => {
  return new Promise((resolve, reject) => {
    wx.login({
      success: function (res) {
        if (res.code) {
          resolve(res.code);
        } else {
          reject('获取用户code失败');
        }
      },
      fail: function (err) {
        reject(err);
      }
    });
  });
};

// 修改网络请求函数,在调用时获取用户的code并携带在请求的header中
const request = (url, method, data) => {
  return getUserCode().then(code => {
    return new Promise((resolve, reject) => {
      wx.request({
        url: apiList[url], // 使用apiList中的接口路径
        method: method,
        data: data,
        header: {
          'content-type': 'application/json',
          'X-WX-Code': code  // 将code添加到请求的header中
        },
        success(res) {
          resolve(res.data);
        },
        fail(err) {
          reject(err);
        }
      })
    });
  });
};

module.exports = {
  request: request
};
相关推荐
小Tomkk27 分钟前
Rokid 开发空间小程序 实战
3d·小程序·rokid·jsar
说私域1 小时前
基于多模态AI技术的传统行业智能化升级路径研究——以开源AI大模型、AI智能名片与S2B2C商城小程序为例
人工智能·小程序·开源
2501_916007472 小时前
iOS 混淆工具链实战,多工具组合完成 IPA 混淆与加固(iOS混淆|IPA加固|无源码混淆|App 防反编译)
android·ios·小程序·https·uni-app·iphone·webview
游戏开发爱好者84 小时前
FTP 抓包分析实战,命令、被动主动模式要点、FTPS 与 SFTP 区别及真机取证流程
运维·服务器·网络·ios·小程序·uni-app·iphone
努力就够了4 小时前
微信小程序:日常零售供应系统
微信小程序·erp·接单·零售系统
说私域4 小时前
基于开源AI大模型、AI智能名片与S2B2C商城小程序的购物中心精准零售数据架构研究
人工智能·小程序·开源
说私域5 小时前
开源链动2+1模式、AI智能名片与S2B2C商城小程序:社群经济的数字化重构路径
人工智能·小程序·开源
peachSoda76 小时前
封装一个不同跳转方式的通用方法(跳转外部链接,跳转其他小程序,跳转半屏小程序)
前端·javascript·微信小程序·小程序
2501_915909066 小时前
iOS 26 文件管理实战,多工具组合下的 App 数据访问与系统日志调试方案
android·ios·小程序·https·uni-app·iphone·webview
云起SAAS7 小时前
ai周公解梦抖音快手微信小程序看广告流量主开源
微信小程序·小程序·ai编程·看广告变现轻·ai周公解梦