目录

一、路由拦截器

1、author.js文件（封装持久化存储、取值、移除的方法）

2、拦截器(跳转到登录页面时一定要写‘return false’)

（2）自己写的拦截器

二、请求拦截器

1、下载网址

2、使用方式

（1）拦截器request文件夹内的index.js文件中修改后端的baseUrl网址

（2）在api文件夹内的.js文件中引入拦截器request文件夹内的index.js文件

 （3）使用网络请求时，用service.request()的方法

一、路由拦截器

1、author.js文件（封装持久化存储、取值、移除的方法）

const authorKey = 'AUTHOR-KEY'export const setAuthor = (value)=>{uni.setStorageSync(authorKey,value)}export const getAuthor = ()=>{return uni.getStorageSync(authorKey)}export const removeAuthor = ()=>{uni.removeStorageSync(authorKey)}

2、拦截器(跳转到登录页面时一定要写‘return false’)

不写return false会报错

	
import {getAuthor} from '@/utils/author.js'
export const useRouterInterceptor = () => {const whiteList = ['/', // 注意入口页必须直接写 '/''/pages/login/login','/pages/home/home','/','/pages/detail/detail']const arr = ['switchTab','navigateTo','redirectTo']arr.forEach(item=>{uni.addInterceptor(item, {invoke(args) {// 1. 白名单直接放行// 获取要跳转的页面路径（url去掉"?"和"?"后的参数）let url = args.urlif(url && url.indexOf('?') !== -1){url = args.url.split('?')[0]}let pass = whiteList.some((item) => url === item)if(pass) return args// 2. 统一登录身份认证// 2.1 获取登录保存的token，如果存在放行，不存在跳转到登录界面let token = getAuthor()if(!token) {uni.showToast({title: '请先登录',})uni.navigateTo({url: "/pages/login/login"})return false}console.log('跳转前执行 ', args);return args},})})}

（2）自己写的拦截器

import {getUser,removeUser} from '@/utils/user.js'
export const useRouterInterceptor = () => {//设置可以放行的路由白名单const whiteList = ['/', //首页路径为什么是/'/pages/category/category','/pages/person/person','/pages/login/login']//设置路由拦截的操作const arr = ['navigateTo', 'redirectTo', 'switchTab']arr.forEach(item => {uni.addInterceptor(item, {invoke(args) {let url = args.urlif (url && url.indexOf('?') != -1) {url = url.splite('?')[0]}if (whiteList.some(item => item === url)) returnlet token = getUser()	if (token)returnuni.showToast({title: '请先登录',})uni.navigateTo({url: "/pages/login/login"})return false}})})
}

二、请求拦截器

1、下载网址

uni-app请求拦截器-Typescript文档类资源-CSDN下载

2、使用方式

（1）拦截器request文件夹内的index.js文件中修改后端的baseUrl网址

（2）在api文件夹内的.js文件中引入拦截器request文件夹内的index.js文件

 （3）使用网络请求时，用service.request()的方法

// 请求banner资源
export const RequestBannerList=()=>{return service.request({url:'/api/shop/banner',method:'get',data:''})}

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！