当前位置: 首页 > news >正文

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);
    }

相关文章:

vue页面菜单权限问题解决

带锚点的url,#后面部分后端获取不到. vue的页面是带有#的路由,#后端服务获取不到,只在浏览器端有用. URL 中的哈希符号 (#) 被用来作为网页中的 锚点 使用&#xff0c;锚点的含义就是页面中的某个特定的位置&#xff0c;这个位置可以被快速找到&#xff0c;很类似于在该位置抛…...

C++面试宝典第33题:数组组成最大数

题目 给定一组非负整数nums,重新排列每个数的顺序(每个数不可拆分)使之组成一个最大的整数。注意:输出结果可能非常大,所以你需要返回一个字符串而不是整数。 示例1: 输入:nums = [10, 2] 输出:"210" 示例2: 输入:nums = [3, 30, 34, 5, 9] 输出:"…...

“影像承载初心” 国际数字影像产业园2024首届摄影沙龙诚邀您的参与!

2024年2月29日&#xff0c;树莓集团总部国际数字影像产业园将举行“影像承载初心”2024首届摄影沙龙&#xff0c;活动现场邀请摄影业内大咖与专家共聚成都文创产业园&#xff0c;探讨摄影艺术及影像未来。诚邀您的参与&#xff01; 国际数字影像产业园介绍&#xff1a; 国际数…...

【C语言】while循环语句

&#x1f388;个人主页&#xff1a;豌豆射手^ &#x1f389;欢迎 &#x1f44d;点赞✍评论⭐收藏 &#x1f917;收录专栏&#xff1a;C语言 &#x1f91d;希望本文对您有所裨益&#xff0c;如有不足之处&#xff0c;欢迎在评论区提出指正&#xff0c;让我们共同学习、交流进步&…...

2024数字中国创新大赛·数据要素赛道“能源大数据应用赛”正式上线!参赛指南请查收

近日&#xff0c;由国网福建电力承办的2024数字中国创新大赛能源大数据应用赛正式上线发布。赛事按照数字中国建设、能源革命的战略要求&#xff0c;围绕能源数据要素x、能源数字技术、能源商业模式等热点设置赛题&#xff0c;诚邀社会各界为加快建成新型电力系统出谋划策&…...

react-JSX基本使用

1.目标 能够知道什么是JSX 能够使用JSX创建React元素 能够在JSX中使用JS表达式 能够使用JSX的条件渲染和列表渲染 能够给JSX添加样式 2.目录 JSX的基本使用 JSX中使用JS表达式 JSX的条件渲染 JSX的列表渲染 JSX的样式处理 3.JSX的基本使用 3.1 createElement()的问题 A. …...

学习阶段单片机买esp32还是stm32?

学习阶段单片机买esp32还是stm32? 在开始前我有一些资料&#xff0c;是我根据网友给的问题精心整理了一份「stm32的资料从专业入门到高级教程」&#xff0c; 点个关注在评论区回复“888”之后私信回复“888”&#xff0c;全部无偿共享给大家&#xff01;&#xff01;&#xf…...

【Simulink系列】——Simulink子系统子系统封装模块库技术

声明&#xff1a;本系列博客参考有关专业书籍&#xff0c;截图均为自己实操&#xff0c;仅供交流学习&#xff01; 引入 前面对于简单的动态系统仿真&#xff0c;可以直接建立模型&#xff0c;然后仿真。但是对于复杂的系统&#xff0c;直接建立系统会显得杂乱无章&#xff0…...

一加手机线刷2024版,param预载失败/MSM刷机工具报错

如果之前有刷第三方或者手机出问题&#xff0c;先去下载9008线刷包&#xff0c;可以去去大侠阿木的网站搜索。 这次的主题是param刷机报错&#xff0c;当你确保端口提示有QCOM端口&#xff0c;没有感叹号你需要先卸载设备及其驱动&#xff0c;重新插上手机&#xff0c;在WINDO…...

文件拖放到窗体事件

网上的实现1 实现结果 具体实现代码&#xff1a;注意需要使能允许拖拽 public partial class Form1 : Form {public Form1(){InitializeComponent();this.AllowDrop true; //允许拖拽}private void Form1_DragEnter(object sender, DragEventArgs e){this.Text DateTime.No…...

JAVA集成微信支付V3版JSAPI下单

一、引入微信支付SDK <dependency><groupId>com.github.binarywang</groupId><artifactId>weixin-java-pay</artifactId> </dependency> 二、支付参数封装 Data ConfigurationProperties(prefix "wx.pay") public class WxP…...

opengles 背面剔除介绍(十二)

文章目录 前言一、OpenGL ES 剔除功能简介二、Opengl ES 剔除功能相关的API1.使能剔除功能2. 配置面剔除模式3. 设置剔除面的顺序4. 禁用剔除功能总结参考资料前言 本文主要介绍 opengles3.0 中的背面剔除相关知识,对于绘制3d 图形, 经常会用到它,并且它能提升渲染效率 软硬…...

【深度学习:视频注释】如何为机器学习自动执行视频注释

【深度学习&#xff1a;视频注释】如何为机器学习自动执行视频注释 #1&#xff1a;多目标跟踪 &#xff08;MOT&#xff09; 以确保帧与帧之间的连续性#2&#xff1a;使用插值来填补空白#3: 使用微模型加速人工智能辅助视频注释#4: 自动目标分割提高目标分割质量 自动视频标记通…...

网络编程、UDP、TCP

计算机网络 就是将地理位置不同的具有独立功能的多台计算及外部设备&#xff0c;通过通信线路连接起来&#xff0c;在网络操作系统、网络管理软件以及网络通信协议的管理和协调下&#xff0c;实现资源共享和信息传递的计算机系统 目的 传播交流信息、数据交换、通信 如何做…...

Maya笔记 设置工作目录

Maya会把素材场景等自动保存在工作目录里&#xff0c;我们可以自己定义工作目录 步骤1 创建workspace.mel文件 文件/设置项目 ——>选择一个文件夹&#xff0c;点击设置——>创建默认工作区 这一个后&#xff0c;可以在文件夹里看到.mel文件 步骤2 自动创建文件夹…...

MySQL:连接查询

连接查询是将两个或两个以上的表按照某个条件连接起来&#xff0c;从中选取需要的数据&#xff1b; 查询t_book表数据 查询t_bookType表数据 1、内连接查询 內连接查询是一种最常用的连接查询。内连接查询可以查询两个或者两个以上的表&#xff1b; SELECT * FROM t_book,t_bo…...

歌尔气压计SPA06-003在无人机和手表上的创新应用

随着科技的不断进步&#xff0c;各类智能设备的功能日益强大&#xff0c;其中气压计作为一种能够测量大气压力的传感器&#xff0c;已被广泛应用于多种领域。歌尔气压计以其高精度、低功耗的特点&#xff0c;在无人机和智能手表上的应用尤为突出&#xff0c;为这两个领域的产品…...

从0到1实现五子棋游戏!!

Hello&#xff0c;好久不见宝子们&#xff0c;今天来给大家更一个五子棋的程序~ 我们今天要讲的内容如下&#xff1a; 文章目录 1.五子棋游戏介绍1.1 游戏玩法介绍&#xff1a; 2.准备工作2.1 具体操作流程 3.游戏程序主函数4.初始化棋盘4.1.定义宏变量4.2 初始化棋盘 5.打印…...

二叉树(C/C++)

本篇将较为详细的介绍二叉树的相关知识&#xff0c;以及二叉树的实现。对于二叉树的相关知识&#xff0c;本篇介绍了其概念、特殊的二叉树、性质还有存储结构。 接着对于实现二叉树的每个函数都有其思路讲解&#xff0c;主要的函数分为&#xff1a;遍历&#xff1a;前中后序遍历…...

Django学习笔记-ModelForm使用(完全依赖)

1.创建模型 ,code,name,sex,entrydate 2.模型映射 python manage.py makemigrations myapp01,python manage.py migrate 3.创建模型表单,继承forms.ModelForm,Meta:元数据,models需引入,fields填写引用的模型变量 4.创建testModelForm.html,添加urls 5.views编写testmodelfo…...

后进先出(LIFO)详解

LIFO 是 Last In, First Out 的缩写&#xff0c;中文译为后进先出。这是一种数据结构的工作原则&#xff0c;类似于一摞盘子或一叠书本&#xff1a; 最后放进去的元素最先出来 -想象往筒状容器里放盘子&#xff1a; &#xff08;1&#xff09;你放进的最后一个盘子&#xff08…...

UDP(Echoserver)

网络命令 Ping 命令 检测网络是否连通 使用方法: ping -c 次数 网址ping -c 3 www.baidu.comnetstat 命令 netstat 是一个用来查看网络状态的重要工具. 语法&#xff1a;netstat [选项] 功能&#xff1a;查看网络状态 常用选项&#xff1a; n 拒绝显示别名&#…...

基于数字孪生的水厂可视化平台建设:架构与实践

分享大纲&#xff1a; 1、数字孪生水厂可视化平台建设背景 2、数字孪生水厂可视化平台建设架构 3、数字孪生水厂可视化平台建设成效 近几年&#xff0c;数字孪生水厂的建设开展的如火如荼。作为提升水厂管理效率、优化资源的调度手段&#xff0c;基于数字孪生的水厂可视化平台的…...

python爬虫:Newspaper3k 的详细使用(好用的新闻网站文章抓取和解析的Python库)

更多内容请见: 爬虫和逆向教程-专栏介绍和目录 文章目录 一、Newspaper3k 概述1.1 Newspaper3k 介绍1.2 主要功能1.3 典型应用场景1.4 安装二、基本用法2.2 提取单篇文章的内容2.2 处理多篇文档三、高级选项3.1 自定义配置3.2 分析文章情感四、实战案例4.1 构建新闻摘要聚合器…...

Robots.txt 文件

什么是robots.txt&#xff1f; robots.txt 是一个位于网站根目录下的文本文件&#xff08;如&#xff1a;https://example.com/robots.txt&#xff09;&#xff0c;它用于指导网络爬虫&#xff08;如搜索引擎的蜘蛛程序&#xff09;如何抓取该网站的内容。这个文件遵循 Robots…...

Linux-07 ubuntu 的 chrome 启动不了

文章目录 问题原因解决步骤一、卸载旧版chrome二、重新安装chorme三、启动不了&#xff0c;报错如下四、启动不了&#xff0c;解决如下 总结 问题原因 在应用中可以看到chrome&#xff0c;但是打不开(说明&#xff1a;原来的ubuntu系统出问题了&#xff0c;这个是备用的硬盘&a…...

是否存在路径(FIFOBB算法)

题目描述 一个具有 n 个顶点e条边的无向图&#xff0c;该图顶点的编号依次为0到n-1且不存在顶点与自身相连的边。请使用FIFOBB算法编写程序&#xff0c;确定是否存在从顶点 source到顶点 destination的路径。 输入 第一行两个整数&#xff0c;分别表示n 和 e 的值&#xff08;1…...

今日学习:Spring线程池|并发修改异常|链路丢失|登录续期|VIP过期策略|数值类缓存

文章目录 优雅版线程池ThreadPoolTaskExecutor和ThreadPoolTaskExecutor的装饰器并发修改异常并发修改异常简介实现机制设计原因及意义 使用线程池造成的链路丢失问题线程池导致的链路丢失问题发生原因 常见解决方法更好的解决方法设计精妙之处 登录续期登录续期常见实现方式特…...

IP如何挑?2025年海外专线IP如何购买?

你花了时间和预算买了IP&#xff0c;结果IP质量不佳&#xff0c;项目效率低下不说&#xff0c;还可能带来莫名的网络问题&#xff0c;是不是太闹心了&#xff1f;尤其是在面对海外专线IP时&#xff0c;到底怎么才能买到适合自己的呢&#xff1f;所以&#xff0c;挑IP绝对是个技…...

vulnyx Blogger writeup

信息收集 arp-scan nmap 获取userFlag 上web看看 一个默认的页面&#xff0c;gobuster扫一下目录 可以看到扫出的目录中得到了一个有价值的目录/wordpress&#xff0c;说明目标所使用的cms是wordpress&#xff0c;访问http://192.168.43.213/wordpress/然后查看源码能看到 这…...