uniapp 中集成 axios 封装request,实现若依权限认证和若依 api方法共用 - ToB企服应用市场:ToB评测及商务社交产业平台

npm install axios axios-adapter-uniapp

复制代码

import axios from "axios";
import axiosAdapterUniapp from 'axios-adapter-uniapp';
import store from "../store";
import { host } from "./config";

复制代码

const request = axios.create({
baseURL: host,
headers: {
'Content-Type': 'application/json;charset=utf-8',
},
adapter: axiosAdapterUniapp,
timeout: 10000,
});

复制代码

request.interceptors.request.use(function (config) {
// 发送请求的相关逻辑
let token = uni.getStorageSync('My-Token');
if (token) {
config.headers.Authorization = 'Bearer ' + token;
} else {
uni.redirectTo({
url: "/pages/login/login",
});
}
return config;
}, function (error) {
return Promise.reject(error);
});

复制代码

request.interceptors.response.use(res => {
if (res.data.code === "401") {
console.log("认证失败");
uni.redirectTo({
url: "/pages/login/login",
});
}
return res.data;
}, error => {
console.log("获取失败");
console.log(error);
return Promise.reject(new Error('faile'));
});

复制代码

export default request;

复制代码

import request from "./axiosService.js";
// 发送 GET 请求
request.get('/api/users').then(response => {
console.log(response);
}).catch(error => {
console.error(error);
});
// 发送 POST 请求
request.post('/api/users', { name: 'John', age: 30 }).then(response => {
console.log(response);
}).catch(error => {
console.error(error);
});

复制代码

import axios from "axios";
import axiosAdapterUniapp from 'axios-adapter-uniapp'
import store from "../store";
import { host } from "./config";
// 封装axios构造函数请求
// 1.先是自定义一个方法名
// 2.然后获取头部token值
// 3.延长器设不设置都可以
const request = axios.create({
baseURL: host,
headers: {
// X-Litemall-Token这个名称就固定这个
'Content-Type' : 'application/json;charset=utf-8'
},
adapter: axiosAdapterUniapp,
// 超时（毫秒）
timeout: 10000
})
// 前端请求拦截器
request.interceptors.request.use(function (config) {
// 发送请求的相关逻辑
// config:对象与 axios.defaults 相当
// 借助 config 将 localStorage 中的 token 加入请求头
let token = uni.getStorageSync('My-Token')
// 判断token存在就加入请求头
if (token) {
config.headers.Authorization = 'Bearer ' + token
}else{
uni.redirectTo({
url:"/pages/login/login"
})
}
// 这里也可以将一些反爬的加密信息加入请求头中的自定义字段中交由后端进行验证 ---------------
// todo
// ---------------------------------------------------------------------------------
return config
}, function (error) {
// Do something with request error
return Promise.reject(error)
})
// 响应拦截器
// 1.相应上面的请求拦截器的需求
// 2.把上面的请求拦截器的需求全部做到
//TODO 从这里判断，如果返回的是过期则，跳转到登录界面
request.interceptors.response.use(res => {
if(res.data.code=="401"){
console.log("认证失败");
uni.redirectTo({
url:"/pages/login/login"
})
}
return res.data
}, error => {
console.log("获取失败");
console.log(error);
return Promise.reject(new Error('faile'))
})
// 对外暴露前面创建的构造方法
export default request

复制代码

import request from '@/utils/request.js'
// 查询派车单列表
export function listCar(query) {
return request({
url: '/car/car/list',
method: 'get',
params: query
})
}

复制代码

import {listCar } from './api/index.js'
listCar({name:'xxx'}).then(res=>{
console.log(res);
that.carList = res.rows
})

复制代码