当前位置:网站首页>如何封装微信小程序的 wx.request() 请求
如何封装微信小程序的 wx.request() 请求
2022-08-02 10:01:00 【王——小喵】
先对 wx.request() 进行基本的请求封装,再继续封装 post 和 get 请求
//在utils/http.js文件中
/**
* 请求相关的封装
*/
let baseUrl = "http://xxx.xxx.xx.xx:xx/"; // 接口地址
let header = {
'content-type': 'application/x-www-form-urlencoded',
'Authorization': wx.getStorageSync("token")?wx.getStorageSync("token"):''
}
/**
* 封装请求
*/
function fetch(options) {
if (options.loading) {
wx.showLoading({
title: '加载中',
mask: true
})
}
return new Promise((resolve, reject) => {
wx.request({
url: baseUrl + options.url,
data: options.data,
header: header,
method: options.method,
success: function(res) {
if (options.loading) {
wx.hideLoading()
}
if (res.data.status != 0) { //根据自己的接口返回值进行判断
// 重新登陆
return false;
}
resolve(res.data); //把请求到的数据发到引用请求的地方
},
fail: function(err) {
if (options.loading) {
wx.hideLoading()
}
wx.showToast({
title: "网络连接超时",
icon: 'none',
duration: 3000,
})
}
})
})
}
/**
* POST 请求
*/
export function post(url, params, loading = true) {
var option = {
url: url,
data: params,
method: 'POST',
loading
}
return fetch(option);
}
/**
* GET请求
*/
export function get(urls, params, loading = true) {
var option = {
url: urls,
data: params,
method: 'GET',
loading
}
return fetch(option);
}使用
//先通过模块化引入
const util = require('../../utils/util.js')
//get请求
http.get('getuserInfo', params).then((res) =>{
console.log(res)
})
//post请求
http.post('findDepartment', params).then( (res) =>{
console.log(res);
})
//也可以使用 async 和 await,比如
async formSubmit(e) {
let params = {
name:e.detail.value.name
passward:e.detail.value.passward
}
//let params = e.detail.value
const res = await http.post('login',params)
if(res.status===0){
//将token和用户信息存到本地
wx.setStorageSync('token', res.token);
wx.setStorageSync('userinfo', res.userinfo);
wx.showToast({
title: res.message,
icon: 'none',
duration: 3000
});
}
}边栏推荐
猜你喜欢

第十五章 多线程

【技术分享】OSPFv3基本原理

日元疲软令游戏机在日本变身“理财产品”:黄牛大赚

链表的实现

WPF 截图控件之文字(七)「仿微信」

云原生应用平台的核心模块有哪些

The k-nearest neighbor method in the notes of Li Hang's "Statistical Learning Methods"

Using the TCP protocol, will there be no packet loss?

百战RHCE(第四十七战:运维工程师必会技-Ansible学习2-Ansible安装配置练习环境)

Re22:读论文 HetSANN An Attention-based Graph Neural Network for Heterogeneous Structural Learning
随机推荐
用汇编实现爱心特效【七夕来袭】
Re22:读论文 HetSANN An Attention-based Graph Neural Network for Heterogeneous Structural Learning
Getting Started with SCM from Scratch (1): Summary of Background Knowledge
8月份的.NET Conf 活动 专注于 .NET MAUI
Pytorch的LSTM参数解释
百战RHCE(第四十七战:运维工程师必会技-Ansible学习2-Ansible安装配置练习环境)
R language ggplot2 visualization: use the ggbarplot function of the ggpubr package to visualize the stacked bar plot, the lab.pos parameter specifies the position of the numerical label of the bar cha
The ggline function of the R language ggpubr package visualizes grouped line graphs, the add parameter is mean_se and dotplot to visualize line graphs of different level averages, and adds error bars
php组件漏洞
瑞吉外卖项目剩余功能补充
Shell脚本实现多选DNS同时批量解析域名IP地址(新更新)
从零开始入门单片机(一):必会背景知识总结
Rear tube implements breadcrumb function
Use the scrapy to climb to save data to mysql to prevent repetition
R语言ggplot2可视化:使用ggpubr包的ggbarplot函数可视化堆叠的柱状图(stacked bar plot)、lab.pos参数指定柱状图的数值标签的位置,lab.col参数指定数值标
armv7与armv8的区别(v8和w12的区别)
【OpenCV】-霍夫变换
阿里巴巴 CTO 程立:开源是基础软件的源头!
使用较广泛的安全测试工具有哪些?
Facebook自动化数据分析方案,广告投放省心省力