内置指令:
v-html 指令存在的风险:
一般来说,网站的免登录操作主要是通过 cookie 验证的。cookie 来自于服务端,一般是通过身份验证等操作后传递到浏览器。浏览器可以通过 cookie 这一唯一标识向服务端发出请求并经过后端的校验后返回结果。所以 cookie 起到了身份验证的作用。
我们可以通过 document.cookie 从浏览器获取当前网页获取到的 cookie ,理论上来说,只要获得了完整的 cookie 就可以不经过身份验证而登录某个账号。
依照 v-html 的作用,可以向别的页面直接发送当前页面的内容或 cookie ,这样就存在安全问题。
<a href=javascript:location.href="?"+document.cookie>xxx</a>
上述操作即可以向 以参数的形式发送当前页面的 cookie 。
自定义指令:
添加自定义指令是 Vue 中少有的直接操作 DOM 的操作,类似于封装函数。
自定义指令有利用函数、利用对象两种方式,均写在 directives 中。
directives: {demo1(element, binding) {},demo2: {bind(element, binding) {},inserted(element, binding) {},update(element, binding) {}}}
函数式:参数1为当前元素节点(真实DOM),可直接操作,参数2为当前指令的一些属性。
函数被调用的时刻:1.指令与元素绑定时 2.指令所在的模板被重新解析时
对象式:分为多个函数,代表不同时刻调用不同函数