vue页面菜单权限问题解决

带锚点的url,#后面部分后端获取不到.

vue的页面是带有#的路由,#后端服务获取不到,只在浏览器端有用.

URL 中的哈希符号 (#) 被用来作为网页中的 锚点 使用,锚点的含义就是页面中的某个特定的位置,这个位置可以被快速找到,很类似于在该位置抛了一个锚。

哈希符号 # 右侧的部分,是这个锚点的唯一标志,例如

http://www.example.com/index.html#section

代表了页面 index.html 中存在一个锚点 section,浏览器会自动滚动页面到 section 所指定的位置

下面的例子是如何在 html 中创建一个锚点,首先创建一个超链接,指向该锚点

<a href="#section">锚点跳转</a>

在创建锚点所在的位置,只需要创建一个 div 块,使其 id 为 section

<div id="section"></div>

这样一来,在页面上点击 “锚点跳转” 时,页面将自动滚动到 id=”section” 的位置。同时,在 URL 后面会补充上 #section

URL 中的哈希符号 (#) 用来指示浏览器的操作,对于服务端来说一点用处都没有。所以浏览器(以及我验证过的 http 客户端)发出的 http 请求中是不会携带任何 # 及其右侧数据的。

比如:

http://127.0.0.1:8001/index.html#/home

 

现在要在过滤器中作请求页面的鉴权,就犯难了.后端只能拿到index.html.

那怎么办?

解决方案:

数据库中的菜单配置成index.html/home  然后过滤器中根据index.html/home来鉴权

鉴权通过后,然后重定向到index.html#/home 就可以了

else if (checkSessionIsOk(httpRequest)) {
    //判断当前页面是否能访问 (如果页面出现在菜单中,那么需要分配权限,如果无权限则不能访问)

    //这里的请求url=index.html/home
    boolean canVisit = checkUrlCanVisit((HttpServletRequest) request, url);
    if (!canVisit) {
        httpResponse.sendRedirect("/static/views/error/authFail.html");
        return;
    }
    //请求url
    String staticView = "/index.html";
    if (!url.endsWith(staticView) && url.contains(staticView)) {
        int index = url.indexOf(staticView);
        String routerUrl = url.substring(index, index + staticView.length()) + "?" + httpRequest.getQueryString() + "#" + url.substring(index + staticView.length());
        logger.info("routerUrl:" + routerUrl);

        //这里跳转的页面为routerUrl =  index.html#/home
        ((HttpServletResponse) response).sendRedirect(routerUrl);

    } else {
        chain.doFilter(request, response);
    }

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

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

相关文章

LeetCode 2670.找出不同元素数目差数组

给你一个下标从 0 开始的数组 nums &#xff0c;数组长度为 n 。 nums 的 不同元素数目差 数组可以用一个长度为 n 的数组 diff 表示&#xff0c;其中 diff[i] 等于前缀 nums[0, …, i] 中不同元素的数目 减去 后缀 nums[i 1, …, n - 1] 中不同元素的数目。 返回 nums 的 不…

请求包的大小会影响Redis每秒处理请求数量

文章目录 &#x1f50a;博主介绍&#x1f964;本文内容压测规划客户端长连接数量对性能的影响请求包大小的影响Pipleline模式对Redis的影响 &#x1f4e2;文章总结&#x1f4e5;博主目标 &#x1f50a;博主介绍 &#x1f31f;我是廖志伟&#xff0c;一名Java开发工程师、Java领…

第 2 章 微信小程序的构成 (代码导读)断更,后续继续更新

2.1 小程序项目的基本结构 Hello World&#xff01;程序.mp4 文泉云盘 -- 图书二维码资源管理系统兆泰源二维码管理系统https://www.wqyunpan.com/resourceDetail.html?id284928&openIdoUgl9wdyNYHu9EcAe-GEwbQdZilY&qrcodeId242916&signc2lnbm1PUmNxSndPWGFOck…

51.仿简道云公式函数实战-文本函数-JOIN

1. JOIN函数 JOIN 函数可通过连接符将数组的值连成文本。 2. 函数用法 JOIN(数组,"连接符") 3. 函数示例 如需将复选框中勾选的选项通过”-“组合在一起&#xff0c;则可设置公式为JOIN(复选框组,"-") 4. 代码实战 首先我们在function包下创建text包…

【数据结构】【双堆】【滑动窗口】3013. 将数组分成最小总代价的子数组 II

作者推荐 动态规划的时间复杂度优化 本文涉及的基础知识点 C算法&#xff1a;滑动窗口总结 数据结构 双堆 LeetCode3013. 将数组分成最小总代价的子数组 II 给你一个下标从 0 开始长度为 n 的整数数组 nums 和两个 正 整数 k 和 dist 。 一个数组的 代价 是数组中的 第一个…

JSON简介以及如何在Python中使用JSON

什么是JSON&#xff1f; JSON是"JavaScript Object Notation"的简称&#xff0c;是一种数据交换格式 JSON格式 假设我们有一个对象&#xff0c;这个对象有两个属性&#xff1a;“name”跟“age”。 在JSON中是这样表达的&#xff1a; { "name":"男孩…

vulnhub----hackme2-DHCP靶机

文章目录 一&#xff0c;信息收集1.网段探测2.端口扫描3.目录扫描 二&#xff0c;信息分析三&#xff0c;sql注入1.判断SQL注入2.查询显示位3.查询注入点4.查询库5.查询表6.查字段7. 查user表中的值8.登陆superadmin用户 四&#xff0c;漏洞利用文件上传命令执行蚁剑连接 五&am…

【深入理解设计模式】桥接设计模式

桥接设计模式 桥接设计模式是一种结构型设计模式&#xff0c;它旨在将抽象部分与实现部分分离&#xff0c;使它们可以独立变化&#xff0c;从而更好地管理复杂性。桥接模式通常涉及多个层次的抽象&#xff0c;其中一个层次&#xff08;通常称为"抽象"&#xff09;依…

防御保护----内容安全

八.内容安全--------------------------。 IAE引擎&#xff1a; IAE引擎里面的技术&#xff1a;DFI和DPI技术--- 深度检测技术 DPI --- 深度包检测技术--- 主要针对完整的数据包&#xff08;数据包分片&#xff0c;分段需要重组&#xff09;&#xff0c;之后对 数据包的内容进行…

【leetcode热题】三角形最小路径和

难度&#xff1a; 中等通过率&#xff1a; 37.6%题目链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 题目描述 给定一个三角形&#xff0c;找出自顶向下的最小路径和。每一步只能移动到下一行中相邻的结点上。 例如&#xff0c;给定三角形&#xff1a; [[2],[3…

goland配置新增文件头

参考&#xff1a; goland函数注释生成插件 goland函数注释生成插件_goland自动加函数说明-CSDN博客 GoLand 快速添加方法注释 GoLand 快速添加方法注释_goland批量注释-CSDN博客 goland 如何设置头注释&#xff0c;自定义author和data goland 如何设置头注释&#xff0c;自定…

Web JavaScript

目录 1 前言2 原生js常见用法2.1 弹窗操作2.2 for循环操作2.3 打印日志操作2.4 获取页面值操作2.5 判空操作2.6 修改页面内容操作2.7 网页版计算器制作 3 外部js常见用法4 总结 1 前言 JavaScript 是一种脚本&#xff0c;一门编程语言&#xff0c;它可以在网页上实现复杂的功能…

如何理解Rust中的对象

先看看下面2段代码&#xff0c;第1段代码正常&#xff0c;第2段却编译失败&#xff0c;为什么呢&#xff1f; fn main() {let a: u32 5;let b a;println!("a{a}, b{b}"); }正常 fn main() {let a String::from("Hello");let b a;println!("a{a}…

python中如何引用正则表达式?

无极低码 &#xff1a;https://wheart.cn 引言 正则表达式&#xff08;Regular expressions&#xff0c;也叫 REs、 regexs 或 regex patterns&#xff09;&#xff0c;本质上是嵌入 Python 内部并通过 re 模块提供的一种微小的、高度专业化的编程语言。使用这种小语言&#…

事件循环解析

浏览器的进程模型 何为进程&#xff1f; 程序运行需要有它自己专属的内存空间&#xff0c;可以把这块内存空间简单的理解为进程 每个应用至少有一个进程&#xff0c;进程之间相互独立&#xff0c;即使要通信&#xff0c;也需要双方同意。 何为线程&#xff1f; 有了进程后&…

8.网络游戏逆向分析与漏洞攻防-游戏网络架构逆向分析-游戏底层功能对接类GameProc的实现

内容参考于&#xff1a;易道云信息技术研究院VIP课 上一个内容&#xff1a;通过逆向分析确定游戏明文接收数据过程 码云地址&#xff08;master 分支&#xff09;&#xff1a;https://gitee.com/dye_your_fingers/titan 码云版本号&#xff1a;bcf7559184863febdcad819e48aa…

python number类型中的各种数学函数

python中的数学函数 函数返回值 ( 描述 )abs(x)返回数字的绝对值&#xff0c;如abs(-10) 返回 10ceil(x)返回数字的上入整数&#xff0c;如math.ceil(4.1) 返回 5cmp(x, y)如果 x < y 返回 -1, 如果 x y 返回 0, 如果 x > y 返回 1。Python 3 已废弃&#xff0c;使用 (…

QT信号槽实现分析

1.宏定义 qt中引入了MOC来反射&#xff0c;编译阶段变成 MOC–>预处理–>编译–>汇编–>链接 1-1、Q_OBJECT 这个宏定义了一系列代码&#xff0c;包括元对象和处理的函数 #define Q_OBJECT \public: \QT_WARNING_PUSH \Q_OBJECT_NO_OVERRIDE_WARNING \static c…

如何学习Arduino单片机

&#xff08;本文为简单介绍&#xff0c;内容源于网络&#xff09; 学习Arduino相关的网址和开源社区&#xff1a; Arduino官方文档: Arduino - HomeArduino Forum: Arduino ForumArduino Playground: Arduino Playground - HomePageGitHub: GitHub: Let’s build from here …

AE电源Apex Generator 系列5708009-C 使用说明 文件内容可以看目录,包含使用,调试,安装等内容都有160页

AE电源Apex Generator 系列5708009-C 使用说明 文件内容可以看目录&#xff0c;包含使用&#xff0c;调试&#xff0c;安装等内容都有160页