我在寫一個微信牆（一）

早就想寫一個微信牆了，畢竟這玩意兒很好用嘛。

一直計劃計劃計劃了一個學期，結果一事無成。有一次跟廖總聊天時候還說，趕忙積累點東西吧，大三了，再不作點什麼就真的一事無成一無全部畢業之後廢人一個。

寫一個微信牆倒也不是什麼大事。但好歹作點什麼吧。

思路

動手寫代碼以前固然要先理清思路。

第一個思路：其實沒作過任何微信公衆平臺的功能開發，基於本身簡單的瞭解，最初的想法是將接收消息接口給接上。大概是之前用過的一個免費微信牆的模式，接收特定消息內容，進入微信牆模式。接收以後的全部信息顯示到牆上，直到輸入特定退出消息內容。

好像這麼作是比較正常的。可是缺點是，把消息所有導到本身的數據庫以後，本身就得作完完整的一套工具來完成微信正常的其餘功能（是這樣吧？我也沒確認過……）。工做量太大了。事實上並不須要什麼本身寫的工具去代替微信自己的後臺，它的功能很好用，並且在愈來愈好用。

剛好廖總（又是廖總=。=）在另一次聊天中提到：咱們可不能夠寫一個能夠很輕易複用的東西？不要那麼多功能，就是一個網頁，有輸入框，你進來就能夠輸入內容，而後給你顯示在牆上。因而順着這個思路想下去，最後產生了第二個思路。

第二個思路：用微信公衆號的網頁服務，給網頁受權獲取用戶基本信息，將基本信息存入數據庫，並設定cookie，讓受權成功的用戶得到發消息的權限。用戶提交表單，微信牆頁面用ajax異步更新數據，將最新的用戶消息顯示在牆上。這樣忽然就感受好不少，只須要在公衆號後臺設置一個受權回調頁面域名，以及將AppID和AppSecret做爲參數修改入網站源碼中，而後即可以隨便複用了。

那麼最終肯定的思路就是思路二了。

結構

思路理了以後，須要大概列一下要作的事情。

決定仍是用 Python + Tornado + MongoDB 來寫。已經迷上了非關係型數據庫。

Handlers：
    MainHandler/微信牆頁面
        -渲染微信牆頁面
    AuthHandler/獲取受權信息
        -接受用戶受權參數 code
        -使用 code 換取 access_token（解析json數據）
        -使用 access_token 獲取用戶信息
        -將用戶信息保存到數據庫
        -set_cookie
    FormHandler/發送消息用表單
        -渲染髮送消息表單
        -接受表單數據，並存入數據庫
    ApiHandler/微信牆消息數據接口
        -以json數據格式輸出微信牆頁面請求的數據

Templates：
    index.html微信牆頁面
        -未受權用戶
            -顯示數據庫內容
            -即時更新並顯示最新內容
                -從服務器獲取json數據
                -解析json數據
                -格式化消息並添加至消息列表中
        -受權用戶
            -包括未受權用戶功能
            -發送消息（此處的方案是在底部增長一個內聯框架，專門用於表單提交，同時不干擾其餘內容）
    form.html表單頁面
        -將表單提交給FormHandler
    api.html數據接口頁面

這篇記錄就不寫得那麼詳細了，我把我以爲可能值得記錄分享一下的東西總結總結。

1.getJSON()從服務器獲取json數據

<script type="text/javascript">
var len=0;//已獲取的消息的總數
var cur=0;//當前位置
var data=new Array();//用於存放獲取的消息
var lastid=0;//最近獲取的消息的id

function messageAdd(){//新增消息函數
    if(cur==len){
        messageData();
        return false;
    }
    var str='<div class=\"event\" id=\"event-'+data[cur][0]+'\" onclick=\"viewOne('+cur+',this);\" style=\"display:none\"><div class=\"label\"><img src=\"'+data[cur][1]+'\"><label>'+data[cur][2]+'</label></div><div class=\"content\"><div class=\"summary\">'+data[cur][3]+'</div></div></div>';
    //格式化消息
    $("#list").prepend(str);
    //將消息增長到列表中
    $("#event-"+data[cur][0]).slideDown();
    //調用jquery函數，顯示新消息
    cur++;
    messageData();
}
function messageData(){
    var url='/api';//設置數據接口地址
    $.getJSON(url,{lastid:lastid},function(d) {
    //此處經過get方法傳遞參數lastid獲取最新數據
        if(d['ret']==1){//當獲取到數據
            $.each(d['data'], function(i,v){
            data.push(new Array(v['id'],v['avatar'],v['nickname'],v['content']));
            //將獲取的json數據添加入data數組
            lastid=v['id'];
            len++;
            });
        }else{
            window.setTimeout('messageData();', 2000);//等待2000毫秒後從新執行該函數
        } 
    });
}
window.onload=function(){
    setInterval(messageAdd,500);//每隔500毫秒執行一次
}
</script>

此處代碼可複用於」js獲取json數據「，」評論即時更新「

2.異步請求獲取信息

class AuthHandler(tornado.web.RequestHandler):
    @tornado.web.asynchronous//記得加上這一句
    def get(self):
        http = tornado.httpclient.AsyncHTTPClient()
        http.fetch("http://127.0.0.1:8002/api?lastid=0",callback=self.on_response)
        //fetch(參數一，參數二)，參數一爲獲取頁面的地址，參數二爲回調函數

    def on_response(self, response):
        import json
        if response.error:
            raise tornado.web.HTTPError(500)
        result = json.loads(response.body)
        self.write(result["data"][0]["content"])
        self.finish()

這是使用 Tornado 內置的異步請求 HTTP 客戶端來獲取數據的例子。

經測試，數據獲取功能正常，json數據解析正常。可複用。

3.轉化並輸出json數據

import json //引入json包
if response.error://當發生錯誤時，請求出現錯誤提示500
    raise tornado.web.HTTPError(500)
result = json.loads(response.body)
self.write(result["data"][0]["content"])
json.loads(json數據)：將數據從json類型向python原始類型轉化。

不須要進行特殊處理的話，不必對json數據作「解析」。

轉化好的數據能夠直接經過下標進行操做，例如：

result = [[1, 2, 3], 123, u'abc', {u'key2': [4, 5, 6], u'key1': [1, 2, 3]}]

咱們要輸出key2列表中的第二個元素5：result[3][「key2″][1]。（要記得下標從0開始）

先寫到這裏，待續吧。

睡覺了。

早上修改了些許內容。就等拿一個公衆帳號測試了=。=。如今去把請求構造好，@楊老闆求給力。