资讯专栏INFORMATION COLUMN

【Node.js 微信公众号实战】3.Node.js 自定义微信菜单

Barry_Ng / 2591人阅读

摘要:一写在前面的话上一篇文章中,我们使用成功的实现了的获取存储以及更新,这篇文章我们来实现微信的自定义菜单功能。二自定义微信菜单微信文档步骤在开始码代码之前,我们依然是先理清实现的思路,再开始编写实现代码。

一、写在前面的话

  上一篇文章中,我们使用 Node.js 成功的实现了access_token 的获取、存储以及更新,这篇文章我们来实现微信的自定义菜单功能。

二、自定义微信菜单

1.微信文档步骤
  在开始码代码之前,我们依然是先理清实现的思路,再开始编写实现代码。打开 微信帮助文档 ,点击左侧菜单中的 自定义菜单,点击其子菜单 自定义菜单创建接口,如图:

  由上图我们总结以下步骤:

自定义微信请求是以 https POST请求方式

数据是以 JSON 格式传入

2.实现 https POST请求

  紧接着上一篇文章的代码,源码地址: https://github.com/SilenceHVK... ,克隆到本地文件中

git clone git@github.com:SilenceHVK/wechatByNode.git

  打开 wechat 文件夹中的 wechat.js 文件,并在 WeChat 构造函数内部添加 requestPost 方法

//用于处理 https Post请求方法
    this.requestPost = function(url,data){
        return new Promise(function(resolve,reject){
            //解析 url 地址
            var urlData = urltil.parse(url);
            //设置 https.request  options 传入的参数对象
            var options={
                //目标主机地址
                hostname: urlData.hostname, 
                //目标地址 
                path: urlData.path,
                //请求方法
                method: "POST",
                //头部协议
                headers: {
                    "Content-Type": "application/x-www-form-urlencoded",
                    "Content-Length": Buffer.byteLength(data,"utf-8")
                }
            };
            var req = https.request(options,function(res){
                var buffer = [],result = "";
                //用于监听 data 事件 接收数据
                res.on("data",function(data){
                    buffer.push(data);
                });
                 //用于监听 end 事件 完成数据的接收
                res.on("end",function(){
                    result = Buffer.concat(buffer).toString("utf-8");
                    resolve(result);
                })
            })
            //监听错误事件
            .on("error",function(err){
                console.log(err);
                reject(err);
            });
            //传入数据
            req.write(data);
            req.end();
        });
    }

  在上一篇文章中,我们使用到了 https 的 get 方法发。实际上 https 用于请求的底层方法则是 request 方法,而 get 方法 只是对它的一个封装,但是 Node.js 却没有对 post 进行封装,直到现在 Node.js 8.0 依然没有。具体详情请看 Node.js 中文文档。

提示:

   npm 提供了很多用于请求的工具包,比如 request ( 安装命令 npm install request ) 等。这里我只是用系统包去做请求处理。

3.配置创建微信菜单的连接
  打开 项目文件中的 config.json 文件,在 apiURL 中添加配置:

"createMenu":"%scgi-bin/menu/create?access_token=%s"

4.微信菜单 JSON 格式
  完成了上面的工作后,我们就可以开始微信菜单的创建了。按照微信帮助中菜单示例格式,我们自己定义一个 JSON 格式:

{
     "button":[
        {    
          "type":"view",
          "name":"hvkcoder",
           "url":"http://www.cnblogs.com/hvkcode/"
        },
        {    
          "type":"click",
          "name":"今日推荐",
          "key":"today_recommend"
        },
        {    
          "name":"小工具",
          "sub_button":[{
               "type": "scancode_waitmsg", 
               "name": "扫一扫",
               "key": "scancode"
          },{
               "type": "pic_sysphoto", 
               "name": "系统拍照发图",
                "key": "take_photo"
          },{
            "type": "location_select", 
            "name": "发送位置",
            "key": "send_location"
        }]
        }
     ]
}

并将它存放在 wechat 文件夹中的 menus.json 文件,如图:

5.请求创建菜单API
  将 menus.json 文件在 wechat.js 文件中引用。这块呢,我就直接在微信接入的方法中去做菜单的创建:

var that = this;
    this.getAccessToken().then(function(data){
        //格式化请求连接
        var url = util.format(that.apiURL.createMenu,that.apiDomain,data);
        //使用 Post 请求创建微信菜单
        that.requestPost(url,JSON.stringify(menus)).then(function(data){
            //将结果打印
            console.log(data);
        });
    });

  如果你目前用的是订阅号的话,那么不好意思朋友,你在运行结果就会看到:

  错误意思是:api未经授权。腾讯本着“没钱,玩你麻痹”的态度,指明订阅号的朋友是不能通过 api 请求去自定义菜单的。

  但是不要伤心,因为腾讯依然很贴心的为我们准备测试公众号,再次打开 微信帮助文档,点击右侧的 开始开发,点击其子菜单 接口测试号申请,如图:

  使用手机端微信,扫描二维码后,我们就得到了一个测试公众号。

  其他的信息我们都不需要去管,主要去修改 appID 和 appsecret,并将 access_token.json 所保存的数据更改为:

{"access_token":"","expires_time":0}

随后重新运行就可以了,是不是很简单呢。

  扫面一下测试公众号二维码

  每次只需要对 menus.json 文件进行更改,重新请求。就能够实现菜单的更改效果了。

  文章源代码:https://github.com/SilenceHVK... 。对文章有不正确之处,请给予纠正。github源代码请顺手给个 Star,最后感谢您的阅读。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92118.html

相关文章

  • Node.js 微信公众实战】4.Node.js 微信消息管理

    摘要:消息推送也是微信公众号开发更为有趣的功能,涉及到文本消息图片消息语音消息视频消息音乐消息以及图文消息。在文件中创建文件用于消息的管理。 一、写在前面的话   当用户发送消息给公众号时(或某些特定的用户操作引发的事件推送时),会产生一个POST请求,开发者可以在响应包(Get)中返回特定XML结构,来对该消息进行响应。   消息推送也是微信公众号开发更为有趣的功能,涉及到文本消息、图片消...

    lewinlee 评论0 收藏0
  • Node.js 微信公众实战】1.Node.js 接入微信公众平台开发

    摘要:打开中文网文档打开微信开发者文档三接入微信公众平台创建项目首先我们在电脑的任意磁盘上创建文件夹,命名随意,我这命名为随后在文件夹中创建两个文件一个是,另一个为。接入验证再次进入微信公众平台在左侧菜单点击基本配置,如图点击修改配置。 一、写在前面的话   Node.js是一个开放源代码、跨平台的JavaScript语言运行环境,采用Google开发的V8运行代码,使用事件驱动、非阻塞和异...

    winterdawn 评论0 收藏0
  • Node.js 微信公众实战】2.Node.js access_token的获取、存储及更新

    摘要:主要用于封装开发微信公众平台的所有方法。剩下的就是去微信公众平台接入验证了,在上一篇文章中有详细的教程,这里我就不再演示了三的获取存储及更新微信文档步骤在开始码代码之前,我们依然是先理清实现的思路,在开始编写实现代码。 一、写在前面的话   上一篇文章中,我们使用 Node.js 成功的实现了接入微信公众平台功能。在这篇文章中,我们将实现微信公众平台一个非常重要的参数 access_t...

    adam1q84 评论0 收藏0
  • 21点见 - Vue + Node + MySql 微信服务端微课平台企业级产品开发技术指南

    摘要:点见微信服务号端微课平台企业级产品开发技术指南开发环境技术栈前端后台管理系统后端采用框架特色技术微信公众号开发微信授权登陆微信支付自定义菜单模版消息配置与推送图片音频处理直播文字图片语言消息上传文字图片语言消息并发处理弹幕直播打赏定向提 21点见 - Vue + Node + MySql 微信服务号端微课平台企业级产品开发技术指南 开发环境技术栈 前端:vue.js + vue-ro...

    sushi 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<