继续阅读全文 »

已经遇到过好几次这样的情况了

GIT报错：

1

fatal:multiple stage entries for merged file

在网上找下，也能很容易的找到对应的解决方案，方案如下：

1
2
3

rm .git/index
git add -A
git commit -m 'fix git fatal error'

但对于为什么会出现这样的错误，一直找不到个说法。希望知道原因的朋友能帮我解答疑惑。

自认为一个好的码农要知其然，更要知其所以然。

window.postMessage是html5的新特性之一，
可以使用它来向其它的window对象发送消息，不管这个window对象是属于同源或不同源。

通过Cross-Document Messaging允许浏览器windows, tabs, and iFrames之间跨域通讯。

我们使用postMessage()方法去发送一条信息。

postMessage发送信息

postMessage需要接受两个参数

• message 要发送的信息，可以是string也可以object
• targetOrigin 接受信息的窗口的地址，这地址由接受窗口的protocol, port and hostname组成
  也可以使用*来匹配任意的URL，但这会存在安全问题。

这postMessage方法是被要接受信息的window所调用。

例如我们可以使用

1

var new_wd = window.open('http://demos.devsai.com');

打开一个新tab,
‘window.open’返回的就是新打开的window对象,
所以就可以这样来给新打开的window、tab窗口发送信息,

1

new_wd.postMessage('hello demos','http://demos.devsai.com/postmessage/receiver.html');

window接受信息

如上述例子，可以在http://demos.devsai.com/postmessage/receiver.html中添加如下代码:

1
2
3
4
5
6
7

var receiverHandler = function(e){
	if (e.origin !== "http://www.devsai.com")//判断是哪个域过来的信息
     		return;
	console.log(e.data);//接收到的信息
}

window.addEventListener('message',receiverHandler);

接收的窗口除了使用window.open打开的以外，还可以是iframe窗口,我们可以通过以下代码获得iframe的window对象，
并对iframe发送信息.

1
2
3

var iframe_win = document.getElementById('recevier').contentWindow;
iframe_win.postMessage('hello iframe','http://demos.devsai.com/postmessage/receiver.html');
##

浏览器的支持
现在主流的浏览器都是支持postMessage()，也包括IE8+,但在IE8、IE9中还是有限制的，只能在docuemnt与iframe之间通讯才可使用postMessage(),想要在跨window或者tab之间通讯必须是IE10+.

最后，想看DEMO,在这里穿越

DEMO也放在了github上，想要看code的同学，点击这里

继续阅读全文 »

每次登陆远程服务器时，都会自动的执行当前用户下的.bash_profile文件。

只需要在里面写入你想要的脚本执行语句，就可以实现ssh连接时自动执行脚本的功能了.

示例如下:

登陆到服务器后 通过命令编写脚本 :cd ~/ && vim .bash_profile

添加红色区内容 :

保存后， ssh退出重新连接。

就能看到我们写的内容被执行了。

当然 你可以做些更有意义的、更复杂的事情.

有时候，我们需要知道某个文件有没有被修改过，以此做出相应的处理。

在liunx中， 就可以使用以下的脚本来实现 ：

stat openapi.less | grep -i Modify | awk -F. '{print $1}' | awk '{print $2$3}'| awk -F- '{print $1$2$3}' | awk -F: '{print $1$2$3}'

不多废话，直接看效果。

See the Pen BNEPON by 黄向赛 (@huangxiangsai) on CodePen.

继续阅读全文 »

在小的项目中，估计永远都不会碰到跨域请求的问题。始终都是在一个域下面，可能连静态和动态都是在一起。

但是一个大项目，会将里面的业务拆分成多个子项目，根据业务的不同，子项目都会有它自己的子域。 所以在主项目中，访问不同业务下的接口，将会发生跨域的问题。

一般我们对于跨域会采用下以两种方式解决：

1. 通过在返回的头部 Access-Control-Allow-Origin 添加指定的域，来允许跨域。

2. 使用jsonp方式，实现跨域请求。

然而，很多时候，接口已经存在，并且已经在别处使用（不存在跨域问题），这时，一个在不同域的地方需要调用这个接口，我们第一想到的就是使用上述的第一种方式来解决跨域问题。

因为这样改动是最小的（程序猿都很懒的）

我也是一样，后端的童鞋改完后，我在chrome上调试下可以了。（我真的很厉害，虽然代码都不是我改的，只是刷了下页面）。

完了，在我们可爱的IE上也要试试的（我是IE9），不试不知道，一试吓一跳，通过fiddler居然没有找到请求。（IE真调皮）

没办法只有打开IE简陋的调试工具，在对应的done和fail中打印些信息出来。再次刷新页面后，果然进入的fail，并打印出了 no transport 。

这是什么错，没见过啊。于是就开始各种搜索， 搜索的结果，大致有两类，

一种是说，这跟IE的安全设置有关，要进入xxx >> xxx 然后再设置下就好了。

还有一种是说，直接换成jsonp吧。

第一种完全不靠谱，不可能让每个用户都这么干啊，pass ,第二种嘛，不多说了，还是再找找其他的方法吧。实在没办法才去想这么做。

最终，还在通过万能的google，找到了解决方法。 需要通过jQuery.ajaxTransport方法来设置一个对象，当然只需要在IE10以下的版本中使用就可以了。具体的代码如下：

if (!jQuery.support.cors && window.XDomainRequest) {
            var httpRegEx = /^https?:\/\//i;
            var getOrPostRegEx = /^get|post$/i;
            var sameSchemeRegEx = new RegExp('^'+location.protocol, 'i');
            var xmlRegEx = /\/xml/i;

            // ajaxTransport exists in jQuery 1.5+
            jQuery.ajaxTransport('text html xml json', function(options, userOptions, jqXHR){
                // XDomainRequests must be: asynchronous, GET or POST methods, HTTP or HTTPS protocol, and same scheme as calling page
                if (options.crossDomain && options.async && getOrPostRegEx.test(options.type) && httpRegEx.test(userOptions.url) && sameSchemeRegEx.test(userOptions.url)) {
                    var xdr = null;
                    var userType = (userOptions.dataType||'').toLowerCase();
                    return {
                        send: function(headers, complete){
                            xdr = new XDomainRequest();
                            if (/^\d+$/.test(userOptions.timeout)) {
                                xdr.timeout = userOptions.timeout;
                            }
                            xdr.ontimeout = function(){
                                complete(500, 'timeout');
                            };
                            xdr.onload = function(){
                                var allResponseHeaders = 'Content-Length: ' + xdr.responseText.length + '\r\nContent-Type: ' + xdr.contentType;
                                var status = {
                                    code: 200,
                                    message: 'success'
                                };
                                var responses = {
                                    text: xdr.responseText
                                };

                                try {
                                    if (userType === 'json') {
                                        try {
                                            responses.json = JSON.parse(xdr.responseText);
                                        } catch(e) {
                                            status.code = 500;
                                            status.message = 'parseerror';
                                            //throw 'Invalid JSON: ' + xdr.responseText;
                                        }
                                    } else if ((userType === 'xml') || ((userType !== 'text') && xmlRegEx.test(xdr.contentType))) {
                                        var doc = new ActiveXObject('Microsoft.XMLDOM');
                                        doc.async = false;
                                        try {
                                            doc.loadXML(xdr.responseText);
                                        } catch(e) {
                                            doc = undefined;
                                        }
                                        if (!doc || !doc.documentElement || doc.getElementsByTagName('parsererror').length) {
                                            status.code = 500;
                                            status.message = 'parseerror';
                                            throw 'Invalid XML: ' + xdr.responseText;
                                        }
                                        responses.xml = doc;
                                    }
                                } catch(parseMessage) {
                                    throw parseMessage;
                                } finally {
                                    complete(status.code, status.message, responses, allResponseHeaders);
                                }
                            };
                            xdr.onerror = function(){
                                complete(500, 'error', {
                                    text: xdr.responseText
                                });
                            };
                            xdr.open(options.type, options.url);
                            //xdr.send(userOptions.data);
                            xdr.send();
                        },
                        abort: function(){
                            if (xdr) {
                                xdr.abort();
                            }
                        }
                    };
                }
            });
        };
        jQuery.support.cors = true;
        $.ajax({
            crossDomain: true,
            url : 'http://127.0.0.1:8080/fm/json',
            type : 'GET',
            dataType : 'json',
        }).done(successHandler)
        .fail(function() {
            console.log('error');
        });

上面的代码看不是很清楚的话，有某个大神在JSFiddle中的demo,见花献佛了。想看DEMO请猛击这里。

再次刷IE，成功执行。

随便再说下，在搜索这问题的时候，也有很多告诉说添加这一句jQuery.support.cors = true;就好了， 可添加了这句后，no transport的错是没了，但会报其他的错。然后就没然后了。

所以希望碰到这类问题的童鞋能看到这篇，也希望能对你有实质性的帮助。

之前一直知道想要居中显示元素 就需要如下样式

margin:0 auto;

但实际用起来 总不那么顺心，经常性的，有时有效果 ，有时又没效果了。

总结一句话，我的css弱爆了。

为此请教了公司css专家 ，经过仔细的讲述后，学会了两种可居中的方法

• 就像我前面提到的一样margin:0 auto; 确实可以居中 。

  但是，是有条件的， 需要居中的元素必须是设定了宽了的，而且不能是百分比，否则就没看不出效果。

• 还有种方式就是text-align:center; 之前我一直以为这属性只能用作文本的居中，其实它也能作为元素的居中，

  但也有个要注意的地方，居中的元素不能是块级元素，只能是行内元素。

  如果想让一个块级元素使用这种的居中方式，那么就必须让其变成行内元素。

  可以通过设置CSS display属性，设置为inline 或者inline-block 使元素变为行内元素。

下面通过几个例子来看看上所述两种方法的效果:

See the Pen gapQvr by 黄向赛 (@huangxiangsai) on CodePen.

上面这个例子，就同时用到了两种元素居中方式。外层使用了margin的居中，里面层使用了text-align的方式居中。