浪花 - 响应拦截器(强制登录)

1. 配置响应拦截器

import axios from 'axios';const myAxios = axios.create({baseURL: 'http://localhost:8080/api/',
});myAxios.defaults.withCredentials = true;// 请求拦截器
myAxios.interceptors.request.use(function (config) {// Do something before request is sentconsole.log("发送请求啦...");return config;
}, function (error) {// Do something with request errorreturn Promise.reject(error);
});// 响应拦截器
myAxios.interceptors.response.use(function (response) {// Do something with response dataconsole.log("接收到请求啦...");return response.data;
}, function (error) {// Do something with response errorreturn Promise.reject(error);
});export default myAxios;

2. 强制跳转到登录页面

  • 有些页面只允许用户登录后查看
  • 未登录用户没有权限,后端返回 40100
  • 前端接收到 40100 则跳转到登录页面,要求用户进行登录

// 响应拦截器
myAxios.interceptors.response.use(function (response) {// Do something with response dataconsole.log("接收到请求啦...");// 未登录,强制跳转到登录页if (response?.data?.code === 40100) {const redirectUrl = window.location.href;window.location.href = `/user/login?redirect${redirectUrl}`;}return response.data;
}, function (error) {// Do something with response errorreturn Promise.reject(error);
});export default myAxios;

3. 登录成功跳转到登录之前的页面

  • 记录当前页面,拼接到 url 的 redirect 后面

  • 登录成功,取出 redirect,重定向到 redirect
// 提交登录表单信息
const onSubmit = async (values) => {const res = await myAxios.post('/user/login', {userAccount: userAccount.value,userPassword: userPassword.value,})console.log(res, "用户登录");if (res.code === 0 && res.data) {// 返回到之前的页面const redirectUrl = route.query?.redirect as string ?? '/';window.location.href=redirectUrl;} else {Toast.fail("登录失败");}
};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/650231.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

把批量M3U8网络视频地址转为MP4视频

在数字媒体时代,视频格式的转换已成为一项常见的需求。尤其对于那些经常处理网络视频的用户来说,将M3U8格式的视频转换为更常见的MP4格式是一项必备技能。幸运的是,现在有了固乔剪辑助手这款强大的工具,这一过程变得异常简单。下面…

Android SharedPreferences源码分析

文章目录 Android SharedPreferences源码分析概述基本使用源码分析获取SP对象初始化和读取数据写入数据MemoryCommitResultcommitToMemory()commit()apply()enqueueDiskWrite()writeToFile() 主动等待写回任务结束 总结 Android SharedPreferences源码分析 概述 SharedPrefer…

2024初学编曲免费软件FL Studio21.2.2

FL Studio在业内也被称作“水果”软件,这是一款功能强大、简单易上手的专业编曲软件。软件中的音效插件库拥有超过25种音效插件,能够帮助激发我们的创作灵感。而FL Studio中文还推出了训练营课程,初学者可以在训练营中进行编曲知识的学习&…

Android消息推送 SSE(Server-Sent Events)方案实践

转载请注明出处:https://blog.csdn.net/kong_gu_you_lan/article/details/135777170 本文出自 容华谢后的博客 0.写在前面 最近公司项目用到了消息推送功能,在技术选型的时候想要找一个轻量级的方案,偶然看到一篇文章讲ChatGPT的对话机制是基…

探索半导体制造业中的健永科技RFID读写器的应用方案

一、引言 在当今高度自动化的工业环境中,无线射频识别(RFID)技术已经成为实现高效生产的重要一环。特别是在半导体制造业中,由于产品的高价值和复杂性,生产过程的追踪和管理显得尤为重要。健永科技RFID读写器以其出色…

Java程序设计实验7 | IO流

*本文是博主对Java各种实验的再整理与详解,除了代码部分和解析部分,一些题目还增加了拓展部分(⭐)。拓展部分不是实验报告中原有的内容,而是博主本人自己的补充,以方便大家额外学习、参考。 目录 一、实验…

nginx处理跨域问题

内网服务器A,服务映射到外网端口是8080,app接口请求外网8080端口的接口,出现跨域 下面有两种实现配置 server { listen 6600; server_name localhost; root /opt/runner/target/yongxing-one-map-mobile/; access…

【办公技巧】Excel只读模式怎么改成编辑模式?

Excel文件打开之后,大家可能经常会遇到文件处于只读模式的情况,那么我们应该如何将excel只读模式改成编辑模式呢?今天和大家分享几种情况的解决方法。 首先,大部分的只读模式,打开之后都是没有密码的,只是…

LabVIEW振动信号分析

LabVIEW振动信号分析 介绍如何使用LabVIEW软件实现希尔伯特-黄变换(Hilbert-Huang Transform, HHT),并将其应用于振动信号分析。HHT是一种用于分析非线性、非平稳信号的强大工具,特别适用于旋转机械等复杂系统的振动分析。开发了…

算法训练营第六十天打卡|84.柱状图中最大的矩形

目录 Leetcode84.柱状图中最大的矩形 Leetcode84.柱状图中最大的矩形 文章链接&#xff1a;代码随想录 文章链接&#xff1a;84.柱状图中最大的矩形 思路&#xff1a;暴力双指针&#xff0c;超时 class Solution { public:int largestRectangleArea(vector<int>& he…

一款强大的矢量图形设计软件:Adobe Illustrator 2023 (AI2023)软件介绍

Adobe Illustrator 2023 (AI2023) 是一款强大的矢量图形设计软件&#xff0c;为设计师提供了无限创意和畅行无阻的设计体验。AI2023具备丰富的功能和工具&#xff0c;让用户可以轻松创建精美的矢量图形、插图、徽标和其他设计作品。 AI2023在界面和用户体验方面进行了全面升级…

2024.1.26 寒假训练记录(9)

今天复习了下差分约束&#xff0c;发现用的是SPFA&#xff0c;这个复杂度…害&#xff0c;明天有空整个板子吧&#xff0c;估计也不太用得上了 花了好长时间搞训练赛的题&#xff0c;明天比赛时间刚好把题解写了&#xff0c;明天再学学网络流好了 文章目录 CF 1798A Showstopp…

单片机学习笔记---矩阵键盘

目录 矩阵键盘的介绍 独立按键和矩阵按键的相同之处&#xff1a; 矩阵按键的扫描 代码演示 代码模块化移植 Keil自定义模板步骤&#xff1a; 代码编写 矩阵键盘就是开发板上右下角的这个模块 这一节的代码是基于上一节讲的LCD1602液晶显示屏驱动代码进行的 矩阵键盘的介…

GPT4.5人工智能即将来临,ChatGPT的正面影响和负面影响(好处和坏处),利弊分析

ChatGPT来了&#xff0c;对我们影响大不大&#xff1f; 近年来&#xff0c;人工智能技术的飞速进步催生了ChatGPT——一种强大的人工智能语言模型。其杰出的生成能力使其能够与人类进行自然、流畅的交流&#xff0c;从而在教育、医疗和娱乐等多个领域展现出巨大的应用潜力。然…

新版UI界面影视小程序亲测无问题带详细搭建教程

新版UI界面影视小程序亲测无问题带详细搭建教程 环境php7.0 — fileinfo–redis–sg11 mysql5.5 apache2.4 添加站点php7.0—-创建ftp—-上传后端文件《后端文件修改&#xff0c;/maccms/wxapi/config/dbs.php–修改当前数据库》—-设置ssl—-打开数据库安装cms 安装好后管…

4. sass实用函数归纳

4. sass实用函数归纳 字符串函数 1、quote(string) 给字符串添加引号 quote(xiaoming) // "xiaoming"2、unquote(string) 移除字符串的引号 unquote("xiaoming") // xiaoming3、str-index(string, substring) 返回 substring 子字符串第一次在 stri…

仰暮计划|“星星之火可以燎原,平凡人的一生同样值得称赞

传递助老之情&#xff0c;践行为老初心。为学习和发扬助老为老精神&#xff0c;我参与了康乐忆享实践队开展的以“仰暮计划”为主题的实践活动&#xff0c;在实践过程中了解老人的人生经历&#xff0c;传播尊老爱老思想。我与老人谭爷爷在谈论家常时&#xff0c;他拿出年轻时的…

【项目日记(五)】第二层: 中心缓存的具体实现(上)

&#x1f493;博主CSDN主页:杭电码农-NEO&#x1f493;   ⏩专栏分类:项目日记-高并发内存池⏪   &#x1f69a;代码仓库:NEO的学习日记&#x1f69a;   &#x1f339;关注我&#x1faf5;带你做项目   &#x1f51d;&#x1f51d; 开发环境: Visual Studio 2022 项目日…

CentOS安装Redis教程-shell脚本一键安装配置

文章目录 前言一、Redis单机版安装教程1. 复制脚本2. 增加执行权限3. 执行脚本 二、Redis扩展集群版安装教程1. 安装Redis单机版2. 复制脚本3. 增加执行权限4. 执行脚本5. 测试6. redis_cluster.sh 命令6.1 启动Redis扩展集群6.2 停止Redis扩展集群6.3 查看Redis扩展集群节点信…

手写rpc和redis

rpc框架搭建 consumer 消费者应用 provider 提供的服务 Provider-common 公共类模块 rpc 架构 service-Registration 服务发现 nacos nacos配置中心 load-balancing 负载均衡 redis-trench 手写redis实现和链接 package com.trench.protocol;import com.trench.enumUtil.Redis…