vue中xss防御-vue xss攻击

第三方分享代码
hacker 2年前 (2022-08-06) 软件技术 240 5

目录介绍:

vue中js-cookie中怎么销毁所有的cookie

设置了 HttpOnly 属性的 cookie 不能使用 JavaScript 经由 Document.cookie 属性、XMLHttpRequest 和 Request APIs 进行访问,以防范跨站脚本攻击(XSS)。

至于为什么这个值会变化,这是跟后端的session机制有关。当你浏览一个网页时,服务端随机产生一个字符串,然后存在你cookie中。当你下次访问时,cookie 会带有这个字符串,由于字符串是随机产生的,而且位数足够多,所以也不担心有人能够伪造。

急急急 tp5.1输出原html标签?

使用vue中的v-html指令,否则会因防止xss攻击不渲染html标签

解决方法如下:

1、双大括号会将数据解释为普通文本,而非 HTML 代码。为了输出真正的 HTML,你需要使用 v-html 指令:

pUsing mustaches: {{ rawHtml }}/ppUsing v-html directive: span v-html="rawHtml"/span/p

2、建议去查看vue的相关的文档,这些东西需要前端做,和tp没有关系的

为什么要同源策略

一个重要原因就是保护cookie,cookie中存着用户的登陆凭证,就相当于用户的账号密码。

想象以下场景,你正吃着火锅唱着歌,突然收到一封邮件说你的银行账号存在安全隐患,点击修复。虽然银行的官方网站是,但是想到你的全部家当24块3毛都在卡里,慌乱的你没有注意这么多点击链接输入帐号密码进行登陆。这个网站其实是

iframe src=""

在你输入帐号密码的时候,如果没有同源策略,外部已经有脚本获取你的输入或者直接通过document.cookie窃取了你的信息并且发送给攻击者了。

那有了同源策略,是不是我们的网站就万无一失了呢。并不是,还有很多其他手段威胁到网站安全,比如xss,csrf,clickJacking,本篇文章就简单阐述一下他们的攻击手段和基础攻防(后续添加)。

xss

Cross Site Script,译为是跨站脚本攻击;其原本缩写是 CSS,但为了和层叠样式表(Cascading Style Sheet)有所区分,因而被迫改名为 XSS。主要分为反射型和储存型。

反射型

反射型的特点是不持久,它的特点是xss的代码出现在访问的链接里,作为一部分输入提交到服务器,然后服务器响应后返回浏览器,然后浏览器执行xss的代码。

一般攻击者通过邮件或者其他途径发送链接,用户点击之后达到攻击目的。

储存型

存储型和反射型的差别仅在于他的攻击代码会存储到服务器。这种攻击的最典型例子就是博客论坛的留言功能,访问包含这条留言的页面时,就会触发攻击代码。

比如某个论坛的个人中心里的个人简介,我们就可以在里面尝试注入代码进行练习,先来测试可用的标签

scriptapimgbodybuttonvardiviframemetaobjectmarqueeisindex inputselectkeygenframesetembedsvgmathvideoaudiotextarea

发现只有a标签存活下来,再来测试属性

a href onmouseover onclick

xss存在的主要原因在于没有对于用户的提交内容和接口的返回内容没有进行严格的过滤。

而防止xss的主要手段也是对输入和url参数进行过滤,对输出进行编码,还有就是cookie设置http-only。像常用的vue就有

const decodingMap = {

'': '',

'': '',

'"': '"',

'': '',

'

': '\n',

' ': '\t',

''': "'"

}

来对输入进行进行过滤,还有百度中输入scriptalert(1)/script也会被转译成scriptalert(1)%2Fscript。

至于http-only,严格来说没有阻止攻击,只是阻止了攻击后的cookie劫持。

php接收到["1009","1007"]这个字符串怎么转成1009,1007或者数组

你要先把html实体(即 quot;)转换为字符(即双引号)再来解析json:

$id=stripslashes(html_entity_decode($id));

print_r(json_decode($id));

web前端需要掌握的哪些知识

一个合格的web前端需要掌握哪些技术?

最基础的自然是JavaScript,HTML和css这三种语言。

首先了解下它们到底是什么。

HTML是用户看到的网页的骨架,比如你会发现当前页面分为左中右三个部分,其中还填充了不同的文字和图片;每个子部分还会继续细分,比如当前页面的中间部分下方有输入框等等。

CSS是网页展示的细节控制,比如你会发现有的文字是红底白色,有的子部分占了页面的二分之一宽,有的只占六分之一,有些部分需要用户进行某些操作(如点击,滑动)才会出现等等,这些就是有CSS来控制。

JavaScript是负责捕捉用户在浏览器上的操作,并与后端服务器进行数据交换的脚本语言。当用户在前端进行点击,输入等操作的时候,会触动绑定了该动作的JavaScript脚本,然后JavaScript收集数据,调用后端的api接口,再将后端返回的数据交给HTML和CSS渲染出来。

一个网页的HTML代码和CSS代码是可以直接在浏览器中查看的,你可以直接按F12,就能看到下图右侧的模块,左右侧红框就是代码与实际页面的对应关系。因此如果你看到某个网站的布局很不错,不妨点击F12,进行学习。

前端框架

然而,实际应用中,已经很少有正规的项目组直接用上述三种语言进行web 前端开发了,而是使用很多封装了这三种语言的框架,比如

Vue.js

,angular,react native等等。它们是来自谷歌和Facebook的大神项目组,基于自己的经验,封装了原生前端语言,实现了更多更复杂更酷炫的功能。因此,可以说,学会使用这些框架,能达到事半功倍的效果。

比如用了vue,它是自底向上增量开发的设计,其核心只关心图层,而且还可以与其他库或已存项目融合,学习门槛极其友好;另一方面,vue可以驱动单文件组件和vue生态系统支持的库开发的复杂单页应用。有了这个生态系统,可以说,vue是处在一个不断壮大,不断完善的欣欣向荣的状态。

网络通信协议

由于前后端分离的趋势,前端还需要了解很多网络通信协议的知识,这里不局限于http协议,因为据我的经验,有时候我们还会用到websocket等协议。因此,前端需要简单了解不同协议的特点以及使用方式,但是好消息是不用像学习计算机网络课程一样对每种协议的原理都了解的特别透彻,只要学会如何用前端语言发送这种协议的请求就够了。

相关推荐

网友评论

  • (*)

最新评论

  • 访客 2022-08-06 07:34:37 回复

    web 前端开发了,而是使用很多封装了这三种语言的框架,比如Vue.js,angular,react native等等。它们是来自谷歌和Facebook的大神项目组,基于自己的经验,封装了原生前端语言,实现了更多更复杂更酷炫的功能。因此,可以说,学会使用这些框架,能达到事

    1
  • 访客 2022-08-06 06:48:13 回复

    含这条留言的页面时,就会触发攻击代码。比如某个论坛的个人中心里的个人简介,我们就可以在里面尝试注入代码进行练习,先来测试可用的标签scriptapimgbodybuttonvardiviframemetaobjectmarqueeisindex inputselectkeyg

    2
  • 访客 2022-08-06 13:54:47 回复

    kie劫持。php接收到["1009","1007"]这个字符串怎么转成1009,1007或者数组你要先把html实体(即 quot;)转换为字符(即双引号)再来解析json:$id=stripslashes(html_entity

    3
  • 访客 2022-08-06 09:51:54 回复

    heet)有所区分,因而被迫改名为 XSS。主要分为反射型和储存型。反射型反射型的特点是不持久,它的特点是xss的代码出现在访问的链接里,作为一部分输入提交到服务器,然后服务器响应后返回浏览器,然后浏览器执行xss的代码。一般攻击者通过邮件或者其他途径发送链接,用户点击之后达到攻击目的。储存型存储

    4
  • 访客 2022-08-06 09:26:04 回复

    2、建议去查看vue的相关的文档,这些东西需要前端做,和tp没有关系的为什么要同源策略一个重要原因就是保护cookie,cookie中存着用户的登陆凭证,就相当于用户的账号密码。想象以下场景,你正吃

    5