jQuery使用中可能被XSS攻击的一些危险环节提醒


Posted in Javascript onMay 24, 2016

$
我们经常使用向 $ 内传入一个字符串的方式来选择或生成 DOM 元素,但如果这个字符串是来自用户输入的话,那么这种方式就是有风险的。

先看一个 DEMO:http://jsbin.com/duwuzonife/1/edit?html,js,output

$("<img src='' onerror='alert();'>");

当用户输入的字符串是像这样的时,虽然这个 <img> 元素不会马上被插入到网页的 DOM 中,但这个 DOM 元素已经被创建了,并且暂存在内存里。而对于 <img> 元素,只要设置了它的 src 属性,浏览器就会马上请求 src 属性所指向的资源。我们也可以利用这个特性做图片的预加载。在上面的示例代码中,创建元素的同时,也设置了它的属性,包括 src 属性和 onerror 事件监听器,所以浏览器会马上请求图片资源,显然请求不到,随机触发 onerror 的回调函数,也就执行了 JavaScript 代码。

推荐阅读 $ 的官方文档:http://api.jquery.com/jQuery/

类似的其他方法

.after()
.append()
.appendTo()
.before()
.html()
.insertAfter()
.insertBefore()
.prepend()
.prependTo()
.replaceAll()
.replaceWith()
.unwrap()
.wrap()
.wrapAll()
.wrapInner()
.prepend()

以上这些方法不仅创建 DOM 元素,并且会马上插入到页面的 DOM 树中。如果使用 <script> 标签插入了内联 JS 会立即执行。

不安全的输入来源

document.URL *
document.location.pathname *
document.location.href *
document.location.search *
document.location.hash
document.referrer *
window.name
document.cookie

document 的大多数属性都可以通过全局的 window 对象访问到。加 * 的属性返回的时编码 (urlencode) 后的字符串,需要解码才可能造成威胁。

不安全的操作
把可以被用户编辑的字符串,用在以下场景中,都是有隐患的。总体来说,任何把字符串作为可执行的代码的操作,都是不安全的。

1.通过字符串创建函数

(1)eval
(2)new Function
(3)setTimeout/setInterval
2.跳转页面

location.replace/location.assign
修改 <script> 标签的 src 属性
修改事件监听器
总结
如果发生在用 jQuery 时被 DOM-XSS 攻击的情况,大多是因为忽视了两个东西:
1. 在给$传参数时,对参数来源的把控。
2. 用户的输入途径不只有表单,还有地址栏,还可以通过开发者工具直接修改 DOM ,或者直接在控制台执行 JS 代码。

Javascript 相关文章推荐
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
Apr 16 Javascript
Javascript中实现trim()函数的两种方法
Feb 04 Javascript
jQuery支持动态参数将函数绑定到事件上的方法
Mar 17 Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 Javascript
Vue.js系列之项目搭建(1)
Jan 03 Javascript
JS如何实现在页面上快速定位(锚点跳转问题)
Aug 14 Javascript
Vue filter介绍及其使用详解
Oct 21 Javascript
vue scroller返回页面记住滚动位置的实例代码
Jan 29 Javascript
微信小程序页面间值传递的两种方法
Nov 26 Javascript
JavaScript ES6中的简写语法总结与使用技巧
Dec 30 Javascript
详解Vue源码中一些util函数
Apr 24 Javascript
Node使用koa2实现一个简单JWT鉴权的方法
Jan 26 Javascript
详解Node.js模块间共享数据库连接的方法
May 24 #Javascript
轻松掌握jQuery中wrap()与unwrap()函数的用法
May 24 #Javascript
使用jQuery中的wrap()函数操作HTML元素的教程
May 24 #Javascript
实例解析jQuery中proxy()函数的用法
May 24 #Javascript
jQuery前端开发35个小技巧
May 24 #Javascript
JS+Canvas绘制时钟效果
Aug 20 #Javascript
基于JQuery实现图片上传预览与删除操作
May 24 #Javascript
You might like
第八节 访问方式 [8]
2006/10/09 PHP
phpfans留言版用到的install.php
2007/01/04 PHP
分享8个最佳的代码片段在线测试网站
2013/06/29 PHP
将PHP程序中返回的JSON格式数据用gzip压缩输出的方法
2016/03/03 PHP
Laravel解决nesting level错误和隐藏index.php的问题
2019/10/12 PHP
jquery自动完成插件(autocomplete)应用之PHP版
2009/12/15 Javascript
精通Javascript系列之Javascript基础篇
2011/06/07 Javascript
javascript object array方法使用详解
2012/12/03 Javascript
解析offsetHeight,clientHeight,scrollHeight之间的区别
2013/11/20 Javascript
JQuery遍历json数组的3种方法
2014/11/08 Javascript
jQuery调用ajax请求的常见方法汇总
2015/03/24 Javascript
关于JS中prototype的理解
2015/09/07 Javascript
Bootstrap 折叠(Collapse)插件用法实例详解
2016/06/01 Javascript
详解js的事件代理(委托)
2016/12/22 Javascript
react-native之ART绘图方法详解
2017/08/08 Javascript
JS随机排序数组实现方法分析
2017/10/11 Javascript
Vue.js 2.5新特性介绍(推荐)
2017/10/24 Javascript
十分钟教你上手ES2020新特性
2020/02/12 Javascript
JavaScript Tab菜单实现过程解析
2020/05/13 Javascript
[02:03]风行者至宝清风环佩外观展示
2020/09/05 DOTA
使用Python搭建虚拟环境的配置方法
2018/02/28 Python
Python实现计算文件MD5和SHA1的方法示例
2019/06/11 Python
python中比较两个列表的实例方法
2019/07/04 Python
centos+nginx+uwsgi+Django实现IP+port访问服务器
2019/11/15 Python
Python+PyQt5+MySQL实现天气管理系统
2020/06/16 Python
python中plt.imshow与cv2.imshow显示颜色问题
2020/07/16 Python
用Python制作mini翻译器的实现示例
2020/08/17 Python
Python Django路径配置实现过程解析
2020/11/05 Python
HTML5 File接口在web页面上使用文件下载
2017/02/27 HTML / CSS
网易微博Web App用HTML5开发的过程介绍
2012/06/13 HTML / CSS
性能服装:HYLETE
2018/08/14 全球购物
英国在线药房:Chemist.co.uk
2019/03/26 全球购物
JSF如何进行表格处理及取值
2012/08/06 面试题
行政部总经理岗位职责
2014/01/04 职场文书
2015年保育员个人工作总结
2015/05/13 职场文书
《走遍天下书为侣》教学反思
2016/02/22 职场文书