详解微信小程序的 request 封装示例
网络编程 2021-07-04 16:46www.168986.cn编程入门
这篇文章主要介绍了详解微信小程序的 request 封装示例,长沙网络推广觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随长沙网络推广过来看看吧
背景
之前小程序代码混乱,所以新项目一开始就准备弄个微信小程序的 request 的封装
httpUtils.js
const request = function (path, method, data, header) { let user_id = ""; let token = ""; try { user_id = wx.getStorageSync(USER_ID_KEY); token = wx.getStorageSync(TOKEN_KEY); } catch (e) {} header = header || {}; let cookie = []; cookie.push("USERID=" + user_id); cookie.push("TOKEN=" + token); cookie.push("device=" + 1); cookie.push("app_name=" + 1); cookie.push("app_version=" + ENV_VERSION); cookie.push("channel=" + 1); header.cookie = cookie.join("; "); return new Promise((resolve, reject) => { wx.request({//后台请求 url: API_BASE_URL + path, header: header, method: method, data: data, suess: function (res) { if (res.code) { reject(res.data) } else { resolve(res.data) } }, fail: function (res) { reject("not data"); } }); }); };
userLogin.js
const login = function () { try { wx.removeStorageSync(USER_ID_KEY); wx.removeStorageSync(TOKEN_KEY) } catch (e) {} return new Promise((resolve, reject) => { wx.login({ suess: res => { let code = res.code; // 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框 wx.getUserInfo({ withCredentials: true, suess: res => { let userInfo = res.userInfo; let name = userInfo.nickName; let avatar = userInfo.avatarUrl; let sex = userInfo.gender; let data = { code: code, encryptedData: res.encryptedData, iv: res.iv, name: name, avatar: avatar, sex: sex, from: FROM, }; request("/api/user_login/byWeChatApplet", "POST", data).then( (res)=>{ if (!res.code) { try { wx.setStorageSync(USER_ID_KEY, res.user_id); wx.setStorageSync(TOKEN_KEY, res.token) } catch (e) { reject(JSON.stringify(e)); } } resolve(res) }).catch( (errMsg)=>{ reject(errMsg) }); }, fail: function (res) { if (res.errMsg && res.errMsg.startsWith("getUserInfo:fail") && res.errMsg.search("unauthorized") !== -1) { reject("getUserInfo:fail"); return; } wx.getSetting({ suess: (res) => { if (!res.authSetting["scope.userInfo"]) {//没授权 showModal('提示', '需要获取用户的权限,点击确定前往设置,打开用户信息', true, function (res) { wx.openSetting({ suess: (res) => { // 用户返回 不管是否开启 接着去重新登录 login().then( (res)=>{ if (res.code) { reject(res.message); return } try { wx.setStorageSync(USER_ID_KEY, res.user_id); wx.setStorageSync(TOKEN_KEY, res.token) } catch (e) { reject(JSON.stringify(e)); } resolve(res) }).catch( (errMsg)=>{ reject(errMsg) }); } }) }, function () {}) } } }); } }) } }) }); };
项目地址:
一个 vue + thinkphp5.1 搭建的后台管理:
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持狼蚁SEO。
编程语言
- 机械手焊接机器人编程 机械手焊接设备编程
- vb数据库编程实例,vb做数据库
- tiobe世界编程语言排行榜,全球编程语言排行
- 成都java编程培训 成都it编程培训中心
- 编程基础培训,编程基础知识培训
- flash游戏编程基础教程,flash游戏开发教程
- 不会英语能学编程吗 不会英语可以学程序员吗
- 爱心代码编程C语言 爱心代码编程c语言公式
- c语言编程学习入门 c语言编程快速入门
- 西门子plc编程培训 西门子plc编程培训班
- 哪里可以学编程 台州哪里可以学编程
- 少儿编程哪个好 少儿编程哪个品牌好
- 编程是什么意思,图形编程是什么意思
- c语言编程软件下载,c语言编程软件在哪下载
- java编程软件下载,java编程下载手机版
- ug编程培训学校,ug编程培训教程