基于
wx.request
二次封装的请求器
npm i request-miniprogram
然后选择微信开发者工具的菜单栏 "工具"
--- "构建npm"
再引用就可以使用
import {Application} from "request-miniprogram"
// 该方法接收一个对象,用于该单例的配置初始化
Application.configure({});
// 获取请求api地址
Application.getHost();
// 重定向至授权页
Application.redirectToAuthPage();
// 重定向页面
Application.toRedirectionPage();
app.js
import {Application} from "request-miniprogram"
App({
onLaunch: function () {
// 应用启动时初始化配置
Application.configure({
host: 'http://laravel.test/api', // 全局请求api
authPage: '/pages/auth/index', // 授权页
redirectPage: '/pages/home/index', // 重定向页面
globalData:{}, // 全局数据
});
},
});
import {Auth} from "request-miniprogram";
// 登录
Auth.login(scope, expiration);
// 获取令牌
Auth.token();
// 清除会话
Auth.logout();
// 监听器,当令牌失效时,将自动删除令牌,并退出当前会话
Auth.listener();
// 判断当前用户是否为访客
Auth.guest();
// 判断当前用户是否登录
Auth.check();
// 获取Application实例
Auth.getApp();
存储token例子
auth().then((response) => {
const {token_type, access_token, expiration} = response.data;
Auth.login(access_token, expiration);
});
- 前置拦截器
请求前会进行api域名检查,如果未配置或配置错误,将被触发
- 后置拦截器
当后端返回
401,403,404,422,500
状态码时,该拦截器将被触发
当状态码为
401
时,需要验证的页面将会跳转至授权页
当状态码为
404
时,会跳转至首页
import {RESTFul} from "request-miniprogram";
请求器会自动为您处理请求接口,可以根据你的个人习惯书写为: /users
或users
请求方式:
GET
RESTFul.get('users').then((response) => {
// DoSomething...
})
// 查询/获取资源
const query = {name: '张三', phone: 15689324465,};
RESTFul.get('users', query).then((response) => {
// DoSomething...
})
请求方式:
POST
const uid = 22;
RESTFul.getDetails('users', uid).then((response) => {
// DoSomething...
})
请求方式:
POST
const user = {
name: 'jack',
age: 20,
sex: 1,
};
RESTFul.post('users', user).then((response) => {
// DoSomething...
})
请求方式:
PATCH
const user = {
id: 1,
name: 'jack',
age: 20,
sex: 1,
};
RESTFul.update('users', user).then((response) => {
// DoSomething...
})
请求方式:
DELETE
const id = 20;
RESTFul.delete('users', {id}).then((response) => {
// DoSomething...
})
// 批量删除
const ids = [1, 2, 3, 4, 5];
RESTFul.delete('users', ids).then((response) => {
// DoSomething...
})
请求方式:
POST
const file = e.detail.files[0];
const directory = '/var/html/images'
RESTFul.upload('users/upload', {filePath: file, fileName: 'img', uploadDirectory: directory}).then((response) => {
// Dosomething
})
MIT