Macbook卡死解决方案

2016-09-30 15:42:27

更新MacOS后开始巨卡无比,主要体现在桌面图标拖拽卡顿,上传文件卡顿,保存文件卡顿,更奇葩的是换个账户登录就不卡了。
然后知乎谷歌的搜解决办法 什么删搜狗 清缓存 关闭flash 减少桌面文件 重启啥的统统无效。
我最后连siri都关了!!!
最后发现了这个

就是windowServer 这个存在内存泄露的bug,然后我试着结束进程,窗口直接崩了。进入登录页面,然后就不卡了,不卡了,不卡了。
另外提醒大家 新版的MacOS Sierra的vpn没了之前pptp的协议了,又要重新建梯子

DROWN 中间人劫持漏洞

2016-03-02 17:15:16

漏洞描述:
国外安全专家发现了一种名为“DROWN”的中间人攻击方式,漏洞编号为CVE-2016-0800。若服务器支持以“SSLv2”协议和“EXPORT”加密算法进行安全连接时,攻击者通过截获客户端和服务端的通信数据,利用穷举的方式破解出被加密的原文,实现中间人劫持。
漏洞修复:
注:建议在修复前创建服务器快照,以免修复失败造成损失。
打开nginx的配置文件,修改SSL使用的加密算法(若无,请添加):
nginx ssl_ciphers HIGH:!aNULL:!MD5:!EXPORT56:!EXP;
更多见阿里云大大

导入godaddy https证书在微信中打不开页面

2016-02-29 17:46:54

圣诞节在godaddy买了ssl证书,感觉全站https早晚的事,最早的方案用阿里云负载均衡搭建的,自己不用配nginx,直接在阿里那上传证书就好。
大致如下:
前端 这边
80端口监听后端8080端口
443端口监听后端8123端口
后端nginx这边对应
8080来的都rewrite成https请求
8213直接对应你真正的项目端口
要是还有别的域名也都给从定向过来
这样例如我的55u.me
server {
server_name 55u.me ;
rewrite ^(.*) https://orz-i.com$1 permanent;
}
如果你要是安装的全家桶可能防火墙默认打开的,把需要的端口打开,要不访问不了。
vi /etc/sysconfig/iptables
-A INPUT -p tcp -m state --state NEW -m tcp --dport 8213 -j ACCEPT
-A INPUT -p tcp -m state --state NEW -m tcp --dport 8080 -j ACCEPT
毕竟服务器空闲那么多,阿里的SLB还是要收费的,所以干脆都给放到自己服务器上处理https了。
然后到nginx里配置如下,并记得防火墙打开443端口
server {
server_name ssl.orz-i.com;
listen 443;
ssl on;
ssl_certificate /orz-i.com.crt;
ssl_certificate_key /orz-i.com.key;
ssl_session_timeout 5m;
ssl_protocols SSLv2 SSLv3 TLSv1;
ssl_ciphers ALL:!ADH:!EXPORT56:RC4+RSA:+HIGH:+MEDIUM:+LOW:+SSLv2:+EXP;
ssl_prefer_server_ciphers on;
root /home/wwwroot/default/case;
index index.html index.php;
if ( $query_string ~* ".*[\;'\<\>].*" ){
return 404;
}
location ~ .*\.(php|php5)?$ {
#fastcgi_pass remote_php_ip:9000;
fastcgi_pass unix:/dev/shm/php-cgi.sock;
fastcgi_index index.php;
include fastcgi.conf;
}

location ~ .*\.(gif|jpg|jpeg|png|bmp|swf|flv|ico)$ { expires 30d; }
location ~ .*\.(js|css)?$ { expires 7d; } }
crt和key 是证书的公钥和私钥。
然后chrome跑的正常,safari正常,两个浏览器都会有绿色小锁。然后打开微信。打不开页面。于是就呵呵了。 用青花瓷抓包发现每次打开页面的时候都会去 godaddy这个地址 http://certificates.godaddy.com/repository/gdig2.crt去下载证书,竟然还是个http的请求,google后发现是证书链有问题,说白了就是证书需要一级一级的放在一起,断了貌似chrome他们会自己去给补全,微信貌似没有自动补全,然后就打不开了。 godaddy上下载的证书会有2个文件,一个是(随机串.crt)一个是(gd_bundle-g2-g1.crt),然后打开文本编辑器,把(随机串.crt)粘到(gd_bundle-g2-g1.crt)上面合并成一个文件。丢到服务器上。


进入全栈https时代

把博客前端迁移到了node上

2016-02-16 18:01:57

终于把多年的老朋友wordpress换成了nodejs,至此博客终于进化成了彻底的全栈,进入https时代。
https遇到个坑

PM2 开发遇到的问题

2015-11-21 12:16:28

1.koa在pm2下无法启动:
起初一直以为是代码有问题,但是发现node --harmony app.js下会正常运行 在pm2 app.js就不可以 服务器上可以 再看iojs上发现了这么句话No more -- harmony flag 突然想起服务器版本上安装的是iojs在iojs里面 不需要--harmony 因为是很早之前的笔记了,只有早期的node版本会出现这个问题,现在iojs和nodejs合并了,不存在这个问题。如果有同学还在用旧版的可能会遇到这个问题。
2.pm2启动mongo:
pm2支持带参数启动,如果你想让mongo启动时带授权模式需要加上auth。 进入到mongo文件夹
pm2 start ./mongod -x -- --auth
3.pm2的logs:
千万别pm2 logs 一直开着,我不会告诉你我内存满了。

阿里云下wordpress遇到的2个坑

2015-11-21 12:02:03

1.Nginx下开启固定连接,就是apache下的rewrite:
在nginx配置文件目录下新建一个 wordpress.conf 内容为
location / {
try_files $uri $uri/ /index.php?$args;
}
rewrite /wp-admin$ $scheme://$host$uri/ permanent;
然后进入到nginx.conf文件中在root那一行下面加入:
include wordpress.conf;
重启nginx
2.Mysql内网可以访问,外网访问不了
只因为开了防火墙
如果你确定ip bind 啥的你都放开了,mysql也正常跑着,3306都ok的话,估计就和我是一样的原因了
打开防火墙
vi /etc/sysconfig/iptables
在防火墙列表里加入3306端口开放
-A INPUT -p tcp -m state --state NEW -m tcp --dport 3306 -j ACCEPT
重启防火墙
service iptables restart

博客归来

2015-11-21 11:47:32

已经有一年多了没写博客了。一直懒,而且一些小东西就记印象笔记里了。
随着前端的工业革命,我自己的前端路也在一起变化
这一年一直在做全栈开发,重点是Node.js。本子换成了rmbp,编辑器换成了我4年前就看好的Sublime
开始NPM,Grunt。
越发的发现Node.js是如此的神奇,胜过我之前的大爱,世界上最好的语言php。
55u.me搬家了,为自己买了阿里云,所以空余时间把整个55u.me搬了过来,换成了现在这个猥琐的玉米。感谢大猫的这么多年的稳定服务,虽然不在那了,但还是给大猫加个广告。
现在的博客还是wp搭建的,全站图片都加了cdn,快了很多,因为是北京的服务器,所以在我这是秒开,nodejs版的blog还在搭建中。架构是基于Nodejs(KOA)+ Mysql + Nginx + Linux之前搭建了一个 Nodejs(KOA)+ Mongo+ Nginx + Linux 的,但是方便wp迁移数据还是换成了Mysql。
这一年的时间一直在做千丁小区,最早版本的千丁小区是ionic搭建的,自带Angular用起来比较爽,但是随着业务的加大用ionic搭建的站点实在显得臃肿,在万能的宝哥的带领下,我们开始了基于node全栈的多页面H5网站。

将要做的事:给自己挖了个硬件坑,下周开始搞树莓派,只因为在人海中听到了node.js可以在树莓派上跑。
 
 

利用Fiddler对手机端数据抓包

2014-07-18 17:31:02

移动端请求测试木有chrome那么方便没有了控制台,调试起来很麻烦,于是利用代理代理抓包的方法来解决这个问题,查看请求cookie神马的。
Fiddler2是个老牌抓包利器,新版内置代理。
1.设置fiddler
 
抓包
抓包
 
 
2.查看本机ip地址win+r 运行cmd 然后用ipconfig看,我这里是192.168.56.1
3.然后设置移动设备,这里拿肾5作说明,安卓设置基本相同。
设置--无线局域网
 抓包
 抓包
现在就可以捕获到移动端设备的请求信息了
抓包

关于响应式移动端遇到的问题

2014-05-14 16:08:35

1.oppo中兴等个别安卓端页面css postion:fixed支持问题。
fixed元素会停留在页面中上的位置,和希望呈现方式不一致,导致无法使菜单在页面上下滚动时固定在一个位置。
解决方案:在<head>标签中添加
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />


2.mp4在安卓和ipad下播放正常无法在iphone下播放。
iphone-mp4


打开格式工厂会发现mp4有三种格式
把不好使的mp4转换成最下边的AVC的就ok了。

代码规则

2014-04-22 16:46:50

新的项目客户要求代码通过
CSS质量工具(规则默认):https://github.com/twitter/recesshttps://github.com/stubbornella/csslintJS质量工具(规则默认):https://github.com/douglascrockford/JSLint所有样式添加命名前缀
先吐槽,采取严格标准固然是好的,但是硬性规则使得页面效率降低,严重影响SEO这也是好的么,规则是死的,人是活的。
Recess :
twitter开源代码检测工具,主要过滤样式命名中的_ ,css属性顺序,也是就是说id,class 不可以有类似 skua_content的名字,然后属性必须要先是position,然后是上右下左的顺序,所有属性值顺序有一点不符合规则都拿不到perfect。
CssLint:
不准用id选择器,不许超过10个浮动,不许有太多字号,不许。。。。。。然后改完了JQ就只能用类选择器了,据说效率慢了10倍没辙。
总感觉这玩意的主旨是为了避免ie6 bug而不用可能引起bug的一切样式。有点因噎废食的节奏。
相关文章转自这里
1. 盒模型(box-model)/*消灭*/ (1)当设定width 的同时,还设置了border,border-left,border-right,padding,padding-left,padding-right中的任意一个,那么必须显示设置box-sizing (2)当设定height的同时,还设置了border,border-top,border-bottom,padding,padding-top,padding-bottom中的任意一个,那么必须显示设置box-sizing 例如: 正确 .mybox { box-sizing: border-box; border: 1px solid black; width: 100px; }
2. box-sizing(box-sizing)/*消灭*/ 即使设置了box-sizing,仍然会warn,因为ie67不支持此属性
3. display(display-property-grouping)/*消灭*/ /*csslint在此出只提到了显式设置display时的情况,对于未设置display时,如何检查如何警告未作描述*/ (1)当设为inline      时,不允许设置width, height, margin, margin-top, margin-bottom, float. /* 关于inline和float,csslint还是提到了ie6 double margin ,但没有说对于要怎么处理 */ (2)当设为inline-block时,不允许设置float. (3)当设为block       时,不允许设置vertical-align. (4)当设为table-*     时,不允许设置margin, float. 例如: 正确: .mybox { display: inline; margin-left: 10px; } 错误 .mybox { display: inline; height: 25px; }
4. 样式冗余(display-property-grouping) (1)同样属性名以及属性值,在同一个容器中不允许声明两遍 (2)相同的属性名(但不同值),必须放在一起,不允许被其他属性隔开 例如 正确: .mybox { border: 1px solid black; border: 1px solid red;   } 错误: .mybox { border: 1px solid black; border: 1px solid black; } .mybox { border: 1px solid black; color: green; border: 1px solid red; }
5. 空的样式规则(empty-rules) 不允许出现空的样式规则 例如 错误: .mybox {} .mybox { /* a comment */ }
6.使用已知样式,方式拼写错误(known-properties) (1)csslint不会检测以横线(-)开头的属性名 (2)属性名和属性值的拼写都会检查 例如 错误: a { clr: red;   } a { color: foo; }
7.链式class(known-properties) (1)不允许对相连的class(即链式class,类似于.foo.bar这样的)设置样式 (2)可以新增一个class来代替链式class 例如 错误: .foo { font-weight: bold; } .bar { padding: 10px;  } .foo.bar { color: red; } 正确 .foo { font-weight: bold; } .bar { padding: 10px; } .baz { color: red;    }
8. vendor前缀(compatible-vendor-prefixes) 当出现以下样式时,应该拥有vender前缀,此时csslint会逐个检查Firefox(-moz),Safari/Chrome(-webkit),Opera(-o),以及Internet Explorer(-ms)前缀是否齐全,若少一种前缀,则会warn。 animation animation-delay animation-direction animation-duration animation-fill-mode animation-iteration-count animation-name animation-play-state animation-timing-function appearance border-end border-end-color border-end-style border-end-width border-image border-radius border-start border-start-color border-start-style border-start-width box-align box-direction box-flex box-lines box-ordinal-group box-orient box-pack box-sizing box-shadow column-count column-gap column-rule column-rule-color column-rule-style column-rule-width column-width hyphens line-break margin-end margin-start marquee-speed marquee-style padding-end padding-start tab-size text-size-adjust transform transform-origin transition transition-delay transition-duration transition-property transition-timing-function user-modify user-select word-break writing-mode
9.渐变样式(gradients) 对于渐变样式,不同浏览器有不同的属性名称,不仅仅是前缀不同,区别如下 Internet Explorer 10+              : -ms-linear-gradient    , -ms-radial-gradient Firefox 3.6+                       : -moz-linear-gradient   , -moz-radial-gradient Opera                              : -o-linear-gradient     , -o-radial-gradient for Safari 5+ and Chrome               : -webkit-linear-gradient, -webkit-radial-gradient Safari 4+ and Chrome("Old WebKit") : -webkit-gradient csslint会检查与渐变(gradient)相关的样式,若以上样式只写了一个或几个,且没有写全,则会warn 例如 错误: /* Missing old and new -webkit */ .mybox { background: -moz-linear-gradient(top,  #1e5799 0%, #7db9e8 100%); background: -o-linear-gradient(top,  #1e5799 0%,#7db9e8 100%); background: -ms-linear-gradient(top,  #1e5799 0%,#7db9e8 100%); } 正确: /* Missing old and new -webkit */ .mybox { background: -moz-linear-gradient(top,  #1e5799 0%, #7db9e8 100%); background: -o-linear-gradient(top,  #1e5799 0%,#7db9e8 100%); background: -ms-linear-gradient(top,  #1e5799 0%,#7db9e8 100%); }
10.不带vendor前缀的标准属性(vendor-prefix) 要将不带vendor前缀的标准属性样式,放在带vendor前缀的属性的后面 例如 错误: .mybox { -moz-border-radius: 5px; } .mybox { border-radius: 5px; -webkit-border-radius: 5px; } 正确: .mybox { -moz-border-radius: 5px; border-radius: 5px; }
11.向后兼容的的颜色样式(fallback-colors) (1)在使用css3中的颜色样式(rgba,hsl,hsla)时候, 同时也要加上一个普通的颜色样式(十六进制,颜色名称,或者rgb) (2)css3的颜色样式要写在普通颜色样式的后面 (3)csslint会根据以上规则去检测color, background, background-color属性 例如 错误: .mybox { color: rgba(100, 200, 100, 0.5); } .mybox { background-color: hsla(100, 50%, 100%, 0.5); } .mybox { background: hsla(100, 50%, 100%, 0.5) url(foo.png); } .mybox { background-color: hsl(100, 50%, 100%); background-color: green; } 正确: .mybox { color: red; color: rgba(255, 0, 0, 0.5); }
12. 文本反向缩进 (1)当为text-indent的值设置为-99,或者更小的值(比如-100,-999)的时候,必须加上direction: ltr (2)csslint只检测text-indent的值,而不检测其的单位(em, px)。 例如 错误: .mybox { text-indent: -999px; } .mybox { text-indent: -999em; } .mybox { direction: rtl; text-indent: -999em; } 正确: .mybox { direction: ltr; text-indent: -999em; } .mybox { text-indent: -1em; }
13. 字体过多(font-faces) 当使用超过5个字体时,会warn
14. @import(import) (1)可以将多个css合并为一个 (2)使用多个<link>标签引入多个css文件
15. 正则式的选择符(regex-selectors) (1)不允许使用类似于正则语法(*=, |=, ^=, $=, ~=)的css选择符 例如 正确: a[href] { color: red; } a[rel=external] { color: blue; } 错误: a[href*=yahoo.com] { color: green; } a[rel^=ext]        { color: red;   } a[href$=.html]     { color: blue;  } a[rel~=external]   { color: red;   } a[data-info|=name] { color: red;   }
16.通配符选择符(universal-selector) 不能将通配符(*)作为选择符的关键部分(key part) 例如: 错误: *             { color: red; } .selected *   { color: red; } 正确: .selected * a { color: red; }
17.属性选择符(unqualified-attributes) 同上面的通配符一样,属性选择符不能作为选择符的关键部分(key part) 例如: 错误: [type=text]           { color: red; } .selected [type=text] { color: red; } 正确: .selected [type=text] a { color: red; }
18.零的单位(zero-units) 零后面不能跟单位 例如: 错误: .mybox { margin: 0px; } .mybox { width: 0%; } .mybox { padding: 10px 0px; } 正确: .mybox { margin: 0; } .mybox { padding: 10px 0; }
19.高级选择符(overqualified-elements)/*消灭*/ (1)若某个class紧跟(无空白符)在多个不同的元素后面, 则合法 (2)上面这条规则中,若不是多个,而只是一个的时候,则会warn 例如: 错误: div.mybox        { color: red; } .mybox li.active { background: red; } 正确: li.active { color: red; } p.active  { color: green;}
20.属性简写(shorthand) (1)当在一个样式规则中,同时设置了margin-left, margin-right, margin-top, margin-bottom, 则会warn。 (2)当在一个样式规则中,同时设置了padding-left, padding-right, padding-top, padding-bottom , 则会warn。 例如: 错误: .mybox { margin-left: 10px; margin-right: 10px; margin-top: 20px; margin-bottom: 30xp } .mybox { padding-left: 10px; padding-right: 10px; padding-top: 20px; padding-bottom: 30px; } 正确: .mybox { margin-left: 10px; margin-right: 10px; } .mybox { padding-right: 10px; padding-top: 20px; }
21. 背景图片冗余(duplicate-background-images) (1)当多个样式需要使用同一张图片作为背景图片的时候,如果在这些样式规则中重复设定background-image, 则会warn (2)当多个样式需要使用同一张图片作为背景图片的时候,应该新建一个class样式用于指定background-image,其他样式则用于设定background-position 例如 错误: .heart-icon { background: url(sprite.png) -16px 0 no-repeat; } .task-icon  { background: url(sprite.png) -32px 0 no-repeat; } 正确: .icons { background: url(sprite.png) no-repeat; } .heart-icon { background-position: -16px 0; } .task-icon  { background-position: -32px 0; }
22. 浮动(floats)/*消灭*/ (1)当使用float超过10次时,csslint会warn (2)在某些情况下,可以使用grid systems代替频繁的float
23. 字体大小(font-sizes) 尽可能少用font-size,而应该设定几个样式规则用于对于不同的字体大小,然后在需要设定字体大小的地方添加需要的样式规则
24. id选择符(ids)/*消灭*/ 使用class选择符代替id选择符
25. !important(important)/*消灭*/ 不允许使用!important
26. outline(outline-none)/*消灭*/ (1)只有在包含伪类:focus的样式规则中,才能移除(设为none或者0)outline样式 (2)在包含伪类:focus的样式规则中,移除outline样式的同时,必须要使用其他样式 例如: 错误: a { outline: none; } a { outline: 0; } a:focus { outline: 0; } 正确: a:focus { border: 1px solid red;outline: 0; }
27. heading样式(qualified-headings, unique-headings) (1)heading样式(h1-h6)应该全局化。也就是说在整个网站中,heading样式应该以常量形式出现。 (2)不要对heading样式做局部定制,也就是说(h1-h6)不能作为css规则的关键部分(key part)。 例如: 错误: h3 { font-weight: normal; } .box h3 { font-weight: bold; } 正确: h3 { font-weight: normal; } h3:hover { font-weight: bold; }
 
JSLint:
检测js代码的工具,有在线链接http://www.jslint.com/
连一个空格都不会放过你的js规则,我这能说这个可以保证代码格式,效率神马的,呵呵。
相关报错原因巨多,参考老外的一个http://jslinterrors.com/项目
git :https://github.com/jamesallardice/jslint-error-explanations