不知道你有沒有這么想過，在微信個(gè)人公眾號(hào)越來越普遍，自媒體越來越流行的時(shí)候，是否想過申請(qǐng)一個(gè)自己的微信公眾號(hào)折騰一下呢？在朋友圈里看到越來越多的小伙伴都在轉(zhuǎn)發(fā)自己微信公眾號(hào)里的文章，你會(huì)想我要搞個(gè)微信公眾號(hào)該折騰點(diǎn)什么呢？寫文章太沒新意，做內(nèi)容你沒素材。好了，那么本文就教你如何正確的折騰微信個(gè)人公眾號(hào)。

首先，得有一個(gè)帶有后端動(dòng)態(tài)語(yǔ)言的個(gè)人博客

其次，得有一個(gè)微信個(gè)人公眾號(hào)

最后，得會(huì)編程(比如，php、javascript等)

登錄微信公眾平臺(tái)，進(jìn)入開發(fā)->基本配置頁(yè)面，啟用服務(wù)器配置功能，如下圖：

具體接入并驗(yàn)證你的服務(wù)器地址請(qǐng)參考公眾號(hào)開發(fā)文檔，搞定這一步后，我們就可以開始寫服務(wù)端代碼(以php為例)
服務(wù)端主要用來接受微信post過來的數(shù)據(jù)并解析處理，以下是公眾號(hào)消息接受服務(wù)端代碼片段：

// 微信消息接收入口
function onHttpPostRequest($mock){
    $wxMsgBody = $mock;
    if(empty($wxMsgBody)){
        $wxMsgBody = file_get_contents("php://input");
    }

    $this->wxMsgBody = simplexml_load_string($wxMsgBody, "SimpleXMLElement", LIBXML_NOCDATA);
    $this->wxMsgType = strtoupper($this->wxMsgBody->MsgType);

    $this->comet();
}

// 將接受到的消息序列化后寫入文件，用來觸發(fā)前端的comet
public function comet() {
    $cometfile = WWW_PATH . "wechat.comet";
    if(!file_exists($cometfile)) {
        file_put_contents($cometfile, "");
    }
    $filemtime = filemtime($cometfile);
    $timing = time() - $filemtime;
    $wxMsgBody = (array)$this->wxMsgBody;
    if($timing > 1) {
        file_put_contents($cometfile, serialize($wxMsgBody));
    } else {
        file_put_contents($cometfile, serialize($wxMsgBody) . PHP_EOL, FILE_APPEND);
    }
}

以上完整代碼地址：indexAction.class.php

comet技術(shù)是N年前出來的一種基于HTTP長(zhǎng)連接的“服務(wù)器推”技術(shù)，此處主要用來即時(shí)在博客頁(yè)面上顯示彈幕消息，它的核心代碼分服務(wù)端和客戶端主要如下：

 $value) {
    $msg = unserialize($value);
    if($msg["MsgId"] == $msgid) {
        break;
    }
    array_push($result, $msg);
}
$response = array();
$response["data"]      = $result;
$response["timestamp"] = $filemtime;
echo $callback . "(" . json_encode($response) . ")";
ob_flush();
flush();

以下代碼主要是在客戶端與服務(wù)端建立http長(zhǎng)連接

// 客戶端代碼 (javascript)
function Comet(url,cbk){
    var url          = url;
    var cbk          = cbk;
    var timestamp    = 0;
    var msgid = 0;
    var noerror      = true

    var main         = function(){
        $.ajax({
            type:"GET",
            url: url,
            dataType : "jsonp",
            timeout: 5000,
            data: {
                timestamp: timestamp,
                msgid: msgid
            }
        }).success(function(res){
            var isFrist = timestamp;
            timestamp = res.timestamp;
            if(res.data[0]) {
                   msgid = res.data[0]["MsgId"];
            }

            noerror = true;
            if(isFrist == 0)return false;
            if(cbk)cbk(res);
        }).complete(function() {
            if (!noerror){
                setTimeout(main, 10); 
            }else{
                setTimeout(main, 10); 
            }
            noerror = false;
        });
    };

    return main();
}

Comet("http://dev.sobird.me/_wechat.php", function(res) {
    var data = res.data;
    var danm={
       info: "", //文字 
       href: "", //鏈接 
       close: false, //顯示關(guān)閉按鈕 
       speed: 6, //延遲,單位秒,默認(rèn)6 
       color: randRgb(), //顏色,默認(rèn)白色 
       old_ie_color: randRgb(), //ie低版兼容色,不能與網(wǎng)頁(yè)背景相同,默認(rèn)黑色 
     }
    if(data.length > 0) {
        $.each(data, function(index, item) {
        var msgType = item.MsgType

        switch (msgType) {
            case "text" :
            var text = item.Content;
            danm.info = text;

                $("body").barrager(danm);
            break;
            case "image" :
            var img = "http://dev.sobird.me/wechat/pic?src=" + item.PicUrl;
            danm.img = img;

            disImage(img, function() {
                    $("body").barrager(danm);
            });
            break;
            default:
        }
    });
    }
});

完整代碼：Jaring.js 文件最底部

在博客上實(shí)現(xiàn)彈幕效果相對(duì)來講就簡(jiǎn)單了，在Github上有很多的開源庫(kù)(基于jQuery)，我使用的是這個(gè)庫(kù): jquery.barrager.js，在博客中引入這個(gè)庫(kù)你就可以像下面這樣使用了

// 把官方示例挪過來~~
var item={
    img:"static/heisenberg.png", //圖片
    info:"彈幕文字信息", //文字
    href:"http://www.yaseng.org", //鏈接
    close:true, //顯示關(guān)閉按鈕
    speed:8, //延遲,單位秒,默認(rèn)8
    bottom:70, //距離底部高度,單位px,默認(rèn)隨機(jī)
    color:"#fff", //顏色,默認(rèn)白色
    old_ie_color:"#000000", //ie低版兼容色,不能與網(wǎng)頁(yè)背景相同,默認(rèn)黑色
}
$("body").barrager(item);

基于jQuery的彈幕效果，代碼簡(jiǎn)短，調(diào)整好合適的CSS樣式

不妨現(xiàn)在就掃描下面二維碼，關(guān)注我的公眾號(hào)后，隨便發(fā)一點(diǎn)文字或圖片，然后到我的個(gè)人博客看看