C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(9)-微信門(mén)戶(hù)菜單管理及提交到微信服務(wù)器

微信公眾號(hào)（包括服務(wù)號(hào)和訂閱號(hào)）都可以對(duì)菜單進(jìn)行自定義設(shè)置，我們?yōu)榱朔奖愎芾恚话阆劝巡藛螖?shù)據(jù)在本地管理維護(hù)，需要更新的時(shí)候，把它們更新到微信服務(wù)器上就可以了。本文基于這個(gè)方式，介紹我的微信門(mén)戶(hù)平臺(tái)管理系統(tǒng)中菜單提交到微信服務(wù)器上的操作。微信門(mén)戶(hù)應(yīng)用管理系統(tǒng)，采用基于MVC+EasyUI的路線(xiàn)，由于多數(shù)域名服務(wù)器上都只能支持.NET4.0，所以以MVC3，C#4.0作為開(kāi)發(fā)基礎(chǔ)，基本上能夠部署在任何.NET服務(wù)器上。

1、微信菜單的要求及相關(guān)界面設(shè)計(jì)

微信公眾號(hào)的菜單我們可以通過(guò)網(wǎng)站進(jìn)行本地的管理，維護(hù)好它們之間的層級(jí)關(guān)系，由于微信對(duì)自定義的菜單要求比較嚴(yán)格，以下是微信對(duì)自定義菜單的要求：

目前自定義菜單最多包括3個(gè)一級(jí)菜單，每個(gè)一級(jí)菜單最多包含5個(gè)二級(jí)菜單。一級(jí)菜單最多4個(gè)漢字，二級(jí)菜單最多7個(gè)漢字，多出來(lái)的部分將會(huì)以“...”代替。

因此我們自己根據(jù)約定，不要越界即可，否則提交菜單到服務(wù)器，可能會(huì)返回一些錯(cuò)誤，這些細(xì)節(jié)，我們?cè)趧?chuàng)建本地菜單管理的時(shí)候，注意一下就可以了。我在早期的一篇文章也介紹了自定義菜單的一些內(nèi)容，需要可以進(jìn)行回顧一下《C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(6)--微信門(mén)戶(hù)菜單的管理操作》，本篇主要是介紹在我的平臺(tái)管理系統(tǒng)里面，調(diào)用前面介紹的菜單接口API，實(shí)現(xiàn)菜單提交到服務(wù)器的操作。

根據(jù)微信的自定義菜單要求，我在管理系統(tǒng)里面，對(duì)微信的菜單幾個(gè)基礎(chǔ)性的界面設(shè)計(jì)如下。

主菜單管理界面如下所示。

添加菜單的界面設(shè)計(jì)如下所示

微信菜單的修改界面如下所示

微信菜單定義是存儲(chǔ)在數(shù)據(jù)庫(kù)里面，如果需要提交到微信服務(wù)器上并生效，則需要調(diào)用微信API接口進(jìn)行處理，我在頁(yè)面的Controller控制器里增加一個(gè)提交到服務(wù)器的處理方法。

2、提交菜單到微信服務(wù)器的操作

上面幾個(gè)界面，主要就是根據(jù)微信菜單的屬性，對(duì)菜單進(jìn)行維護(hù)管理，我們最終的目的是把它們放到服務(wù)器上去，供我們處理客戶(hù)的相關(guān)事件操作的。

提交菜單的操作，我們?cè)贛VC的View頁(yè)面里面，使用JQuery的Ajax提交即可（前提是我們?cè)诳刂破骼锩嫣砑酉鄳?yīng)的處理，后面介紹），界面腳本代碼如下所示。

        //綁定提交按鈕的的點(diǎn)擊事件        function BindSubmitEvent() {            $("#btnSubmit").click(function () {                $.messager.confirm("提交菜單確認(rèn)", "您確認(rèn)需要提交菜單到微信服務(wù)器嗎？", function (action) {                    if (action) {                        //提交數(shù)據(jù)                        $.ajax({                            url: '/Menu/UpdateWeixinMenu',                            type: 'post',                            dataType: 'json',                            success: function (data) {                                if (data.Success) {                                    $.messager.alert("提示", "提交微信菜單成功");                                }                                else {                                    $.messager.alert("提示", "提交微信菜單失敗:" + data.ErrorMessage);                                }                            },                            data: ''                        });                    }                });            });        }

上面紅色的代碼，就是我們?cè)贛VC的控制器里面定義的方法，我們只需要通過(guò)POST方法，對(duì)控制器方法調(diào)用，就能實(shí)現(xiàn)菜單提交到微信服務(wù)器上，至于具體里面的細(xì)節(jié)，我們可以把它挪到控制器或者更底層進(jìn)行處理就是了，頁(yè)面不需要涉及太多的邏輯就是了。

上面那個(gè)Menu控制器的UpdateWeixinMenu的方法代碼如下所示（主要就是根據(jù)我前面介紹過(guò)的開(kāi)發(fā)模型進(jìn)行處理就是了）。

        /// <summary>        ///更新微信菜單        /// </summary>        /// <returns></returns>        public ActionResult UpdateWeixinMenu()        {            string token = base.GetaccessToken();            MenuListJson menuJson = GetWeixinMenu();            IMenuApi menuApi = new MenuApi();            CommonResult result = menuApi.CreateMenu(token, menuJson);            return ToJsonContent(result);        }

上面的幾個(gè)方法這里逐一介紹一下。GetAccessToken主要就是獲得當(dāng)前操作的訪(fǎng)問(wèn)令牌，這里的操作可以用緩存進(jìn)行緩存，否則頻繁的獲取AccessToken，達(dá)到每天指定的次數(shù)后，當(dāng)天就不能再用了。

GetWeixinMenu方法，主要就是為了方便，對(duì)獲取構(gòu)造微信的自定義菜單數(shù)據(jù)進(jìn)行了一個(gè)函數(shù)封裝，具體代碼如下所示。

       /// <summary>        /// 生成微信菜單的Json數(shù)據(jù)        /// </summary>        /// <returns></returns>        PRivate MenuListJson GetWeixinMenu()        {            MenuListJson menuJson = new MenuListJson();            List<MenuNodeInfo> menuList = BLLFactory<Menu>.Instance.GetTree();            foreach (MenuNodeInfo info in menuList)            {                ButtonType type = (info.Type == "click") ? ButtonType.click : ButtonType.view;                string value = (type == ButtonType.click) ? info.Key : info.Url;                MenuJson weiInfo = new MenuJson(info.Name, type, value);                AddSubMenuButton(weiInfo, info.Children);                menuJson.button.Add(weiInfo);            }            return menuJson;        }

        private void AddSubMenuButton(MenuJson menu, List<MenuNodeInfo> menuList)        {            if (menuList.Count > 0)            {                menu.sub_button = new List<MenuJson>();            }            foreach (MenuNodeInfo info in menuList)            {                ButtonType type = (info.Type == "click") ? ButtonType.click : ButtonType.view;                string value = (type == ButtonType.click) ? info.Key : info.Url;                MenuJson weiInfo = new MenuJson(info.Name, type, value);                menu.sub_button.Add(weiInfo);                AddSubMenuButton(weiInfo, info.Children);            }        }

上面的代碼，就是把本地存儲(chǔ)的MenuNodeInfo數(shù)據(jù)，通過(guò)遞歸遍歷的方式，轉(zhuǎn)換為微信的自定義菜單實(shí)體MenuJson，這樣我們調(diào)用API就非常方便了，這個(gè)函數(shù)主要負(fù)責(zé)構(gòu)造對(duì)應(yīng)的實(shí)體信息就是了。至于調(diào)用微信API提交菜單的事情，還是讓API自己親自處理為好，他們的代碼如下所示（也就是上面函數(shù)的部分代碼）。

        IMenuApi menuApi = new MenuApi();        CommonResult result = menuApi.CreateMenu(token, menuJson);        return ToJsonContent(result);

最終的結(jié)果是返回一個(gè)通用的結(jié)果CommonResult，這個(gè)結(jié)果對(duì)象，非常方便腳本的處理，如果有錯(cuò)誤，則提示錯(cuò)誤，否則也方便判斷布爾值，也就是上面的頁(yè)面代碼腳本。

success: function (data) {        if (data.Success) {                  $.messager.alert("提示", "提交微信菜單成功");           }          else {                    $.messager.alert("提示", "提交微信菜單失敗:" + data.ErrorMessage);            }       },

通過(guò)以上幾部分的代碼，我們就可以實(shí)現(xiàn)前臺(tái)MVC的視圖界面，調(diào)用后臺(tái)封裝好的微信API，實(shí)現(xiàn)菜單的提交處理了。

如果感興趣或者體驗(yàn)相關(guān)的客服應(yīng)答功能，可以關(guān)注我的微信了解下。具體效果可以關(guān)注我的微信門(mén)戶(hù)：廣州愛(ài)奇迪，也可以?huà)呙柘旅娑S碼進(jìn)行關(guān)注了解。

如果對(duì)這個(gè)系列感興趣，可以關(guān)注我的其他文章，系列隨筆如下所示：

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(25)-微信企業(yè)號(hào)的客戶(hù)端管理功能

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(24)-微信小店貨架信息管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(23)-微信小店商品管理接口的封裝和測(cè)試

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(22)-微信小店的開(kāi)發(fā)和使用

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(21)-微信企業(yè)號(hào)的消息和事件的接收處理及解密

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(20)-微信企業(yè)號(hào)的菜單管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(19)-微信企業(yè)號(hào)的消息發(fā)送（文本、圖片、文件、語(yǔ)音、視頻、圖文消息等）

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(18)-微信企業(yè)號(hào)的通訊錄管理開(kāi)發(fā)之成員管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(17)-微信企業(yè)號(hào)的通訊錄管理開(kāi)發(fā)之部門(mén)管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(16)-微信企業(yè)號(hào)的配置和使用

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(15)-微信菜單增加掃一掃、發(fā)圖片、發(fā)地理位置功能

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(14)-在微信菜單中采用重定向獲取用戶(hù)數(shù)據(jù)

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(13)-使用地理位置擴(kuò)展相關(guān)應(yīng)用

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(12)-使用語(yǔ)音處理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(11)--微信菜單的多種表現(xiàn)方式介紹

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(10)--在管理系統(tǒng)中同步微信用戶(hù)分組信息

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(9)-微信門(mén)戶(hù)菜單管理及提交到微信服務(wù)器

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(8)-微信門(mén)戶(hù)應(yīng)用管理系統(tǒng)功能介紹

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(7)-微信多客服功能及開(kāi)發(fā)集成

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(6)--微信門(mén)戶(hù)菜單的管理操作

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(5)--用戶(hù)分組信息管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(4)--關(guān)注用戶(hù)列表及詳細(xì)信息管理

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(3)--文本消息和圖文消息的應(yīng)答

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(2)--微信消息的處理和應(yīng)答

C#開(kāi)發(fā)微信門(mén)戶(hù)及應(yīng)用(1)--開(kāi)始使用微信接口