├── image ├── vim.png ├── main.png ├── 文件夹权限.png ├── 测试流程.png ├── 第一版块.png ├── 覆盖率检查.png ├── backstop.png ├── rize-err.png ├── karma-err.png ├── karma-succ.png ├── mocha-err.png ├── mocha-succ.png ├── rize-succ.png ├── mocha-error.png ├── mocha-success.png ├── selenium-err.png ├── selenium-succ.png ├── karma-coverage.png ├── karma-coverage1.png ├── JavaScript与QA工程师.png └── 实战JavaScript集成化测试.png ├── security └── xss.md ├── nota └── 第一板块.md └── README.md /image/vim.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/vim.png -------------------------------------------------------------------------------- /image/main.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/main.png -------------------------------------------------------------------------------- /image/文件夹权限.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/文件夹权限.png -------------------------------------------------------------------------------- /image/测试流程.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/测试流程.png -------------------------------------------------------------------------------- /image/第一版块.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/第一版块.png -------------------------------------------------------------------------------- /image/覆盖率检查.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/覆盖率检查.png -------------------------------------------------------------------------------- /image/backstop.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/backstop.png -------------------------------------------------------------------------------- /image/rize-err.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/rize-err.png -------------------------------------------------------------------------------- /image/karma-err.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/karma-err.png -------------------------------------------------------------------------------- /image/karma-succ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/karma-succ.png -------------------------------------------------------------------------------- /image/mocha-err.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/mocha-err.png -------------------------------------------------------------------------------- /image/mocha-succ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/mocha-succ.png -------------------------------------------------------------------------------- /image/rize-succ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/rize-succ.png -------------------------------------------------------------------------------- /image/mocha-error.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/mocha-error.png -------------------------------------------------------------------------------- /image/mocha-success.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/mocha-success.png -------------------------------------------------------------------------------- /image/selenium-err.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/selenium-err.png -------------------------------------------------------------------------------- /image/selenium-succ.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/selenium-succ.png -------------------------------------------------------------------------------- /image/karma-coverage.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/karma-coverage.png -------------------------------------------------------------------------------- /image/karma-coverage1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/karma-coverage1.png -------------------------------------------------------------------------------- /image/JavaScript与QA工程师.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/JavaScript与QA工程师.png -------------------------------------------------------------------------------- /image/实战JavaScript集成化测试.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/hubvue/nota/HEAD/image/实战JavaScript集成化测试.png -------------------------------------------------------------------------------- /security/xss.md: -------------------------------------------------------------------------------- 1 | ### 什么是XSS 2 | `XSS`是跨站脚本攻击，是发生在目标用户浏览器层面上的。当渲染DOM树的过程中发生了再预期内执行的JavaScript代码时，就发生了`XSS`攻击 3 | 4 | ### XSS的攻击方式 5 | `XSS`的攻击方式有三种： 6 | 1. 反射型XSS 7 | 2. 存储型XSS 8 | 3. DOM XSS 9 | 10 | #### 反射型XSS 11 | 反射型XSS也叫非持久型XSS，是指发生请求时，XSS代码出现在请求`URL`中，作为参数提交给服务器，服务器解析并响应，响应结果中包含XSS代码，最后浏览器解析并执行。 12 | 13 | > 总结来说就是:XSS代码首先出现在URL中，然后需要服务端解析并响应给客户端，最后需要浏览器解析之后代码才能执行。 14 | 15 | 这种方式常用于获取用户的`Cookie`，通过对使用未写入`src`的`img`标签设定`onerror = ()=>alert(document.cookie)`获取到用户的cookie信息。 16 | ```html 17 | alert(document.cookie) /> 18 | ``` 19 | #### 存储型XSS 20 | 存储型XSS，也叫做持久型XSS，主要是将XSS代码发送到服务端(无论是数据库、内存还是文件系统)，然后下次请求页面的时候，XSS代码会随着浏览器渲染出来，就不需要手动再次带上XSS代码。 21 | 22 | 这个典型的例子就是留言板，用户提交一条包含XSS代码的留言到数据库，当目标用户查看留言的时候就会从服务器解析之后加载出来，浏览器发现有可执行的代码，就当做正常的HTML和CSS或者JS进行解析，XSS攻击就产生了。 23 | 24 | #### DOM XSS 25 | `DOM XSS` 不同于反射型和存储型，DOM XSS不需要服务端解析之后相应的直接参与，而是通过客户端的DOM解析，完全是客户端的事情。 26 | 27 | 简单的说：`DOM XSS`是我们开发者自己所造成的。在JavaScript中有个`eval`方法，它的作用就是把一串字符串可以当做真正的JavaScript代码来执行。这样就有可能会对我们的代码造成攻击。 28 | 29 | ### XSS的危害 30 | 1. 通过`document.cookie`可以盗取用户的`cookie`。如果是黑客的话，可能还会做一些其他的手段。 31 | 2. 使用JavaScript或者CSS破话页面正常的结构和样式。黑客可以通过在用户端获取到的用户信息发送到黑客的服务器上。 32 | 3. 流量劫持(通过询问某段具有`window.location.href`定位到其他页面，进行流量劫持)。 33 | 4. Dos攻击：利用合理的客户端请求来占用过多的服务端资源，从而使合法用户无法得到服务端响应。 34 | 5. 利用`iframe`、`frame`、`XMLHttpRequest`或`Flash`方式，以被攻击用户的身份执行一些管理动作，或执行一些如：发微博、加好友、发私信等操作。 35 | 6. 利用可被攻击的域收到其他域信任的特点，以受信任来源的身份请求一些平时不允许的操作，如进行不正当的投票活动等等。 36 | 37 | ### XSS防御 38 | 从上面三种XSS类型可以看出，我们不能讲用户提交的数据原样的存到服务器，需要对用户的输入的数据进行一些处理。 39 | 40 | 问题如下： 41 | 1. 没有过滤危险的DOM元素。 42 | 43 | 如：执行脚本能`script`，具有现实广告及色情图片的`img`，具有改变样式的`link`、`style`，具有内嵌页面的`iframe`、`frame`等元素节点。 44 | 2. 没有过滤的属性节点。如：`event`、`style`、`src`、`href`等等。 45 | 3. 没有对`Cookie`设置`httpOnly`。 46 | 47 | ### 解决办法 48 | #### 对Cookie的保护 49 | 通过在服务端设置`httpOnly`,不让客户端使用`document.cookie`来读取`cookie` 50 | 51 | 设置方式 52 | ```js 53 | response.setHeader("Set-Cookie","cookiename=value;path=/;Domain=domainvalue;Max-Age=second;HTTPONly"); 54 | ``` 55 | #### 对用户输入数据的处理 56 | 1. 编码：对用户输入的数据进行实体编码。 57 | 2. 解码：原样显示内容的时候必须解码 58 | 3. 过滤：对一些敏感的DOM元素进行过滤掉，从而保护安全性。 -------------------------------------------------------------------------------- /nota/第一板块.md: -------------------------------------------------------------------------------- 1 | - #### [思维导图](https://github.com/hubvue/nota/blob/master/image/%E7%AC%AC%E4%B8%80%E7%89%88%E5%9D%97.png) 2 | - #### 精英预读班 3 | - [你不知道的HTML](https://github.com/hubvue/nota/issues/13) 4 | - [CSS构建3D世界](https://github.com/hubvue/nota/issues/1) 5 | - [双飞翼布局](https://github.com/hubvue/nota/issues/2) 6 | - [CSS高级技巧--经典IE6BUG](https://github.com/hubvue/nota/issues/3) 7 | - [CSS高级技巧之代码检查及团队规范](https://github.com/hubvue/nota/issues/4) 8 | - [CSS高级技巧之BFC、IFC、FFC、GFC](https://github.com/hubvue/nota/issues/5) 9 | - [CSS与数学的奥秘-clip-path](https://github.com/hubvue/nota/issues/6) 10 | - [CSS与数学的奥秘-动画及贝塞尔曲线](https://github.com/hubvue/nota/issues/7) 11 | - [CSS与数学的奥秘-形态变化和Matrix](https://github.com/hubvue/nota/issues/8) 12 | - [jQuery技术内幕](https://github.com/hubvue/nota/issues/14) 13 | - #### ES5.1新增语法 14 | - [ES5-数组方法](https://github.com/hubvue/nota/issues/12) 15 | - [ES5-Object.prototype上的方法](https://github.com/hubvue/nota/issues/11) 16 | - [ES5-JSON格式](https://github.com/hubvue/nota/issues/10) 17 | - [ES5严格模式及限制](https://github.com/hubvue/nota/issues/9) 18 | - #### Linux基础入门 19 | - [Linux基础入门](https://github.com/hubvue/nota/issues/15) 20 | - [Vim命令合集](https://github.com/hubvue/nota/issues/25) 21 | - #### PHP与MySQL开发入门 22 | - [PHP基础入门](https://github.com/hubvue/nota/issues/16) 23 | - [PHP面向对象--基础](https://github.com/hubvue/nota/issues/17) 24 | - [PHP面向对象--常见的关键字](https://github.com/hubvue/nota/issues/22) 25 | - [PHP面向对象--构造方法和析构方法](https://github.com/hubvue/nota/issues/18) 26 | - [PHP面向对象---封装、继承、多态](https://github.com/hubvue/nota/issues/19) 27 | - [PHP面向对象--抽象类与接口](https://github.com/hubvue/nota/issues/20) 28 | - [PHP异常处理](https://github.com/hubvue/nota/issues/21) 29 | - [PHP与MySQL操作](https://github.com/hubvue/nota/issues/23) 30 | - #### ECMAScript6（未完成） 31 | - [ECMAScript6-变量声明与变量的解构赋值](https://github.com/hubvue/nota/issues/24) 32 | - #### 深度实践（未完成） 33 | - [JavaScript与QA工程师(理论篇)](https://github.com/hubvue/nota/issues/26) 34 | - [Typeof前世今生]() 35 | - #### 直播（未完成） 36 | - [你不知道的CSS]() 37 | - [JavaScript测试试题讲解-2](https://github.com/hubvue/nota/issues/28) 38 | - [来一打JavaScript集成化测试(实战篇)](https://github.com/hubvue/nota/issues/27) 39 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | #### HTML 2 | - [你不知道的HTML](https://github.com/hubvue/nota/issues/13) 3 | #### CSS 4 | - [CSS构建3D世界](https://github.com/hubvue/nota/issues/1) 5 | - [双飞翼布局](https://github.com/hubvue/nota/issues/2) 6 | - [CSS高级技巧--经典IE6BUG](https://github.com/hubvue/nota/issues/3) 7 | - [CSS高级技巧之代码检查及团队规范](https://github.com/hubvue/nota/issues/4) 8 | - [CSS高级技巧之BFC、IFC、FFC、GFC](https://github.com/hubvue/nota/issues/5) 9 | - [CSS与数学的奥秘-clip-path](https://github.com/hubvue/nota/issues/6) 10 | - [CSS与数学的奥秘-动画及贝塞尔曲线](https://github.com/hubvue/nota/issues/7) 11 | - [CSS与数学的奥秘-形态变化和Matrix](https://github.com/hubvue/nota/issues/8) 12 | #### JavaScript 13 | - [ES5-数组方法](https://github.com/hubvue/nota/issues/12) 14 | - [ES5-Object.prototype上的方法](https://github.com/hubvue/nota/issues/11) 15 | - [ES5-JSON格式](https://github.com/hubvue/nota/issues/10) 16 | - [ES5严格模式及限制](https://github.com/hubvue/nota/issues/9) 17 | - [你所不知道的JavaScript面向切面编程](http://blog.ctomorrow.top/2019/03/03/aop/) 18 | #### ES6+ 19 | - [ECMAScript6-变量声明与变量的解构赋值](https://github.com/hubvue/nota/issues/24) 20 | #### jQuery 21 | - [jQuery技术内幕](https://github.com/hubvue/nota/issues/14) 22 | 23 | #### NodeJs 24 | 25 | #### Server 26 | 27 | #### 前端工程化 28 | - [Parcel初体验及特性分析](http://blog.ctomorrow.top/2019/02/26/parcel-start/) 29 | - [yeoman的使用](http://blog.ctomorrow.top/2019/02/26/yeoman/) 30 | - [学习Grunt构建方式](http://blog.ctomorrow.top/2019/02/26/grunt-start/) 31 | - [前端工程化的持续集成](http://blog.ctomorrow.top/2019/02/26/ci-web/) 32 | - [学习browserify](http://blog.ctomorrow.top/2019/02/26/browserify/) 33 | - [学习Bower](http://blog.ctomorrow.top/2019/02/26/bower/) 34 | - [前端工程化Linux预备知识](http://blog.ctomorrow.top/2019/02/26/linux-start/) 35 | - [Linux的免密登录配置](http://blog.ctomorrow.top/2019/02/26/linux-mianmi/) 36 | - [Rollup简单入门](http://blog.ctomorrow.top/2019/02/26/linux-start/) 37 | - [Webpack4:Tree-shaking深度解析](http://blog.ctomorrow.top/2019/02/15/tree-shaking/) 38 | - [前端工程化Linux预备知识](http://blog.ctomorrow.top/2019/02/26/linux-start/) 39 | #### 网络 40 | 41 | #### Performance 42 | - [你所不知道的JavaScript面向切面编程](http://blog.ctomorrow.top/2019/03/03/aop/) 43 | - [雅虎军规35条](http://blog.ctomorrow.top/2019/03/03/yahoo/) 44 | #### PHP 45 | - [PHP基础入门](https://github.com/hubvue/nota/issues/16) 46 | - [PHP面向对象--基础](https://github.com/hubvue/nota/issues/17) 47 | - [PHP面向对象--常见的关键字](https://github.com/hubvue/nota/issues/22) 48 | - [PHP面向对象--构造方法和析构方法](https://github.com/hubvue/nota/issues/18) 49 | - [PHP面向对象---封装、继承、多态](https://github.com/hubvue/nota/issues/19) 50 | - [PHP面向对象--抽象类与接口](https://github.com/hubvue/nota/issues/20) 51 | - [PHP异常处理](https://github.com/hubvue/nota/issues/21) 52 | - [PHP与MySQL操作](https://github.com/hubvue/nota/issues/23) 53 | #### Linux 54 | - [Linux基础入门](https://github.com/hubvue/nota/issues/15) 55 | - [Vim命令合集](https://github.com/hubvue/nota/issues/25) 56 | - [Linux的文件操作权限](http://blog.ctomorrow.top/2019/03/01/linux-fr/) 57 | - [Linux的scp命令：传送文件](http://blog.ctomorrow.top/2019/03/01/linux-scp/) 58 | #### QA 59 | - [JavaScript与QA工程师(理论篇)](https://github.com/hubvue/nota/issues/26) 60 | - [来一打JavaScript集成化测试(实战篇)](https://github.com/hubvue/nota/issues/27) 61 | 62 | #### 安全 63 | - [XSS跨站脚本攻击](https://github.com/hubvue/nota/blob/master/security/xss.md) 64 | 65 | --------------------------------------------------------------------------------