微信小程序封装请求

http.js

import {
  loginRedirect
} from './index'
export let baseURL = 'https://xxx/prod-api' //线上

// export let baseURL = 'http://xxx/prod-api' //测试

// export let baseURL = 'http://xxx/prod-api' //外网测试

// 加解密
const CryptoJS = require("crypto-js")
const JSEncrypt = require("jsencrypt")
/**
 *
 * @returns 生成不重复的随机序列号  '60a2cd4faec2474ca6ee43aac3b0bc1d'
 * 32位  16进制
 */
function getUUID() {
  var d = new Date().getTime();
  var uuid = "xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx".replace(/[xy]/g, function (c) {
    var r = (d + Math.random() * 16) % 16 | 0;
    d = Math.floor(d / 16);
    return (c == "x" ? r : (r & 0x3) | 0x8).toString(16);
  });
  return uuid;
}
// 定义AES加密函数
// console.log(getUUID(), 999)
let AESKey = getUUID()
// AES加密数据data
function aesEncrypt(data) {
  // 这样写的加密后在线工具可以正常解密,但是后台无法解密
  // return CryptoJS.AES.encrypt(JSON.stringify(data), 'sQPoC/1do9BZMkg8I5c09A==').toString();

  const _key = CryptoJS.enc.Utf8.parse(AESKey) //将秘钥转换成Utf8字节数组
  // const iv = CryptoJS.enc.Utf8.parse(key.substr(0, 16))
  //加密
  const encrypt = CryptoJS.AES.encrypt(JSON.stringify(data), _key, {
    // iv: iv,
    mode: CryptoJS.mode.ECB,
    padding: CryptoJS.pad.Pkcs7
  })
  return encrypt.toString()
}

//定义RSA加密函数,,对AES秘钥加密
function rsaEncrypt(publicKey) {
  var encryptor = new JSEncrypt.JSEncrypt();
  // 假设你已经获取到了后端提供的公钥字符串(key是Base64编码的公钥)
  encryptor.setPublicKey(publicKey);
  //使用公钥加密 
  return encryptor.encrypt(AESKey);
}
module.exports = (url, data, method = "GET", type) => {
  // 返回一个promise实例
  return new Promise((resolve, reject) => {
    // 登录加密
    console.log('request11', url, data)
    let data1 = data
    if (url == "/login") {
      let PublicKey = ''
      if (!wx.getStorageSync("PublicKey")) {
        setTimeout(function () {
          wx.showToast({
            title: '未获取到公钥,请退出重进',
            icon: 'none'
          })
        }, 0)
        return
      } else {
        PublicKey = wx.getStorageSync("PublicKey")
      }
      data1 = {
        data: aesEncrypt(data),
        aesKey: rsaEncrypt(PublicKey), //加密后的私钥
        publicKey: PublicKey
      };
      console.log(data1, 66666)
    } else {
      // 小接口不走加载中提示框
      // 优化方案:可以使用白名单,Map方法处理特殊的接口
      wx.showLoading({
        title: '加载中...'
      });
    }
    // 小程序请求
    wx.request({
      url: baseURL + url,
      data: data1,
      method: method,
      header: {
        'content-type': type || '',
        // 'token': wx.getStorageSync('token'),
        'Authorization': 'Bearer ' + wx.getStorageSync('token'),
      },
      success(res) {
        // console.log('接口地址:', url, '请求参数:', data, '返回结果:', res.data)
        if (res.statusCode == 200) {
          wx.hideLoading();
          // 登录过期,返回401,正常返回200,错误返回
          if (res.data.code == 200) {
            resolve(res.data);
          } else if (res.data.code == 401) {
            loginRedirect()
          } else {
            // 解决错误信息弹窗一闪而过
            wx.showLoading();
            wx.hideLoading();
            setTimeout(function () {
              wx.showToast({
                title: res.data.msg,
                icon: 'none',
                duration: 2000
              })
            }, 0)
            reject(res.data); //可以传入失败回调
          }
        } else if (res.statusCode == 401) {
          loginRedirect()
        } else {
          wx.showToast({
            title: '接口请求失败,接口状态' + res.statusCode,
            icon: 'none',
            duration: 2000
          })
        }
      },
      fail() {
        wx.showToast({
          title: '接口调取失败,请检查网络连接',
          icon: 'none',
          duration: 2000
        })
      },
      complete() {
        wx.hideLoading();
      }
    })
  })
}
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
好的,我会为您详细解析微信小程序封装网络请求代码。 微信小程序中的网络请求有两种方式:一种是使用内置的wx.request()函数,另一种是使用第三方库进行封装。下面我们来介绍一下如何封装网络请求代码。 1. 创建一个request.js文件 首先,我们需要在项目目录下创建一个request.js文件。该文件用于封装网络请求代码。 2. 封装网络请求代码 在request.js文件中,我们可以使用Promise对象来封装网络请求代码。下面是一个基本的封装代码: ``` function request(url, method, data) { return new Promise((resolve, reject) => { wx.request({ url: url, method: method, data: data, success: function (res) { resolve(res.data); }, fail: function (error) { reject(error); } }) }) } module.exports = { request: request } ``` 上面的代码中,我们定义了一个request函数,它接受三个参数:url、method和data。其中,url表示请求的地址,method表示请求的方法(GET或POST),data表示请求的参数。 该函数返回一个Promise对象,当请求成功时,调用resolve方法并传递返回的数据;当请求失败时,调用reject方法并传递错误信息。 3. 在页面中使用封装代码 在页面中使用封装的网络请求代码非常简单。我们只需要在页面的js文件中引入request.js文件,并调用request函数即可。下面是一个示例代码: ``` const request = require('../../utils/request.js'); Page({ data: { list: [] }, onLoad: function () { this.getList(); }, getList: function () { let url = 'https://xxx.xxx.xxx'; // 请求地址 let method = 'GET'; // 请求方法 let data = {}; // 请求参数 request.request(url, method, data) .then(res => { this.setData({ list: res }) }) .catch(error => { console.log(error); }) } }) ``` 上面的代码中,我们在onLoad函数中调用getList函数,该函数使用request函数发起网络请求。当请求成功时,将返回的数据存储到list中;当请求失败时,打印错误信息。 以上就是微信小程序封装网络请求代码的详细解析。希望对您有所帮助!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值