使用微信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"){ // 响应微信自定义二级菜单的点击 } } } );

Java Web项目，Android和微信小程序的初始页面配置

Java Web项目

我们在Eclipse里开了Java Web项目之后，Run As Tomcat或者Apache服务器，本地运行，如果直接用http://localhost:8080访问项目，会发现浏览器会打开一个默认的页面。

这个页面是在什么地方配置的呢？

每个Java Web工程的目录下面，都有一个名为WEB-INF的目录，里面包含一个配置文件web.xml。Web项目的默认页面就定义在里面的welcome-file-list节点里。

Android项目

我们知道一个Android项目里可以定义不同的Activity，那么Android应用启动后看到的初始页面对应的Activity，定义在Android项目的AndroidManifest.xml配置文件里，属性为android：name。看下面的例子：

package="com.jerry.android4" android:versionCode="1" android:versionName="1.0" > android:minSdkVersion="8" android:targetSdkVersion="19" /> android:allowBackup="true" android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:theme="@style/AppTheme" > android:name="com.jerry.android4.MainActivity" android:label="@string/app_name" >

意思是这个Android应用默认启动的activity是com.jerry.android4.MainActivity。

微信小程序

我的微信小程序里有很多视图，我调试时发现，我的app.js的钩子函数onLaunch的输入参数，被微信框架填充为userLogin这个视图。然而微信框架根据什么逻辑判断出userLogin是微信小程序的初始页面呢？

起初我以为是在微信小程序的app.json或者project.config.json文件里配置初始页面，像前面介绍的Java Web工程的web.xml和Android的AndroidManifest.xml一样。后来发现没有这样的配置，微信框架会将app.json文件里pages属性下面的第一条页面作为初始化页面。

要验证这个结论很简单，我们做个测试，把appointments和userLogin这两个视图的顺序在app.json里调换一下。发现调换之后，确实是当前处在app.json里的appointments视图作为初始页面了。

要获取更多Jerry的原创技术文章，请关注公众号"汪子熙"。

API Java javaScript 架构设计

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。