详解nodejs微信公众号开发——6.自定义菜单


Posted in NodeJs onApril 13, 2017

上一篇文章:nodejs微信公众号开发——5.素材管理接口,我们实现了新增临时素材、管理永久素材的接口,这些接口的实现,使我们能够推送多样的消息给用户。本节介绍的内容是关于自定义菜单

1. 自定义菜单的介绍

自定义菜单能够帮助公众号丰富界面,让用户更好更快地理解公众号的功能。关于自定义菜单需要掌握以下几点内容:

  1. 自定义菜单最多包括3个一级菜单,每个一级菜单最多包含5个二级菜单。
  2. 一级菜单最多4个汉字,二级菜单最多7个汉字,多出来的部分将会以“...”代替。
  3. 创建自定义菜单后,由于微信客户端缓存,需要24小时微信客户端才会展现出来。测试时可以尝试取消关注公众账号后再次关注,则可以看到创建后的效果。

更多信息查看官方文档:自定义菜单创建接口

2. 创建自定义菜单

2.1 首先罗列以下操作的请求地址:

var api = {
  ...
  menu:{
    create:prefix+'/menu/create?', //access_token=ACCESS_TOKEN 创建菜单
    get:prefix+'/menu/get?', //access_token=ACCESS_TOKE 获取菜单,GET请求
    delete:prefix+'/menu/delete?', //access_token=ACCESS_TOKEN 删除菜单,GET请求
    getInfo:prefix+'get_current_selfmenu_info?' //access_token=ACCESS_TOKEN 获取自定义菜单配置接口
  }
}

2.2 定义createMenu函数

Wechat.prototype.createMenu = function(menu){
  var that = this;
  return new Promise(function(resolve,reject){
    that.fetchAccessToken().then(function(data){
      var url = api.menu.create + 'access_token=' + data.access_token;
      request({url:url,method:'POST',body:menu,json:true}).then(function(response){
        var _data = response.body;
        if(_data.errcode === '0'){
          resolve();
        }else{
          throw new Error('create menu failed!');
        }
      }).catch(function(err){
        reject(err);
      });
    });
  });
}

参数menu由外部业务层传入。为了方便管理,将自定义菜单的内容单独写在一个menu.js文件中:

/*
 * 配置自定义菜单
 */
'use strict'

module.exports = {
  'button':[
  {
    'name':'最新',
    'type':'click',
    'key':'menu_click'
  },
  {
    'name':'类别',
    'sub_button':[
      {
        'name':'科幻',
        'type':'view',
        'url':'music.163.com'
      },
      {
        'name':'悬疑',
        'type':'scancode_push',
        'key':'qr_scan'
      },
      {
        'name':'爱情',
        'type':'scancode_waitmsg',
        'key':'qr_scan_wait'
      },
      {
        'name':'教育',
        'type':'pic_photo_or_album',
        'key':'pic_photo_album'
      }
    ]
  },
  {
    'name':'地域',
    'sub_button':[
      {
        'name':'大陆',
        'type':'pic_weixin',
        'key':'pic_weixin'
      },
      {
        'name':'欧美',
        'type':'location_select',
        'key':'location_select'
      }
    ]
  }]
}

里面的类型暂时随意写的。我们在业务层weixin.js里面实现自定义菜单的使用:

wechatApi.deleteMenu().then(function(){
  return wechatApi.createMenu(menu);
}).then(function(msg){
  console.log(msg);
});

保险起见先把原有的菜单删了,重新建立自己新的菜单。

2.3 定义deleteMenu函数

Wechat.prototype.deleteMenu = function(){
  var that = this;
  return new Promise(function(resolve,reject){
    that.fetchAccessToken().then(function(data){
      var url = api.menu.delete + 'access_token=' + data.access_token;
      request({url:url,json:true}).then(function(response){
        var _data = response.body;
        if(_data.errcode === '0'){
          resolve();
        }else{
          throw new Error('delete menu failed!');
        }
      }).catch(function(err){
        reject(err);
      });
    });
  });
}

测试了一下,取关重新关注后微信测试号并没有立即呈现自定义菜单,要等一段时间,略坑。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

NodeJs 相关文章推荐
NodeJs基本语法和类型
Feb 13 NodeJs
nodejs URL模块操作URL相关方法介绍
Mar 03 NodeJs
nodejs中实现sleep功能实例
Mar 24 NodeJs
PHP和NodeJs开发的应用如何共用Session
Apr 16 NodeJs
nodejs基础知识
Feb 03 NodeJs
nodejs个人博客开发第七步 后台登陆
Apr 12 NodeJs
用Nodejs搭建服务器访问html、css、JS等静态资源文件
Apr 28 NodeJs
nodejs读取并去重excel文件
Apr 22 NodeJs
NodeJS如何实现同步的方法示例
Aug 24 NodeJs
nodejs高大上的部署方式(PM2)
Sep 11 NodeJs
详解webpack打包nodejs项目(前端代码)
Sep 19 NodeJs
Nodejs中获取当前函数被调用的行数及文件名详解
Dec 12 NodeJs
nodejs个人博客开发第七步 后台登陆
Apr 12 #NodeJs
nodejs个人博客开发第六步 数据分页
Apr 12 #NodeJs
nodejs个人博客开发第五步 分配数据
Apr 12 #NodeJs
nodejs个人博客开发第四步 数据模型
Apr 12 #NodeJs
nodejs个人博客开发第三步 载入页面
Apr 12 #NodeJs
nodejs个人博客开发第二步 入口文件
Apr 12 #NodeJs
nodejs个人博客开发第一步 准备工作
Apr 12 #NodeJs
You might like
PHP中两个float(浮点数)比较实例分析
2015/09/27 PHP
类似框架的js代码
2006/11/09 Javascript
setTimeout 不断吐食CPU的问题分析
2009/04/01 Javascript
javascript操作cookie_获取与修改代码
2009/05/21 Javascript
慎用 somefunction.prototype 分析
2009/06/02 Javascript
jquery tools之tabs 选项卡/页签
2009/07/25 Javascript
ie focus bug 解决方法
2009/09/03 Javascript
JS 文件大小判断的实现代码
2010/04/07 Javascript
JS Pro-深入面向对象的程序设计之继承的详解
2013/05/07 Javascript
jQuery制作仿腾讯web qq用户体验桌面
2013/08/20 Javascript
JS画5角星方法介绍
2013/09/17 Javascript
node.js中的fs.truncate方法使用说明
2014/12/15 Javascript
javascript实现实时输出当前的时间
2015/04/27 Javascript
javascript为按钮注册回车事件(设置默认按钮)的方法
2015/05/09 Javascript
Bootstrap入门教程一Hello Bootstrap初识
2017/03/02 Javascript
JavaScript实现二叉树的先序、中序及后序遍历方法详解
2017/10/26 Javascript
移动端H5页面返回并刷新页面(BFcache)的方法
2018/11/06 Javascript
Node.js API详解之 util模块用法实例分析
2020/05/09 Javascript
详解element-ui动态限定的日期范围选择器代码片段
2020/07/03 Javascript
解决await在forEach中不起作用的问题
2021/02/25 Javascript
Python 反转字符串(reverse)的方法小结
2018/02/20 Python
Python简单计算文件MD5值的方法示例
2018/04/11 Python
python读取csv文件并把文件放入一个list中的实例讲解
2018/04/27 Python
Python实现重建二叉树的三种方法详解
2018/06/23 Python
Python 复平面绘图实例
2019/11/21 Python
python requests.get带header
2020/05/05 Python
python 实现压缩和解压缩的示例
2020/09/22 Python
canvas 绘图时位置偏离的问题解决
2020/09/16 HTML / CSS
世界领先的以旅馆为主的在线预订平台:Hostelworld
2016/10/09 全球购物
倩碧澳大利亚官网:Clinique澳大利亚
2019/07/22 全球购物
生产部主管岗位职责
2014/01/06 职场文书
教师求职简历自我评价
2015/03/10 职场文书
婚礼迎宾词大全
2015/08/10 职场文书
浅析InnoDB索引结构
2021/04/05 MySQL
Django项目配置Memcached和Redis, 缓存选择哪个更有优势
2021/04/06 Python
Redis 常见使用场景
2021/08/30 Redis