微信程式開發系列教程（四）使用微信API建立公眾號自定義選單

大家可能經常看到一些微信公眾號具有功能強大的自定義選單，點選之後可以訪問很多有用的功能。

這篇教程就教大家如何動手做一做。

這個教程最後實現的效果是：建立一個一級選單“UI5", 點選之後彈出兩個二級選單，如下圖藍色區域所示。每個二級選單都能完成一些任務。

那麼用什麼API建立這些自定義選單呢？微信公眾號平臺技術文件中，點選"自定義選單":

文件裡給了建立自定義選單需要維護引數的HTTPpost報文的格式：

回到我的例子，我用postman傳送這個HTTP post請求：

這是我HTTP post的報文內容：

{"button":[
{"name":"UI5","sub_button":[{"type": "view","name": "Jerry List","url": "http://wechatjerry.herokuapp.com/ui5"},{"type": "click","name": "Other UI5 application","key": "dataQuery"}]
}
]
}

上述json格式的報文定義了一個一級選單，標籤文字為UI5。兩個二級選單(sub_button)，型別分別為view和click。

view型別即繫結一個HTML頁面到該二級選單，點選之後跳轉到這個頁面去。我的例子繫結的html頁面是 http://wechatjerry.herokuapp.com/ui5 。 型別為click的選單很好理解，點選後，微信平臺會傳送一個事件給您公眾號的微信伺服器上。您需要在您的微信伺服器裡對這個時間做處理。事件型別通過引數key指定，我上述例子的型別是dataQuery，這個引數可以隨意指定。

響應型別為click的微信自定義二級選單的虛擬碼如下：

app.route('/').post(function(req,res){
    req.on("end",function(){        var msgType = formattedValue(getXMLNodeValue('MsgType', content));        if( msgType === "event"){            var eventKey = formattedValue(getXMLNodeValue('EventKey', content));            if( eventKey === "dataQuery"){                // 響應微信自定義二級選單的點選
            }
        }
    }
    );

要獲取更多Jerry的原創技術文章，請關注公眾號"汪子熙"或者掃描下面二維碼:

來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/24475491/viewspace-2200088/，如需轉載，請註明出處，否則將追究法律責任。