记录一下上线过程

pm2 => 维持命令行关闭但是server不关闭

启动 pm2 start …
关闭 pm2 stop …
查看项目 pm2 list

总结一下ie兼容性问题

css

1. ie9及以下 a标签下的img会有黑色边框 => a img{border:0px;}
2. a标签 点击后有 虚框 a{outline:none;}
3. transform 要加啊前缀-ms-transform js=>msTransfrom
   阅读全文 »

http

主要特点

简单快速，灵活，无连接，无状态

简单快速: 只需传送请求方法和路径。
灵活: HTTP允许传输任意类型的数据对象。
无连接: 每次连接只处理一个请求。
无状态: HTTP协议是无状态协议，无状态是指对于事物处理没有记忆能力。

前端自动化构建工具

gulp grunt webpack

gulp/grunt 与 webpack 的区别

都是前端自动化构建工具
gulp/grunt 是一种能够优化前端的开发流程的工具。
webpack是一种模块化的解决方案。

XSS

XSS 跨站脚本攻击(Cross Site Scripting)

攻击方式

反射型 存储型

反射型 发出请求时，xss代码出现在url中，作为输入提交到服务器，服务器端解析后响应，xss代码随相应内容一起传回给浏览器。

存储型 提交的代码会存储在服务器端( 数据库，内存，文件系统等)，下次请求目标页面时不用提交XSS代码

防御措施

编码 过滤 校正

编码  html Entity 对字符转义
过滤 (最重要)
    移除用户上传的DOM属性，eg:onerror onclick 
    移除用户上传的Style Script Iframe节点等    
校正
    避免直接对html entity解码
    使用DOM Parse转换，校正不配对的DOM标签。

Layout

mvvm 框架

1.了解

Vue React Angular

MVC Model View Controller
MVVM Model View ViewModel

mvvm定位 Model <=> ViewModel <=> View Model 与 View 是分离的

react props

this.props.children/React.Children

this.props.children 表示组件的所有子节点

this.props.children 与 React.Children 区别

1.函数作为child传递
    this.props.children.map is not a function
    React.Children.map 不会报错
2.count=>获取子组件个数
    this.props.children.length 不可行
    React.Children.count(this.props.children) => 返回子组件个数
3. React.Children.toArray
4. 执行单一child
    React.children.only(this.props.children)
    只能在传递单一child的情况下使用，而且child必须为函数。
5. React.cloneElement
        renderChildren() {
          return React.Children.map(this.props.children, child => {
            return React.cloneElement(child, {
              name: this.props.name
            })
          })
        }

属性传递

属性不能跨层传递,也不能反向传递

所以 传递单个的props多次，很麻烦也不容易改动
{...this.props} => 获取父组件的props 传给 子组件

react-router

1
2
3
4
5
6
7

import {  hashHistory  ,Router, Route, IndexRoute,Link } from 'react-router'
<Router history={hashHistory}> //hash
     <Route path='/' component={App}>
       <IndexRoute component={Player} />
       <Route path='/list' component={Musiclist}></Route>
     </Route>
   </Router>

match

获取search中的key值

1
2
3
4
5
6

function GetQueryString(key){
	var reg = new RegExp("(/\?|&)"+ key + "=([^&]*)(&|$)");
	<!-- var search  = window.location.search.match(reg); -->
	var search  = reg.exec(window.location.search); exec与match相反
	if(search != null) return unescape(search[2]);return null; // unescape 与 .json()相似
}