微信小程序api封装
写多 之后,吸取之前的经验,瞎写了一个简单的封装api,有幸看到的朋友,就随便看看哈,如果能给到你帮助就一直棒了,额呵呵呵!
- 新建constant.js和api.js文件
- 在constant.js中统一定义ip地址
- api.js文件
对应的返回状态码要根据怎么公司的返回码的规定改了哈
let CONSTANT = require('./constant')
// 从本地存储Storage中获取token值
function getToken() {
return wx.getStorageSync(CONSTANT.TOKEN);
} // 创建请求头header的内容
function buildHeaders(isJson) {
let headers = {
"Content-Type": isJson ? 'application/json' : "application/x-www-form-urlencoded",
"version": CONSTANT.MINI_VERSION,
};
const token = getToken();
if (token) {
headers["token"] = token;
}
return headers;
} // 发起 HTTPS 网络请求。
let baseURL = CONSTANT.API_URL; function fetchApi(baseURL, url, params, method, isJson) {
// wx.getNetworkType判断网路类型。eg:wifi、2g、3g...;none值表示无网路
wx.getNetworkType({
success: function(res) {
// &&表示“并”"none" === e.networkType如果为真,才会去执行&&后面的内容,否则不执行
"none" === res.networkType && (wx.hideLoading(), wx.showModal({
title: "提示",
content: "当前无网络,请检查网络设置后重新加载",
showCancel: false
}));
}
});
return new Promise((resolve, reject) => {
wx.request({
url: `${baseURL}${url}`,
method: method,
header: buildHeaders(isJson),
data: params,
success: function(res) {
// 成功返回statusCode参数表示开发者服务器返回的 HTTP 状态码
// 统一拦截提示错误
// var o = res.statusCode;
// if (o !== 200 && [21020000, 41020001, 41020003, 21020002].indexOf(res.data.status) == -1) {
// wx.hideLoading();
// wx.showModal({
// title: "提示",
// content: res.data.msg
// });
// return;
// } 2020.3.9
// 41020001表示未登录那就要去拿code值
// 21020002表示登录超时
// 并重新请求获取token值
if (41020001 == res.data.status || 21020002 === res.data.status) {
wx.login({
success: res => {
wx.request({
url: baseURL + "/api/user/login",
method: "GET",
header: {
"token": "",
"version": CONSTANT.MINI_VERSION,
},
data: {
code: res.code,
},
success: function(res) {
wx.removeStorageSync(CONSTANT.TOKEN);
if (21020000 === res.data.status) {
wx.setStorageSync(CONSTANT.TOKEN, res.data.data);
console.log("already refresh token");
fetchApi(url, url, params, method);
}
}
});
}
});
}
// 41020003表示未授权了直接跳转到授权页(请求授权获取用户信息)
else if (41020003 == res.data.status) {
wx.redirectTo({
url: "/pages/accredit/accredit"
});
} else {
resolve(res.data);
}
},
fail: function(res) {
reject(res.data);
console.log("network fail.", res);
},
complete: function(res) {
reject(res.data);
// console.log('complete', res);
}
});
});
};
module.exports = {
// 首页
getIndex(params) {
return fetchApi(baseURL, '/api/index', params, 'GET');
},
}
- 引用
在需要的页面引用,也可以只引用你需要的那一个方法也行的额
api.getIndex().then(res => {
......
//那到返回值之后要执行的内容
}
哈哈哈,完了
微信小程序api封装的更多相关文章
- uniapp如何将微信小程序API封装为Promise
var SYNC_API_RE = /requireNativePlugin|upx2px|hideKeyboard|canIUse|^create|Sync$|Manager$/; var CALL ...
- 微信小程序api封装(promise)
顺带这是我平时公司切换改变网络环境 直接上代码,我相信就可以懂了, //app.js function fetchApi(url, type, params, method) { return new ...
- 微信小程序:封装全局的promise异步调用方法
微信小程序:封装全局的promise异步调用方法 一:封装 function POST(url, params) { let promise = new Promise(function (resol ...
- 微信小程序简单封装图片上传组件
微信小程序简单封装图片上传组件 希望自己 "day day up" -----小陶 我从哪里来 在写小程序的时候需要上传图片,个人觉得官方提供的 Uploader 组件不是太好用, ...
- 微信小程序api拦截器
微信小程序api拦截器 完美兼容原生小程序项目 完美兼用小程序api的原本调用方式,无痛迁移 小程序api全Promise化 和axios一样的请求方式 小程序api自定义拦截调用参数和返回结果 强大 ...
- 微信小程序 API
微信小程序 API https://developers.weixin.qq.com/miniprogram/dev/component/cover-view.html demo https://de ...
- 微信小程序API交互的自定义封装
目录 1,起因 2,优化成果 3,实现思路 4,完整代码 1,起因 哪天,正在蚂蚁森林疯狂偷能量的我被boss叫过去,告知我司要做一个线上直播公开课功能的微信小程序,博主第一次写小程序,复习了下文档, ...
- 微信小程序之封装http请求
下面将封装http请求服务部分的服务以及引用部分 // 本服务用于封装请求 // 返回的是一个promisepromise var sendRrquest = function (url, metho ...
- 微信小程序网络封装-简单高效
废话引言 小程序虽然出世很久了,但一直没怎么接触到小程序开发.吉他兴趣班老师想弄一个小程序发布课程信息和打卡功能,作为IT一员就自愿加入了这个小程序开发小组中.虽然小程序面向的是前端工程师,但作为移动 ...
随机推荐
- loadrunner通过odbc测mysql数据库语句
#include "lrd.h" Action() { double trans_time; //定义一个double型变量用来保存事务执行时间 static LRD_INIT_ ...
- 用PHP实现的快速排序算法(支持记录原始数组下标)
代码如下 <?php /** * 快速排序 */ define("MAX_LENGTH_INSERT_SORT", 7); class QuickSort { /** * 交 ...
- 【Mood】在COVID-19疫情中
看完网课(这还得从一只蝙蝠说起...),本来准备刷几道题. 还是来记录下这次事件吧. 2月1号,病毒感染人数破万. 接下来4天(今日6号)疫情走向爆发期. 每日平均新增发病人数达到了3000~4000 ...
- C#开发BIMFACE系列30 服务端API之模型对比1:发起模型对比
系列目录 [已更新最新开发文章,点击查看详细] 在实际项目中,由于需求变更经常需要对模型文件进行修改.为了便于用户了解模型在修改前后发生的变化,BIMFACE提供了模型在线对比功能,可以利用在 ...
- idea通过maven打jar包不成功或无法加载主类或打成功也找不到jar包
这个问题纠结了我一天,在网上也搜了一些方法,现在把我自己的处理过程记录一下,以方便遇到此类问题的小伙伴参考: 第一步:查看idea的jdk版本与Windows安装的jdk是不是同一个版本,如下图 第二 ...
- 难住了同事:Java 方法调用到底是传值还是传引用
Java 方法调用中的参数是值传递还是引用传递呢?相信每个做开发的同学都碰到过传这个问题,不光是做 Java 的同学,用 C#.Python 开发的同学同样肯定遇到过这个问题,而且很有可能不止一次. ...
- css中grid属性的使用
grid布局 加在父元素上的属性 grid-template-columns/grid-template-rows 定义元素的行或列的宽高 如果父元素被等分成了9等分,则,不管有多少个子元素,都显示9 ...
- 学h5前端开发前必知的三大流行趋势
学h5前端开发前必知的三大流行趋势 随着互联网时代的飞速发展,各种互联网的Web应用程序层出不穷,很多人对于HTML5前端开发的过程充满了好奇,但是却没有了解到前端开发的未来发展趋势.下面,云慧学院专 ...
- 关于java性能优化细节方面的建议
在Javva程序中,性能问题的大部分原因并不在于Java语言,而是程序本身,养成一个良好的编码习惯非常重要,能够显著地提升程序性能.下面来聊聊该方面的建议: 1.尽量在合适的场合使用单例: 所谓单例, ...
- 关于integer overflow错误
前端突然报了integer overflow错误,int类型溢出也就是数字超过了int类型,一看很懵逼,查看后台日期发现是在Math.toIntExact()方法报错 那么我们看下方法内部代码: /* ...