赞
踩
前言:
请求拦截器可以在我们需要传递请求头的时候使用,例如:token
也会在当token发生变化的时候给予响应,所以我们做好对应的判断即可
1.首先在根目录创建common文件夹,
在里面创建request.js文件并加入以下代码:
- export default {
- config: {
- //baseURL这里可以放自己的接口域名
- baseURL: "",
- getToken() {
- //获取token
- let token = uni.getStorageSync("userInfo").token;
- if (!token) {
- return uni.reLaunch({ url: "/pages/login/login" });
- }
- return token;
- },
- //获取userid
- getUser() {
- let id = uni.getStorageSync("userInfo").id;
- if (!id) {
- return uni.reLaunch({ url: "/pages/login/login" });
- }
- return id;
- },
- // 响应拦截器
- beforeRequest(options = {}) {
- return new Promise((resolve, reject) => {
- //请求的地址 = 上面设置的域名加上接口封装的地址
- options.url = this.baseURL + options.url;
- options.method = options.method || "POST";
- //添加请求头
- options.header = {
- token: this.getToken(),
- id: this.getUser(),
- };
- resolve(options);
- });
- },
- // 请求拦截器
- handleResponse(data) {
- //自行打印data根据data里的数据进行判断token过期等等
- if (data.data.code == 0 && data.data.msg == "权限错误"){
- uni.showModal({
- title: '提示',
- content: '已掉线,是否重新登录',
- showCancel: true,
- success: ({ confirm, cancel }) => {
- if(confirm){
- uni.redirectTo({ url: '/pages/login/login' })
- }else{
-
- }
- }
- })
- }
- return data;
- },
- },
- // request 请求
- request(options = {}) {
- return this.config
- .beforeRequest(options)
- .then((opt) => {
- return uni.request(opt);
- })
- .then((res) => this.config.handleResponse(res));
- },
- };
-

2,在common文件夹下接着新建一个example.js文件来当作接口封装的文件
- // api/example.js
- import api from "@/common/request.js";
- //把我们刚才写的request.js文件引入过来
- export function pubdemo(data) {
- console.log(data, "传递的参数");
- //使用引入的request发送请求
- return api.request({
- //request.js文件里面已经有前缀了所以这里直接写后面的路径即可
- url: "/api/web/Notice/reminder",
- method: "post",
- data: data,
- });
- }
3,页面内使用
- import { pubdemo } from "@/common/example.js";
- pubdemo({
- //这里是要传递的参数,前面参数名后面参数值
- id: 12,
- }).then((res) => {
- console.log(res.data,res.data);
- });
4,对于一些不用传递参数的接口直接把变量名里面的对象删除即可
- pubdemo().then((res) => {
- console.log(res.data,res.data);
- });
微信小程序跟uniapp同理,只需要把某些东西改一下即可
创作不易,留下免费的双击关注再走吧~
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。