[039] 微信公众帐号开发教程第15篇-自定义菜单的view类型（访问网页）

2023-10-20 16:43:34

引言及内容概要

距离写上一篇文章《自定义菜单的创建及菜单事件响应》整整过了两个月的时间，那时公众平台还没有开放view类型的菜单。在不久前，微信公众平台悄悄开放了view类型的菜单，却没有在首页发布任何通知，貌似微信团队很喜欢这么干。一个偶然的机会，我留意到API文档的自定义菜单接口发生了变化，增加了对菜单view类型的说明：

view（访问网页）：

 用户点击view类型按钮后，会直接跳转到开发者指定的url中。

于是我在第一时间更新了小q机器人（微信号：xiaoqrobot）的菜单，在一级菜单“更多”下增加了二级菜单“使用帮助”，点击该菜单项会直接跳转到网页，如下图所示。

[039] 微信公众帐号开发教程第15篇-自定义菜单的view类型（访问网页）

最近也有不少网友问起这种类型的菜单是如何创建的，本篇文章就为大家介绍下view类型的自定义菜单该如何创建。

 

自定义菜单的两种类型（click和view）

公众平台API文档中给出了自定义菜单的json结构示例，我从中截取两个菜单项的json代码，一个是click类型，另一个是view类型，如下所示。

 

[html] view plaincopy
 
  1. {     
  2.     "type":"click",  
  3.     "name":"今日歌曲",  
  4.     "key":"V1001_TODAY_MUSIC"  
  5. },  
  6. {  
  7.     "type":"view",  
  8.     "name":"歌手简介",  
  9.     "url":"http://www.qq.com/"  
  10. }  

从上面可以看出，两种类型的菜单除了type值不同之外，属性也有差别。click类型的菜单有key属性，而view类型的菜单没有key属性，与之对应的是url属性。通过上一篇的学习我们知道，key值是用于判断用户点击了哪个click类型的菜单项。而view类型的菜单没有key属性，目前无法在公众账号后台判断是否有用户点击了view类型的菜单项，也就没办法知道哪个用户点击了view类型的菜单项。

 

 

建立view类型的菜单对象

View类型的菜单有3个属性：type、name和url。在上一篇文章中，我们创建了菜单项的基类Button，Button类只有一个属性name。View类型的菜单对象也需要继承Button类，代码如下：

 

[java] view plaincopy
 
  1. package org.liufeng.weixin.pojo;  
  2.   
  3. /** 
  4.  * view类型的菜单 
  5.  *  
  6.  * @author liuyq 
  7.  * @date 2013-04-10 
  8.  */  
  9. public class ViewButton extends Button {  
  10.     private String type;  
  11.     private String url;  
  12.   
  13.     public String getType() {  
  14.         return type;  
  15.     }  
  16.   
  17.     public void setType(String type) {  
  18.         this.type = type;  
  19.     }  
  20.   
  21.     public String getUrl() {  
  22.         return url;  
  23.     }  
  24.   
  25.     public void setUrl(String url) {  
  26.         this.url = url;  
  27.     }  
  28. }  

 

 

创建带view类型的菜单示例

我们对前一篇文章中给出的菜单创建代码进行调整，增加view类型的菜单项，完整的菜单创建代码如下：

 

[java] view plaincopy
 
  1. package org.liufeng.weixin.main;  
  2.   
  3. import org.liufeng.weixin.pojo.AccessToken;  
  4. import org.liufeng.weixin.pojo.Button;  
  5. import org.liufeng.weixin.pojo.CommonButton;  
  6. import org.liufeng.weixin.pojo.ComplexButton;  
  7. import org.liufeng.weixin.pojo.Menu;  
  8. import org.liufeng.weixin.pojo.ViewButton;  
  9. import org.liufeng.weixin.util.WeixinUtil;  
  10. import org.slf4j.Logger;  
  11. import org.slf4j.LoggerFactory;  
  12.   
  13. /** 
  14.  * 菜单管理器类 
  15.  *  
  16.  * @author liufeng 
  17.  * @date 2013-08-08 
  18.  */  
  19. public class MenuManager {  
  20.     private static Logger log = LoggerFactory.getLogger(MenuManager.class);  
  21.   
  22.     public static void main(String[] args) {  
  23.         // 第三方用户唯一凭证  
  24.         String appId = "000000000000000000";  
  25.         // 第三方用户唯一凭证密钥  
  26.         String appSecret = "00000000000000000000000000000000";  
  27.   
  28.         // 调用接口获取access_token  
  29.         AccessToken at = WeixinUtil.getAccessToken(appId, appSecret);  
  30.   
  31.         if (null != at) {  
  32.             // 调用接口创建菜单  
  33.             int result = WeixinUtil.createMenu(getMenu(), at.getToken());  
  34.   
  35.             // 判断菜单创建结果  
  36.             if (0 == result)  
  37.                 log.info("菜单创建成功！");  
  38.             else  
  39.                 log.info("菜单创建失败，错误码：" + result);  
  40.         }  
  41.     }  
  42.   
  43.     /** 
  44.      * 组装菜单数据 
  45.      *  
  46.      * @return 
  47.      */  
  48.     private static Menu getMenu() {  
  49.         CommonButton btn11 = new CommonButton();  
  50.         btn11.setName("天气预报");  
  51.         btn11.setType("click");  
  52.         btn11.setKey("11");  
  53.   
  54.         CommonButton btn12 = new CommonButton();  
  55.         btn12.setName("公交查询");  
  56.         btn12.setType("click");  
  57.         btn12.setKey("12");  
  58.   
  59.         CommonButton btn13 = new CommonButton();  
  60.         btn13.setName("周边搜索");  
  61.         btn13.setType("click");  
  62.         btn13.setKey("13");  
  63.   
  64.         CommonButton btn14 = new CommonButton();  
  65.         btn14.setName("历史上的今天");  
  66.         btn14.setType("click");  
  67.         btn14.setKey("14");  
  68.           
  69.         CommonButton btn15 = new CommonButton();  
  70.         btn15.setName("电影排行榜");  
  71.         btn15.setType("click");  
  72.         btn15.setKey("32");  
  73.   
  74.         CommonButton btn21 = new CommonButton();  
  75.         btn21.setName("歌曲点播");  
  76.         btn21.setType("click");  
  77.         btn21.setKey("21");  
  78.   
  79.         CommonButton btn22 = new CommonButton();  
  80.         btn22.setName("经典游戏");  
  81.         btn22.setType("click");  
  82.         btn22.setKey("22");  
  83.   
  84.         CommonButton btn23 = new CommonButton();  
  85.         btn23.setName("美女电台");  
  86.         btn23.setType("click");  
  87.         btn23.setKey("23");  
  88.   
  89.         CommonButton btn24 = new CommonButton();  
  90.         btn24.setName("人脸识别");  
  91.         btn24.setType("click");  
  92.         btn24.setKey("24");  
  93.   
  94.         CommonButton btn25 = new CommonButton();  
  95.         btn25.setName("聊天唠嗑");  
  96.         btn25.setType("click");  
  97.         btn25.setKey("25");  
  98.   
  99.         CommonButton btn31 = new CommonButton();  
  100.         btn31.setName("Q友圈");  
  101.         btn31.setType("click");  
  102.         btn31.setKey("31");  
  103.   
  104.         CommonButton btn33 = new CommonButton();  
  105.         btn33.setName("幽默笑话");  
  106.         btn33.setType("click");  
  107.         btn33.setKey("33");  
  108.           
  109.         CommonButton btn34 = new CommonButton();  
  110.         btn34.setName("用户反馈");  
  111.         btn34.setType("click");  
  112.         btn34.setKey("34");  
  113.           
  114.         CommonButton btn35 = new CommonButton();  
  115.         btn35.setName("关于我们");  
  116.         btn35.setType("click");  
  117.         btn35.setKey("35");  
  118.           
  119.         ViewButton btn32 = new ViewButton();  
  120.         btn32.setName("使用帮助");  
  121.         btn32.setType("view");  
  122.         btn32.setUrl("http://liufeng.gotoip2.com/xiaoqrobot/help.jsp");  
  123.   
  124.         ComplexButton mainBtn1 = new ComplexButton();  
  125.         mainBtn1.setName("生活助手");  
  126.         mainBtn1.setSub_button(new Button[] { btn11, btn12, btn13, btn14, btn15 });  
  127.   
  128.         ComplexButton mainBtn2 = new ComplexButton();  
  129.         mainBtn2.setName("休闲驿站");  
  130.         mainBtn2.setSub_button(new Button[] { btn21, btn22, btn23, btn24, btn25 });  
  131.   
  132.         ComplexButton mainBtn3 = new ComplexButton();  
  133.         mainBtn3.setName("更多");  
  134.         mainBtn3.setSub_button(new Button[] { btn31, btn33, btn34, btn35, btn32 });  
  135.   
  136.         /** 
  137.          * 这是公众号xiaoqrobot目前的菜单结构，每个一级菜单都有二级菜单项<br> 
  138.          *  
  139.          * 在某个一级菜单下没有二级菜单的情况，menu该如何定义呢？<br> 
  140.          * 比如，第三个一级菜单项不是“更多体验”，而直接是“幽默笑话”，那么menu应该这样定义：<br> 
  141.          * menu.setButton(new Button[] { mainBtn1, mainBtn2, btn33 }); 
  142.          */  
  143.         Menu menu = new Menu();  
  144.         menu.setButton(new Button[] { mainBtn1, mainBtn2, mainBtn3 });  
  145.   
  146.         return menu;  
  147.     }  
  148. }  

119~122行代码就是用于创建view类型菜单项的。上面的菜单结构也是小q机器人（微信号：xiaoqrobot）目前在使用的，读者可以对照着理解。

补充：居然还有些网友问我上面的自定义菜单创建代码在哪里调用，问我为什么不把调用的代码也公开？搞的我都有点不好意思了。上面的菜单创建代码是写在main方法中，直接在开发工具中运行一下就可以了，这应该是最最基础的Java知识了。另外，菜单只要创建一次，会一直存在的，不需要每次启动应用程序都去创建菜单。当然，你也可以把菜单的创建代码集成到项目中，并非一定要放在main方法中。程序是死的，人是活的，解决方法往往有很多种，怎么方便实用就怎么来！

 

 

如果觉得文章对你有所帮助，请通过留言或关注微信公众帐号xiaoqrobot来支持柳峰！

[039] 微信公众帐号开发教程第15篇-自定义菜单的view类型（访问网页）

上一篇：[037] 微信公众帐号开发教程第13篇-图文消息全攻略


下一篇：微信公众平台开发（一） 配置接口