8, custom menus and menu handling the incident response

1 Overview

Custom menu can help the public number rich interface, allowing users to better and faster understanding of the function of the public number. The default menu is divided into menus and personalized menus. Personalized menu interface is a public number in order to help achieve a flexible business operations, developers can through the interface, so that different user groups, the public see a different number of custom menu. The interface is open to certified subscription number and certified service number. This article focuses on micro-channel to create custom menus, search, delete, menu response methods of the type of event, and the menu of the application interface integration reference. Due to limited space can not cover everything, can only welcome Jade throwing bricks, we can do hereby extended depth application.

2, custom menu rules

Custom menus and menu into a second menu.
The number of menu level 1 to 3, that is open to the public account directly arranged at the bottom you can see up to three buttons. Text menu level can not be up to four characters, the extra part will be "..." instead.
Belonging to a second-level menu menus, in an amount of 1-5. Secondary menu text does not contain no more than eight characters, the extra part will be "..." instead.
Whether a menu or two menus, there are two trigger events to choose from, namely: click (click, can not exceed 128 bytes) and open the URL (view, url can not be more than 256 bytes).
When the presence of secondary menu next level menu, a menu button is clicked this will not have any incidents.
After you create custom menus, menu refresh policy is that when a user enters the number of public sessions page number or public profile page, if a request to pull on the menu found within 5 minutes ago, will pull at the menu, if the menu has update, the client will refresh the menu. You can try again focus public attention canceled account, you can see the effect of the creation of the test.

3, custom menu interface allows the kind of button type

Custom Menu button interface may implement multiple types, as follows:

1, click: click push event the user clicks the click type button, the micro-channel server via a message interface push message type architecture event to the developer (Reference Message Interface Guide), and to bring buttons developer filled key value, development you can interact with the user through the key-defined value;

2, view: view Jump URL user clicks the button type, micro-channel client opens developers to fill in the button page URL, the page can be authorized to obtain basic information about the user interface to combine, to obtain basic information about the user.

3, scancode_push: scan code after the user clicks the button push event, the micro-channel client invoking sweep the tools to complete the scan code scans showed operation (if a URL, will enter the URL), and the scan code will pass the results of to the developer, the developer can lower a message.

4, scancode_waitmsg: scan code and eject push event "After receiving the message" prompt box user clicks the button, the micro-channel client invoking sweep the tool, the scan code to complete the operation, the result of the scan code developer to pass, while Collapse sweep the tool, then pop-up "message received in" prompt box, then you may receive a message sent by the developer.

5, pic_sysphoto: the pop-up camera system made plans user clicks the button, micro-channel will be transferred from the client system camera, take the picture, send photo will be taken to the developer, and push the event to the developer, but put away the camera system then you may receive a message issued by the developer.

6, pic_photo_or_album: pop-up pictures or albums made plans after the user clicks the button, micro-channel client will pop up a selector for the user to select the "camera" or "mobile photo album to select from." Users choose to go after the other two processes.

7, pic_weixin: After pop micro letter albums made plans to implement user clicks the button, micro-channel client will be transferred from the micro-letter album, complete the selection operation, photos will be selected to the server developers, and push the event to the developer, while away album, then you may receive a message sent by the developer.

8, location_select: pop location selector after user clicks the button, the micro-channel client invoking location selection tool selection operation is completed, the selected geographic location to the server developers, while the selection tool stowed position, then you may receive a message issued by the developer.

9, media_id: next message (in addition to text messages) media_id under the user clicks the button type, micro-channel server developer will fill permanent material corresponding to the material sent to the user id, permanent type material may be images, audio, video, map text messages. Note: you must be a lawful permanent material id id in the "material management / permanent new material" interface to upload obtained.

10, view_limited: Jump graphic user clicks view_limited message URL type buttons, micro-channel client opens developers to fill in the button corresponding permanent graphic material id message URL, permanent creative types only support graphic messages. Note: you must be a lawful permanent material id id in the "material management / permanent new material" interface to upload obtained.

Please note that all events 3-8, and only supports micro-channel iPhone5.4.1 or later, and Android5.4 above version of the micro-channel user, the user clicks on an older version micro-channel will not respond, the developer can not normally receive the event push. 9 and 10, is dedicated to its platform to third-party certification is not micro-channel (specifically, the certification does not pass) type of event subscription number ready, they are no event push, capacity is relatively limited number of other types of public You do not have to use.

4. Create a menu

4.1, create the interface menu

Providing micro-channel interface (API) can create a custom menu, associated with the interface are described below.

http request method: POST (use the https protocol)

https://api.weixin.qq.com/cgi-bin/menu/create?access_token=ACCESS_TOKEN

Example click and view request

{
     "button":[
     {    
          "type":"click",
          "name":"今日歌曲", "key":"V1001_TODAY_MUSIC" }, { "name":"菜单", "sub_button":[ { "type":"view", "name":"搜索", "url":"http://www.soso.com/" }, { "type":"miniprogram", "name":"wxa", "url":"http://mp.weixin.qq.com", "appid":"wx286b93c14bbf93aa", "pagepath":"pages/lunar/index" }, { "type":"click", "name":"赞一下我们", "key":"V1001_GOOD" }] }] }

Examples of other new request button type of

{
    "button": [
        {
            "name": "扫码", 
            "sub_button": [
                {
                    "type": "scancode_waitmsg", "name": "扫码带提示", "key": "rselfmenu_0_0", "sub_button": [ ] }, { "type": "scancode_push", "name": "扫码推事件", "key": "rselfmenu_0_1", "sub_button": [ ] } ] }, { "name": "发图", "sub_button": [ { "type": "pic_sysphoto", "name": "系统拍照发图", "key": "rselfmenu_1_0", "sub_button": [ ] }, { "type": "pic_photo_or_album", "name": "拍照或者相册发图", "key": "rselfmenu_1_1", "sub_button": [ ] }, { "type": "pic_weixin", "name": "微信相册发图", "key": "rselfmenu_1_2", "sub_button": [ ] } ] }, { "name": "发送位置", "type": "location_select", "key": "rselfmenu_2_0" }, { "type": "media_id", "name": "图片", "media_id": "MEDIA_ID1" }, { "type": "view_limited", "name": "图文消息", "media_id": "MEDIA_ID2" } ] }

Parameter Description

参数           是否必须                   说明
button         是                        一级菜单数组，个数应为1~3个
sub_button  否                       二级菜单数组，个数应为1~5个 type 是 菜单的响应动作类型，view表示网页类型，click表示点击类型，miniprogram表示小程序类型 name 是 菜单标题， 不超过16个字节，子菜单不超过60个字节 key click等点击类型必须 菜单KEY值，用于消息接口推送，不超过128字节 url view、miniprogram类型必须 网页 链接，用户点击菜单可打开链接，不超过1024字节。 type为miniprogram时，不支持小程序的老版本客户端将打开本url。 media_id media_id类型和view_limited类型必须 调用新增永久素材接口返回的合法media_id appid miniprogram类型必须 小程序的appid（仅认证公众号可配置） pagepath miniprogram类型必须 小程序的页面路径

4.2, using Senparc.Weixin.MP SDK to create custom menus

Created using an interface provided by the micro-letter code volume is still very large menu, here we use Senparc.Weixin.MP SDK to quickly create custom menus. Very simple, just three steps:

The first step: Get AccessToken

var accessToken = AccessTokenContainer.TryGetToken(appId, appSecret).access_token;

PS: If the third step using AppId substituted AccessToken, then this step can be omitted.

Step Two: Organize menu content

ButtonGroup bg = new ButtonGroup();
        
//菜单1
var subButton = new SubButton()
{
    name = "菜单1" }; bg.button.Add(subButton); subButton.sub_button.Add(new SingleClickButton() { key = "SubClickRoot_Text", name = "返回文本" }); subButton.sub_button.Add(new SingleClickButton() { key = "SubClickRoot_News", name = "返回图文" }); subButton.sub_button.Add(new SingleClickButton() { key = "SubClickRoot_Music", name = "返回音乐" }); subButton.sub_button.Add(new SingleViewButton() { url = "http://www.rdiframework.net/", name = "Url跳转" }); //菜单2 var subButton2 = new SubButton() { name = "菜单2" }; bg.button.Add(subButton2); subButton2.sub_button.Add(new SingleClickButton() { key = "SubClickRoot_Text", name = "返回文本" }); subButton2.sub_button.Add(new SingleClickButton() { key = "SubClickRoot_News", name = "返回图文" });

Third step: WeChat submitted to the server

var result = CommonApi.CreateMenu(accessToken, bg);

SingleClickButton respectively above and SingleViewButton micro letter click and view the API in response to two kinds of menu mode.

By performing the above code is created as we can see the following menu, you can see above, we created a custom menu through code.

The effect of self-defined menu

4.3, the query has been created menu

Use interface to create custom menus, developers can also customize the interface to query the menu structure to use. Also note that after setting up personalized menus, use the Customize menu query interface can get the default menu and all personal menu information.
Request Description

http请求方式：GET
https://api.weixin.qq.com/cgi-bin/menu/get?access_token=ACCESS_TOKEN

Json data to note the return of two types, the default menu and personalized menus.
menu is the default menu, conditionalmenu personalized menu list. Field Description See Description Interface personalized menu page .
Senparc.Weixin.MP SDK using the query has created a menu interface requires only one line of code, as follows:

var result = CommonApi.GetMenu(accessToken);

4.4, delete created menu

Use interface to create custom menus, developers can also use the interface to delete the custom menu currently in use. Also note that while personalized menus, calls this interface will remove all of the default menu and personalized menus.

Request Description

http请求方式：GET
https://api.weixin.qq.com/cgi-bin/menu/delete?access_token=ACCESS_TOKEN

Use Senparc.Weixin.MP SDK delete created menu interface requires only one line of code, as follows:

var result = CommonApi.DeleteMenu(accessToken);

5, menu response handling events

Either click or view, the server will receive a different incident response. The difference is that the client can then click to get return information, and view receipt of the request, regardless of what information is returned, the client can not receive (directly open the URL). When the user clicks the custom menu, click on the event micro-channel will be pushed to the developer, please note, click on the pop-up menu submenu, it will not be reported. In addition to all of the first three events of the eight types, only supports micro-channel iPhone5.4.1 or later, and Android5.4 above version of the micro-channel user, the user clicks on an older version micro-channel will not respond, the developer can not be normally received event push.

To handle events on the menu response, we only need to override the corresponding event Senparc.Weixin.MP SDK, specific details are as follows. Reference code given below for each type of event handling, specific business applications can spread out to do this in-depth application can be.

5.1, click on the menu when events push pull message

public override IResponseMessageBase OnTextOrEventRequest(RequestMessageText requestMessage) { // 预处理文字或事件类型请求。 // 这个请求是一个比较特殊的请求，通常用于统一处理来自文字或菜单按钮的同一个执行逻辑， // 会在执行OnTextRequest或OnEventRequest之前触发，具有以下一些特征： // 1、如果返回null，则继续执行OnTextRequest或OnEventRequest // 2、如果返回不为null，则终止执行OnTextRequest或OnEventRequest，返回最终ResponseMessage // 3、如果是事件，则会将RequestMessageEvent自动转为RequestMessageText类型，其中RequestMessageText.Content就是RequestMessageEvent.EventKey if (requestMessage.Content == "OneClick") { var strongResponseMessage = CreateResponseMessage<ResponseMessageText>(); strongResponseMessage.Content = "您点击了底部按钮。\r\n为了测试微信软件换行bug的应对措施，这里做了一个——\r\n换行"; return strongResponseMessage; } return null;//返回null，则继续执行OnTextRequest或OnEventRequest } public override IResponseMessageBase OnEvent_ClickRequest(RequestMessageEvent_Click requestMessage) { //获得当前公众号 WeixinOfficialAccountEntity account = RDIFrameworkService.Instance.WeixinBasicService.GetOfficialAccountEntity(Id); IResponseMessageBase reponseMessage = null; //菜单点击，需要跟创建菜单时的Key匹配 switch (requestMessage.EventKey) { case "OneClick": { //这个过程实际已经在OnTextOrEventRequest中完成，这里不会执行到。 var strongResponseMessage = CreateResponseMessage<ResponseMessageText>(); reponseMessage = strongResponseMessage; strongResponseMessage.Content = "您点击了底部按钮。\r\n为了测试微信软件换行bug的应对措施，这里做了一个——\r\n换行"; } break; case "SubClickRoot_Text": { var strongResponseMessage = CreateResponseMessage<ResponseMessageText>(); reponseMessage = strongResponseMessage; strongResponseMessage.Content = "您点击了子菜单按钮。"; } break; case "SubClickRoot_News": { var strongResponseMessage = CreateResponseMessage<ResponseMessageNews>(); reponseMessage = strongResponseMessage; strongResponseMessage.Articles.Add(new Article() { Title = "您点击了子菜单图文按钮", Description = "您点击了子菜单图文按钮，这是一条图文信息。", PicUrl = "http://www.rdiframework.net/img/weixing-ma.png", Url = "http://www.rdiframework.net/" }); } break; case "SubClickRoot_Music": { //上传缩略图 var uploadResult = MediaApi.UploadTemporaryMedia(account.AccessToken, UploadMediaFileType.image,Server.GetMapPath("~/Content/Images/weixing-ma.png")); //设置音乐信息 var strongResponseMessage = CreateResponseMessage<ResponseMessageMusic>(); reponseMessage = strongResponseMessage; strongResponseMessage.Music.Title = "天籁之音"; strongResponseMessage.Music.Description = "真的是天籁之音"; strongResponseMessage.Music.MusicUrl = "http://www.rdiframework.net/resource/music/music1.mp3"; strongResponseMessage.Music.HQMusicUrl = "http://www.rdiframework.net/resource/music/music1.mp3"; strongResponseMessage.Music.ThumbMediaId = uploadResult.media_id; } break; case "SubClickRoot_Image": { //上传图片 var uploadResult = MediaApi.UploadTemporaryMedia(account.AccessToken, UploadMediaFileType.image, Server.GetMapPath("~/Content/Images/weixing-ma.png")); //设置图片信息 var strongResponseMessage = CreateResponseMessage<ResponseMessageImage>(); reponseMessage = strongResponseMessage; strongResponseMessage.Image.MediaId = uploadResult.media_id; } break; default: { var strongResponseMessage = CreateResponseMessage<ResponseMessageText>(); strongResponseMessage.Content = "您点击了按钮，EventKey：" + requestMessage.EventKey; reponseMessage = strongResponseMessage; } break; } return reponseMessage; }

In Section 4.2 we created the menu, we click the "Return Teletext" secondary menu item, because we defined for this menu item KEY as "SubClickRoot_News", debug state shown in the following figure.

Graphic return event debugging state

We returned to the micro-channel operating results look, you can see our own server definition has the right to return the graphic information to us, other similar events menu operation.

[Graphic return event runs effect]] ( https://img2018.cnblogs.com/blog/157572/201904/157572-20190413130528327-1661526058.png )

Again we return to a piece of music, you can also play music directly returned, as shown below.

Return to musical events operating results

Music playback events

5.2, hit the menu when events push hoplinks

public override IResponseMessageBase OnEvent_ViewRequest(RequestMessageEvent_View requestMessage) { //说明：这条消息只作为接收，下面的responseMessage到达不了客户端，类似OnEvent_UnsubscribeRequest var responseMessage = CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "您点击了view按钮，将打开网页：" + requestMessage.EventKey; return responseMessage; }

5.3, scan code push to event push

/// <summary>
/// 事件之扫码推事件(scancode_push) /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_ScancodePushRequest(RequestMessageEvent_Scancode_Push requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之扫码推事件"; return responseMessage; }

5.4, and the scan code push event pop-up "message reception" event push balloon

/// <summary>
/// 事件之扫码推事件且弹出“消息接收中”提示框(scancode_waitmsg) /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_ScancodeWaitmsgRequest(RequestMessageEvent_Scancode_Waitmsg requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之扫码推事件且弹出“消息接收中”提示框"; return responseMessage; }

5.5, the pop-up camera system made plans to push events

/// <summary>
/// 事件之弹出系统拍照发图(pic_sysphoto) /// 实际测试时发现微信并没有推送RequestMessageEvent_Pic_Sysphoto消息，只能接收到用户在微信中发送的图片消息。 /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_PicSysphotoRequest(RequestMessageEvent_Pic_Sysphoto requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之弹出系统拍照发图"; return responseMessage; }

5.6, or pop-up photograph album made plans to push events

/// <summary>
/// 事件之弹出拍照或者相册发图（pic_photo_or_album） /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_PicPhotoOrAlbumRequest(RequestMessageEvent_Pic_Photo_Or_Album requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之弹出拍照或者相册发图"; return responseMessage; }

5.7, micro-channel pop album made plans for events that push

/// <summary>
/// 事件之弹出微信相册发图器(pic_weixin) /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_PicWeixinRequest(RequestMessageEvent_Pic_Weixin requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之弹出微信相册发图器"; return responseMessage; }

5.8, location selector pop-up event push

/// <summary>
/// 事件之弹出地理位置选择器（location_select） /// </summary> /// <param name="requestMessage"></param> /// <returns></returns> public override IResponseMessageBase OnEvent_LocationSelectRequest(RequestMessageEvent_Location_Select requestMessage) { var responseMessage = base.CreateResponseMessage<ResponseMessageText>(); responseMessage.Content = "事件之弹出地理位置选择器"; return responseMessage; }

6, application integration interface menu reference

Practical application menus may change at any time, our end users are unlikely to go on the menu were treated with coded way. Then you may need a centralized interface for centralized configuration menu. We developed Application Reference menu interface, as shown in FIG.

Micro-channel integrated menu screen is defined

In the figure above, we can get the current incident response process has been defined through the menus and menu "Get menu" button, our definition of micro-channel conventional menus and personalized menus have been processed. Completely define each menu processing micro message according to standards. For "button other parameters" in the right side of interface settings, for different types of treatment were carried out. For the Edit menu, simply click the "Update to Server" to complete the synchronization, very convenient.