Ajax-hook拦截全局ajax请求操作

作者:matrix 发布时间:2017年12月13日星期三 分类: 零零星星

github项目地址:https://github.com/wendux/ajax-hook/blob/master/src/ajaxhook.js

项目页面中有很多ajax接口请求,每次需要手动判断数据code进行错误消息提示,再加上有些使用jQuery,有些使用fetch操作,要是能有一个统一的$.ajaxSetup那就爽翻。搜索下ajax的全局拦截,有大神好了,打开即食,NICE。代码量不大,大致的原理好像是把内置的XMLHttpRequest对象给代理了,克隆一份,进行伪装。请求操作都是通过的代理层,拦截、修改操作也都是可以的~

使用

加载ajaxhook.js文件,代码中给浏览器window对象注册全局方法:hookAjax,unHookAjax。

hookAjax //挂载拦截钩子
unHookAjax() //取消ajax请求代理

拦截处理操作

hookAjax方法注册拦截的切入点,执行回调操作。
这里用到onload 即请求完成获取数据的时候。
代码是放在vue项目里面,手动挂载DOM。若出现第一次错误请求没有成功拦截的情况,那就需要把代码放置在头部。

        //全局监听ajax请求,用于提示会话过期,和其他的错误消息。
        if ('function' === typeof(hookAjax)) {
            hookAjax({
                onload: function (xhr) {
                    if (xhr.status >= 500) return layer.alert('服务器报错,请联系管理员!'+"</br>请求地址:</br>"+xhr.responseURL, {icon: 2, title: '无形之刃 <3'});
                    var data = JSON.parse(xhr.responseText);
                    if (!!data) {
                        if (data.code !== 0) {
                            if (!!data.msg) {
                                layer.alert(data.msg, {icon: 2, title: 'ERROR'});
                            }
                        }
                    }
                }
            })
        }

拦截函数 如:onload 返回值是一个boolean,如果为true会阻断ajax请求,默认为false,不会阻断请求。

参考:
http://www.jianshu.com/p/9b634f1c9615

phpStorm配置vagrant下的xdebug

作者:matrix 发布时间:2017年10月15日星期日 分类:零零星星

测试环境:

服务端:vagrant下ubuntu16的lnmp.org一键安装包
IDE:phpStorm for mac
xdebug扩展进行断点调试

安装配置xdebug扩展

连接vagrant ssh

cd ~
wget https://xdebug.org/files/xdebug-2.5.5.tgz
tar -zxvf xdebug-2.5.5.tgz
cd xdebug-2.5.5
/usr/local/php/bin/phpize #用phpize生成configure配置文件
./configure && make && make install

记录下Installing shared extensions的信息用于配置php.ini
尾部添加:

[xDebug]
zend_extension=/usr/local/php/lib/php/extensions/no-debug-non-zts-20121212/xdebug.so
xdebug.idekey = "vagrant"
xdebug.default_enable = 1
xdebug.remote_connect_back = 1
xdebug.remote_port = 9000
xdebug.remote_enable = 1
xdebug.remote_autostart = 1
xdebug.remote_handler="dbgp"

配置phpStorm

确保Languages & Frameworks =》 PHP =》 Debug 配置端口和xdebug.remote_port一样。
图片3812-phpStorm配置vagrant下的xdebug

添加server
图片3813-phpStorm配置vagrant下的xdebug

根据自己开发环境修改配置:

Name是Server名称,可以随便填写;
Host是项目的访问地址;
Port为你Web服务器的端口,一般为80。
还需要配置项目路径的映射(path mapping),将项目的根目录以及public目录映射到Vagrant服务器中的绝对路径。

添加PHP web Application

菜单栏中 Run -> Edit Configurations添加后选择配置好的server之后再点击

图片3814-phpStorm配置vagrant下的xdebug

开启调试 :Run -> Start Listening for PHP Debug Connections 或者点击顶部导航栏的☎️电话图标

设置断点之后run即可看到调试信息。

参考:
https://segmentfault.com/a/1190000007789295
http://mrcelite.blog.51cto.com/2977858/1903157

nginx定向清理Proxy Cache缓存

作者:matrix 发布时间:2017年8月22日星期二 分类: 零零星星

图片3703-nginx定向清理Proxy cache缓存
很多服务器是使用nginx内置的Proxy_cache来缓存资源,防止不必要的后端请求。有时候需要单独清理某个缓存,这就麻烦了。
按照大多数做法是给nginx安装purge模块,但是目前有更加精简的办法使用代码手动删除
道理很简单:获取nginx缓存url的文件路径,然后删除就可以了。

proxy_cache_key缓存的key

nginx 配置了proxy_cache_key的话需要根据自定义的key来获取url的缓存hash值,默认的key一般都是完整的访问url
具体自己的nginx是以什么作为缓存key的,具体随便找个缓存文件vi一下看看,有些设置了upstream负载均衡,就需要替换访问的host为对应主机上的upstream节点名,SO 随便找个缓存文件看看。

缓存路径的拼接

缓存根目录中一般是 单字母/俩字母/32位字符路径作为缓存的文件存储。
首先需要对key进行md5 Hash的计算,取出最后3位字符。
单字母:md5最后一位
双字母:md5最后2,3位
最后再拼接出完整路径,删除就可以了。

缓存根目录是nginx中配置的,默认路径就不清楚了。

PHP代码参考,其他语言还请大牛附言~

//去除服务器nginx缓存
$root = '/var/tmp/Tengine/proxy_cache/';

//之所以替换 使用为nginx服务器设置了反向代理proxy_pass
//具体缓存的key还需查看真实的缓存文件的key值
$map = array(
    'http://www.hhtjim.com/' => 'http://www_hhtjim_com_backend/',
);
$key =  @$args[0];//访问的url链接作为缓存的key
if(empty($key)) die("Please input the cache url eg:http://www.hhtjim.com\n");
$key = str_replace(array_keys($map), array_values($map), $key);
$md5 = md5($key);
$file = sprintf('%s%s/%s/%s', $root, substr($md5, -1), substr($md5, strlen($md5) - 3, 2), $md5);
if (@unlink($file)) {
    echo 'DEL SUCCESS:' . $key."\n";die;
}
echo 'FAILED:'.$file."\n";

最后再访问url看看自己服务器响应头配置的$upstream_cache_status变量X-cache缓存标记为MISS 其他状态参考:

MISS 未命中,请求被传送到后端
HIT 缓存命中
EXPIRED 缓存已经过期请求被传送到后端
UPDATING 正在更新缓存,将使用旧的应答
STALE 后端将得到过期的应答

参考:
http://www.jb51.net/article/74595.htm

缓存命中率:http://www.361way.com/nginx-cache/2665.html

peace

T-Rex 在线版本的chrome离线恐龙游戏

作者:matrix 发布时间:2017年2月15日星期三 分类: 零零星星

图片3623-T-Rex 在线版本的chrome离线恐龙游戏

断网的时候chrome中会出现恐龙小游戏T-Rex/Dino。
来自 @thecodepost

试玩

html

http://www.hhtjim.com/wp-content/uploads/2017/02/T-RexGame.html

参考:http://www.thecodepost.org/internet/play-hidden-t-rex-game-offline-chrome/
http://www.cnblogs.com/undefined000/p/trex_8.html

linux进程管理工具-supervisor

作者:matrix 发布时间:2017年2月13日星期一 分类: 零零星星

linux后台守护进程化有nohup,screen命令可一般解决。但突发崩溃情况就不能很好的保证进程在后台的驻留。
supervisor是一个python脚本编的工具,可以起到很好的管理、监控进程的作用。

安装

Debian类系统安装:

sudo apt-get install supervisor 

选择y确认操作后即可安装完成。

配置

echo_supervisord_conf > /etc/supervisord.conf

图片3665-linux进程管理工具-supervisor
如图我的启动supervisord时的配置文件是/etc/supervisor/supervisord.conf
在文件最后一行添加执行的命令,或者其中include中载入的配置文件目录中的任意conf文件也可以。
范例:

[program:ws] 
user=www
command=php /home/wwwroot/chat.hhtjim.com/wsServer.php
autostart=true
autorestart=true

说明:
program 表示自定义的任务名称
user 执行进程的用户
command 执行的命令
autostart 自动启动

启动

supervisord -c /etc/supervisord.conf

查看

> supervisorctl #进入命令行
> reload #重新载入配置

参考:
http://www.tuicool.com/articles/Ejm2u2
http://stackoverflow.com/questions/16171338/supervisord-cant-find-command-in-virtualenv-folder
https://neo1218.github.io/supervisor/

mysql 启动失败

作者:matrix 发布时间:2017年2月11日星期六 分类: 零零星星

重启系统发现mysql启动失败。
环境为 ubuntu Lnmp

Starting mysql
. * The server quit without updating PID file (/var/run/mysqld/mysqld.pid).

/var/run/mysqld/ 目录中没有pid文件

找到网上说的文件权限、磁盘已满,这些都不符合情况。

解决

删除文件my.cnf
> rm /etc/mysql/my.cnf

启动mysql

lnmp mysql start

最后启动成功就ok
peace

参考:

[分享]MySQL启动报错 The server quit without updating PID file (/var/run/mysqld/mysqld.pid) 解决


https://bbs.vpser.net/viewthread.php?tid=13217

ubuntu安装Let’s Encrypt证书实测

作者:matrix 发布时间:2017年1月15日星期日 分类:兼容并蓄 零零星星

Let’s Encrypt证书出来已经有很长时间,之前用主机未到期,也就干瞪眼。
现在手上拿了一台有设备,其实算下来价格也都差不多,国外的速度是慢点,但是好处很多。

测试环境:
ubuntu 14 64bit
lnmp 1.3

获取证书

git clone https://github.com/letsencrypt/letsencrypt 
cd letsencrypt
./letsencrypt-auto certonly --standalone --email hhtjim@foxmail.com -d hhtjim.com -d www.hhtjim.com

执行完上面三个命令之后会有图形界面出现
gui图形界面
选择Agree之后出现这个也就完成了证书的获取

安装证书

修改域名对应下的nginx配置
进入/usr/local/nginx/conf/vhost目录找到和域名同名的conf文件
在server代码块中添加:

listen 443 ssl;
        #listen [::]:80;
        ssl on;
        ssl_certificate /etc/letsencrypt/live/域名/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/域名/privkey.pem;

参考如下完整配置

server
    {
        listen 80;
        listen 443 ssl;
        #listen [::]:80;
        ssl on;
        ssl_certificate /etc/letsencrypt/live/hhtjim.com/fullchain.pem;
        ssl_certificate_key /etc/letsencrypt/live/hhtjim.com/privkey.pem;

        server_name hhtjim.com www.hhtjim.com;
        index index.html index.htm index.php default.html default.htm default.php;
        root  /home/wwwroot/hhtjim.com;

        include other.conf;
        #error_page   404   /404.html;
        include enable-php.conf;
        include wordpress.conf;

                if ($http_host !~ "^www.hhtjim.com$"){
                    rewrite  ^(.*)    https://www.hhtjim.com$1 permanent;
                }
                if ($scheme = "http"){ 
                        rewrite ^(.*)$  https://$host$1 permanent;
                }

        location ~ .*\.(gif|jpg|jpeg|png|bmp|swf)$
        {
            expires      30d;
        }

        location ~ .*\.(js|css)?$
        {
            expires      12h;
        }

        location ~ /\.
        {
            deny all;
        }

        access_log  /home/wwwlogs/hhtjim.com.log;
    }

接着准备重启nginx:lnmp nginx restart

参考:loazuo

更新操作

按照网上大多执行的命令我这里就会出现交互界面,需要手动选择webroot目录

How would you like to authenticate with the ACME CA? 

       x x          1  Place files in webroot directory (webroot)           x x  
       x x          2  Spin up a temporary webserver (standalone)  


还好找到办法,只需要添加参数 --webroot -w 设置好存放pem文件的root路径即可。最终参考如下

ubuntu下保存为sh文件。记得附加x执行权限。然后执行该sh文件即可自动更新证书.

#!/bin/sh
~/letsencrypt/letsencrypt-auto certonly --webroot -w /etc/letsencrypt/live/hhtjim.com/ --renew-by-default --email hhtjim@foxmail.com -d hhtjim.com -d www.hhtjim.com && lnmp nginx restart

若报错Failed authorization procedure...则需要修改-w参数为网站根目录
如:

-w /home/wwwroot/hhtjim.com/

且nginx配置中将.well-known加入白名单:

location ~ /.well-known {
            allow all;
    }

参考:
http://letsencrypt.readthedocs.io/en/latest/using.html
https://www.ubock.com/article/25
https://stackoverflow.com/questions/42269107/using-certbot-to-apply-lets-encrypt-certificate-failed-authorization-procedure

最后的定时执行

修改定时任务 crontab -e
0 0 1 * * /root/updateLetsEncrypt.sh #每月1号执行sh脚本

重启定时服务 /etc/init.d/cron restart

peace