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

news/2024/7/20 1:54:40 标签: 微信小程序, 小程序

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

API列表 

// 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;

请求封装

// 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
};

 使用

// 在需要发送请求的页面或组件中引入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

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
};


http://www.niftyadmin.cn/n/5446126.html

相关文章

C++第十弹---类与对象(七)

✨个人主页: 熬夜学编程的小林 💗系列专栏: 【C语言详解】 【数据结构详解】【C详解】 目录 1、再谈构造函数 1.1、构造函数体赋值 1.2、初始化列表 1.3、explicit关键字 2、static成员 2.1、概念 2.2、特性 2.3、面试题 总结 1、再…

使用Python和OpenFOAM进行流体力学模拟的基础示例

流体力学模拟通常涉及复杂的数学方程和数值方法,例如计算流体动力学(CFD)。OpenFOAM是一个开源的CFD工具箱,它使用C编写,但可以通过Python脚本进行自动化和定制。 以下是一个简单的示例,展示如何使用Python和OpenFOAM进行流体力学…

STM32CubeIDE 1.15.0 LOAD segment with RWX permissions 警告处理

处理办法: 在"xx_FLASH.ld"文件中,找到并添加上(READONLY),即可消除 .ARM.extab (READONLY) :.ARM (READONLY) :.preinit_array (READONLY) :.init_array (READONLY) :.fini_array (READONLY) :

Excel使用VLOOKUP函数

VLOOKUP(lookup_value,table_array,col_index_num,range_lookup) 释义: lookup_value:要查找的值,包括数字,文本等 table_array:要查找的值以及预期返回的内容所在的区域 col_index_num:查找的区域的列…

Axure RP 8中文---快速原型设计工具,一站式解决方案

Axure RP 8是一款专业的快速原型设计工具,以其直观易用的界面和丰富的功能受到广大用户的青睐。它支持用户通过拖放操作快速创建交互式原型,包括线框图、流程图等,并具备高保真度的设计能力。Axure RP 8还提供了团队协作和共享功能&#xff0…

华为配置WLAN 802.1X认证实验

配置WLAN 802.1X认证示例 组网图形 图1 配置802.1X认证组网图 业务需求组网需求数据规划配置思路配置注意事项操作步骤 业务需求 用户接入WLAN网络,使用802.1X客户端进行认证,输入正确的用户名和密码后可以无线上网。且在覆盖区域内移动发生漫游时&…

【算法刷题day4】Leetcode:24. 两两交换链表中的节点、19.删除链表的倒数第N个节点、面试题 02.07. 链表相交、142.环形链表II

24. 两两交换链表中的节点 文档链接:[代码随想录] 题目链接:24. 两两交换链表中的节点 状态:ok 题目: 给定一个链表,两两交换其中相邻的节点,并返回交换后的链表。 你不能只是单纯的改变节点内部的值&#…

web渗透测试漏洞流程:google hacking语法具体语句示例

web渗透测试漏洞流程 渗透测试信息收集---域名信息收集2.1.1.3 GoogleHacking用法示例管理后台地址上传类漏洞地址注入页面编辑器页面目录遍历漏洞SQL错误phpinfo()配置文件泄露数据库文件泄露日志文件泄露备份和历史文件泄露公开文件泄露邮箱信息社工信息搜索文件