?

1. Vue基础常用指令循环v-for数组v-for="name in arr" , json格式v-for="name in jason", v-for="(k,v) in json"； {{$index}} , {{$key}}
   
2. 事件v-on:click/mouseout/mouseover/...,如： v-on:click="函数"，该指令可以简写为@click="函数"
   
3. 显示隐藏： v-show="true|false"
   
4. 事件对象 @click="func($event)", 参数$event相当于js中的event
   
5. 事件冒泡，阻止冒泡：js的方式:event.cancleBubble=true或@click.stop
6. 事件默认行为，阻止默认行为：js的方式： event.preventDefault()或contextmenu.prevent
7. 键盘事件：@keydown ，@keyup等等
8. 属性v-bind，如v-bind:src="", 简写:src=""
9. 样式clsaa和style:class="" 或 v-bind:class="":style="" 或 v-bind:style=""
10. 模板文本{{msg}}}，指令v-text=""只输出一次 {{*msg}}html转义输出 {{{msg}}}，指令v-html=""
11. 过滤器：{{msg | filterA}} ，{{msg | filterA, filterB}}
12. 计算属性computed：里面可以放置一些复杂的业务逻辑代码
13. 动画效果transitions：可以结合第三方 CSS 动画库，如 Animate.css 结合使用十分有用

• vue实例简单方法（var vm=new Vue(...)）

1. vm.$el：vue实例挂载的结点元素
   
2. vm.$data：就是data
3. vm.$mount：手动挂载vue
4. vm.$options：获取自定义属性
5. vm.destroy：销毁vue实例
6. vm.$log：查看vue实例现在数据的状态
7. vm.$watch：数据监听

1. entry：配置入口js：main.js
2. output：配置打包后的信息
3. path：输出文件的路径(_dirname：文件当前所在目录地址)
4. filename：输出的文件名称：build.js
5. loaders：下载编译相关文件的loader，如：vue-loader、css-loader、vue-style-loader，vue-html-loader、vue-hot-reload-api等

1. npm install vue-cli -g

• 父子组件通信
  

1. 子组件获取父组件数据：props
2. 父组件获取子组件的数据：父组件可以在使用子组件的地方直接用 v-on 来监听子组件触发的事件使用
3. $on(eventName) 监听事件使用 $emit(eventName) 触发事件

1. ElementUI（PC端）MintUI（移动端）

1. 自定义组件可以使用

|- components/|- loading/ |- loading.vue |- index.js

在loading.vue中按照一般组件的方式定义组件功能及样式模板，然后在index.js中导出组件:index.js

监听路由变化 (使用vue-router) watch(){ $route(to, from){ ... } }

见Web安全攻击手段

一、XSS攻击

• 名词解释：

XSS攻击是跨站脚本攻击(Cross Site Scripting)的简称，为了不和层叠样式表(Cascading Style Sheets, CSS)的缩写混淆，故将跨站脚本攻击缩写为XSS，是最常见的攻击手段之一。

• 基本原理：

攻击者在网页中嵌入恶意脚本程序，当用户打开该网页时，恶意脚本就开始在浏览器执行，得以窃取用户cookie、用户名密码、执行下载木马程序等。

• 防范措施：

1.对用户输入的数据进行HTML转义处理,将其中的<，!-，>,单引号等进行转义编码。

2.利用现有的一些工具或者框架特性自动做转义处理。例如jstl。

二、CRSF攻击

• 名词解释：

CSRF（Cross-site request forgery）是跨站请求伪造，也被称为“One Click Attack”或者Session Riding，通常缩写为CSRF或者XSRF，是一种对网站的恶意利用。也是非常常见的一种攻击手段。跟XSS的有很明显的区别，XSS是利用站内信任用户，CRSF是通过站外伪造信任用户，盗用用户身份，进行攻击。

• 基本原理

攻击者通过盗用你的身份，伪造成你，以你的名义向网站发送恶意的请求，例如利用你的身份发送邮件、发短信、进行交易转账等等。

• 防范措施

1.将cookie设置为httpOnly，这样就无法通过js脚本或者其他程序获取用户cookie，从而让攻击者无法盗取你的身份。

2.每次请求都需要先获取服务器端一个随机token值，会话结束该随机token就失效。

3.通过http头的referer来识别。服务器端验证请求来源地址。

三、恶意sql注入

• 名词解释：

所谓SQL注入，就是通过把SQL命令插入到Web表单提交或输入域名或页面请求的查询字符串，最终达到欺骗服务器执行恶意的SQL命令。

• 基本原理：

把有攻击目的的sql命令伪装成表单或者接口参数，传入服务器，欺骗服务器执行恶意的sql脚本，以达到入侵服务的目的。利用这一漏洞，攻击者可以修改服务器上数据库的表数据、修改表结构、甚至获取用户数据等等。目前大多数数据泄露事故都是通过sql注入实施的。

• 防范措施：

1.使用预编译语句。利用sql中接口PreparedStatement来进行。原理是预编译把sql进行转义了。

2.使用ORM框架进行数据库操作。例如hibernate\ibaties。

3.避免脱敏字段明文储存，万一真被盗了。破解明文可能也非常困难。

4.后端关于数据库的异常不要返回给用户端。让恶意用户没有了解数据库结构的门路。

四、文件上传漏洞

• 名词解释：

文件上传攻击是指攻击者利用WEB应用对上传文件过滤不严，导致可以上传应用程序定义类型范围之外的文件到Web服务器。

• 基本原理：

由于服务器端没有对用户上传的文件进行正确的处理（格式校验），导致攻击者可以向某个可通过 Web 访问的目录上传恶意文件，并且该文件可以被Web服务器解析执行。

• 防范措施：

1.对上传的文件类型做白名单校验（不是黑名单，最小原则）。

2.针对简单的文件后缀无法正确校验文件类型，可以根据文件内容里的魔数进行判断文件类型，从而达到正真校验文件类型的目的。

3.对于图片类型的文件，对图片进行适当的缩放压缩处理，从而改变恶意图片里的二进制结构。也可以防止一些恶意文件上传。例如可以利用imagemagick工具包。

五、DDos攻击

• 名词解释：

是一种分布式拒绝服务攻击，是目前最强大、最难防范的攻击方式之一。理解DDos，首先理解Dos攻击，Dos攻击是利用合理客户端的请求来占用过多的服务器资源，从而使得服务器无法响应。是一对一的方式，传统服务器资源不足的情况下，效果很明显。DDos是Dos基础上产生的一类攻击手段， 当分布式架构出现后，服务器的资源处理能力变强，DDos就将数量庞大的计算机联合起来作为攻击平台，对一个或者多个目标发起攻击，从而达到是的目标主机瘫痪的目的。

• 基本原理：

攻击者会提前控制大量的用户计算机（肉鸡），并通过指令使得大量的肉鸡在同一个时刻对某个主机进行攻击，从而达到瘫痪目标主机的目的。

• 常见手段：

1.SYN Flood

利用tcp的三次握手机制，伪造大量ip,发送syn报文请求，由于都是虚假的ip，导致服务器端收不到客户端ip的确认回应消息，导致服务器维护一个非常大的半链接等待列表，占用服务器资源。

2.DNS Query Flood

攻击者随机生成大量不存在域名地址，对DNS服务器发起域名解析请求，这就导致dns服务器大量的无用域名解析，从而耗费DNS服务器资源，达到瘫痪DNS服务器的目的。

3.CC攻击

是一种属于DDos攻击，是基于http协议发起的DDos攻击，也成为http Flood，攻击者通过控制大量的肉鸡，从互联网上搜索大量的匿名http代理，模拟正常用户给网站发送请求，直到该网站拒绝服务为止。

六、其他攻击方法

利用其他一些平台或者具体软件漏洞的攻击，但是可以肯定的是：攻击的手段永远比防御的手段多。例如：

• DNS域名劫持
• CDN回源攻击
• 服务器权限升级
• 缓冲区溢出

具体的名词解释大家可以网上查阅。

好了。以上就是关于互联网安全架构中常见的web安全攻击手段，以此大家在系统架构考虑安全方面时可以参考。

本文由 @程序员研习社 原创，发布于头条，未经许可，禁止转载

ikuTools - - miku.tools/

作为工具网站大佬MikuTools ，想想很多资深操作党都使用过。光这一个网站就汇聚了50多个操作，分为媒体类、图片处理类、文字处理类、编程类等，其中媒体类是主打功能。

玩Instagram的朋友都知道，这里的图片是无法直接下载的，这个时候你就需要一些工具来辅助下载。MikuTools 就是这些工具的合集网站。一键帮你完成Instagram图片下载、YouTube/TikTok/微博/抖音等视频下载、哔哩哔哩封面获取，甚至可以做到无水印获取哦。操作起来特别简单，电脑小白也会用。选择你需要的工具，然后输入对应链接，就能得到想要的结果。

脚本之家在线工具- -tools.jb51.net/

脚本之家更偏向开发者提供一些工具服务，懂网站开发、编程的人基本一看就懂。这里主要提供HTTP状态码/HTML/XML转义字符、UI尺寸规范对照表、格式化工具（C语言、php代码在线格式化、JSON格式化美化工具等）。同时还有一些站长工具、生活工具，多达300个操作工具。

蛙蛙在线工具- -www.iamwawa.cn/

蛙蛙也是一个实用故居合集网站，开发编程类也有涉及，可以说是前面2个网站的热门共功能合集版。常见的生活工具比如二维码转化、号码归属地查询、繁体字转换器，其他的网络技术类，比如域名查询、CSS格式化、MD5加密等，在这里统统能找到。

以上三个网站，一键就能即可免费使用，比下载N个软件工具要方便得多。400多个操作合集，总有你想要的功能。再不赶紧收藏一份就要错过了！