微信程序开发系列教程(四)使用微信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的原创技术文章,请关注公众号"汪子熙"或者扫描下面二维码:

相关文章
|
6天前
|
编译器 定位技术 API
|
16天前
|
Kubernetes API Docker
k8s教程(pod篇)-容器获取pod信息(Downward API)
k8s教程(pod篇)-容器获取pod信息(Downward API)
14 0
|
16天前
|
消息中间件 NoSQL API
Flink教程(09)- Flink批流一体API(Connectors示例)
Flink教程(09)- Flink批流一体API(Connectors示例)
19 0
|
16天前
|
存储 算法 Java
Flink教程(14)- Flink高级API(容错机制)
Flink教程(14)- Flink高级API(容错机制)
12 0
|
16天前
|
API 流计算 知识图谱
Flink教程(15)- Flink高级API(并行度)
Flink教程(15)- Flink高级API(并行度)
19 0
|
16天前
|
API 数据安全/隐私保护 流计算
Flink教程(12)- Flink高级API(Time与Watermaker)
Flink教程(12)- Flink高级API(Time与Watermaker)
23 0
|
16天前
|
机器学习/深度学习 缓存 分布式计算
Flink教程(10)- Flink批流一体API(其它)
Flink教程(10)- Flink批流一体API(其它)
22 0
|
16天前
|
存储 消息中间件 应用服务中间件
Flink教程(13)- Flink高级API(状态管理)
Flink教程(13)- Flink高级API(状态管理)
36 0
|
16天前
|
API 流计算 知识图谱
Flink教程(11)- Flink高级API(Window)
Flink教程(11)- Flink高级API(Window)
24 0
|
16天前
|
关系型数据库 MySQL API
Flink教程(08)- Flink批流一体API(Sink示例)
Flink教程(08)- Flink批流一体API(Sink示例)
23 0
热门文章
最新文章
相关产品
云迁移中心
推荐文章
更多