微信公众号平台接口开发 菜单管理的实现


Posted in Javascript onAugust 14, 2019

官方菜单功能介绍

微信公众号平台接口开发 菜单管理的实现

微信公众号平台接口开发 菜单管理的实现

请求接口:https://api.weixin.qq.com/cgi-bin/menu/create?access_token=ACCESS_TOKEN

微信公众号平台接口开发 菜单管理的实现

微信公众号平台接口开发 菜单管理的实现

新增菜单管理类

public class MenuFirstLayerModel
  {
    public string name { get; set; }
    public List<MenuTwoLayerModel> sub_button { get; set; }
  }

  public class MenuTwoLayerModel
  {
    public string type { get; set; }
    public string name { get; set; }
    public string key { get; set; }
    public string url { get; set; }
  }

  public class WXMenu 
  {
    public List<MenuFirstLayerModel> button { get; set; }

    public string Create()
    {
      try
      {
        var requestUri = string.Format(@"https://api.weixin.qq.com/cgi-bin/menu/create?access_token={0}", WeCharBase.AccessToken);
        
        return WeCharBase.Post(requestUri, new StringContent(JsonConvert.SerializeObject(new
        {
          button = button
        })));
      }
      catch (Exception ex)
      {
        return ex.Message;
      }
    }
  }

新增控制器MenuController.cs

public ActionResult ViewMenu()
    {
      return View();
    }

    public ActionResult CreateMenu()
    {
      var wxMenu = new WXMenu()
      {
        button = new List<MenuFirstLayerModel>()
        {
          new MenuFirstLayerModel()
          {
             name="扫码",
             sub_button = new List<MenuTwoLayerModel>()
             {
              new MenuTwoLayerModel()
              {
                type = "scancode_waitmsg",
                name = "扫码带提示", 
                key = "rselfmenu_0_0"
              },
              new MenuTwoLayerModel()
              {
                type = "scancode_push",
                name = "扫码推事件", 
                key = "rselfmenu_0_1"
              }
             },
          },
          new MenuFirstLayerModel()
          {
             name = "发图",
             sub_button = new List<MenuTwoLayerModel>()
             {
              new MenuTwoLayerModel()
              {
                type = "pic_sysphoto",
                name = "系统拍照发图", 
                key = "rselfmenu_1_0"
              },
              new MenuTwoLayerModel()
              {
                type = "pic_photo_or_album",
                name = "拍照或者相册发图", 
                key = "rselfmenu_1_1"
              },
              new MenuTwoLayerModel()
              {
                type = "pic_weixin",
                name = "微信相册发图", 
                key = "rselfmenu_1_2"
              }
             }
          },
          new MenuFirstLayerModel()
          {
            name = "其他",
            sub_button = new List<MenuTwoLayerModel>()
            {
              new MenuTwoLayerModel()
              {
                type = "location_select",
                name = "发送位置", 
                key = "rselfmenu_2_0"
              },
              new MenuTwoLayerModel()
              {
                type = "click",
                name = "今日歌曲", 
                key = "V1001_TODAY_MUSIC"
              },
              new MenuTwoLayerModel()
              {
                type = "view",
                name = "百度", 
                url = "http://www.baidu.com"
              }
            }
          }
        }
      };

      return Content(wxMenu.Create());
    }

新增视图ViewMenu.cshtml

<script type="text/javascript" language="javascript">
  $(document).ready(function () {
    $("#btnCreate").click(function () {
      $.ajax({
        type: "POST",
        url: "/Menu/CreateMenu",
        data: { id: $("#textContent").val() },
        success: function (responseTest) {
          $("#resultMesage").text(responseTest);
        }
      });
    });
  });
</script>

<table>
  <tr>
    <td>
      <div class="title">菜单创建</div>
      <textarea id="textContent" name="textContent" rows="20" cols="100">
        button = new[]
        {
          new
          {
            name="扫码",
            sub_button = new[]
            {
              new
              {
                type = "scancode_waitmsg",
                name = "扫码带提示",
                key = "rselfmenu_0_0"
              },
              new
              {
                type = "scancode_push",
                name = "扫码推事件",
                key = "rselfmenu_0_1"
              }
            }
          },
          new
          {
            name = "发图",
            sub_button = new[]
            {
              new
              {
                type = "pic_sysphoto",
                name = "系统拍照发图",
                key = "rselfmenu_1_0"
              },
              new
              {
                type = "pic_photo_or_album",
                name = "拍照或者相册发图",
                key = "rselfmenu_1_1"
              },
              new
              {
                type = "pic_weixin",
                name = "微信相册发图",
                key = "rselfmenu_1_2"
              }
            }
          },
          new
          {
            name = "其他",
            sub_button = new[]
            {
              new
              {
                type = "location_select",
                name = "发送位置",
                key = "rselfmenu_2_0"
              },
              new
              {
                type = "click",
                name = "今日歌曲",
                key = "V1001_TODAY_MUSIC"
              },
              new
              {
                type = "view",
                name = "百度",
                url = "http://www.baidu.com"
              }
            }
          }
        }

      </textarea>
    </td>
    <td><input class="btncss" id="btnCreate" type="button" value=" 创建 " /></td>
    <td id="resultMesage" class="resultMesage"></td>
  </tr>
</table>

有效代码写完了,看看效果

微信公众号平台接口开发 菜单管理的实现

微信公众号平台接口开发 菜单管理的实现

成功了哦。

Javascript 相关文章推荐
javascript中的对象和数组的应用技巧
Jan 07 Javascript
js原型继承的两种方法对比介绍
Mar 30 Javascript
jQuery中triggerHandler()方法用法实例
Jan 19 Javascript
js鼠标点击图片切换效果代码分享
Aug 26 Javascript
javascript实现图片延迟加载方法汇总(三种方法)
Aug 27 Javascript
JavaScript中闭包的写法和作用详解
Jun 29 Javascript
浅析如何利用JavaScript进行语音识别
Oct 27 Javascript
JS中绑定事件顺序(事件冒泡与事件捕获区别)
Jan 24 Javascript
JS实现获取word文档内容并输出显示到html页面示例
Jun 23 Javascript
jQuery实现条件搜索查询、实时取值及升降序排序的方法分析
May 04 jQuery
node实现简单的增删改查接口实例代码
Aug 22 Javascript
Vue 用Vant实现时间选择器的示例代码
Oct 25 Javascript
vue.js中ref和$refs的使用及示例讲解
Aug 14 #Javascript
微信公众号平台接口开发 获取微信服务器IP地址方法解析
Aug 14 #Javascript
vue filter 完美时间日期格式的代码
Aug 14 #Javascript
如何对react hooks进行单元测试的方法
Aug 14 #Javascript
vue 中 命名视图的用法实例详解
Aug 14 #Javascript
详解vue 命名视图
Aug 14 #Javascript
浅谈JS中this在各个场景下的指向
Aug 14 #Javascript
You might like
为什么夜间收到的中波电台比白天多
2021/03/01 无线电
php access 数据连接与读取保存编辑数据的实现代码
2010/05/12 PHP
6种php上传图片重命名的方法实例
2013/11/04 PHP
再谈javascript 动态添加样式规则 W3C校检
2009/12/25 Javascript
JavaScript学习笔记(十七)js 优化
2010/02/04 Javascript
Javascript合并表格中具有相同内容单元格示例
2013/08/11 Javascript
jQuery实现弹出窗口中切换登录与注册表单
2015/06/05 Javascript
jQuery左侧大图右侧小图焦点图幻灯切换代码分享
2015/08/19 Javascript
AngularJs html compiler详解及示例代码
2016/09/01 Javascript
js通过classname来获取元素的方法
2016/11/24 Javascript
如何使用bootstrap框架 bootstrap入门必看!
2017/04/13 Javascript
Vuex之理解Mutations的用法实例
2017/04/19 Javascript
用原生JS实现简单的多选框功能
2017/06/12 Javascript
angular框架实现全选与单选chekbox的自定义
2017/07/06 Javascript
Vue.js2.0中的变化小结
2017/10/24 Javascript
angular6的table组件开发的实现示例
2018/12/26 Javascript
JavaScript遍历查找数组中最大值与最小值的方法示例
2019/05/24 Javascript
React-redux实现小案例(todolist)的过程
2019/09/29 Javascript
electron 安装,调试,打包的具体使用
2019/11/06 Javascript
Vue中常用rules校验规则(实例代码)
2019/11/14 Javascript
Vue+ElementUI 中级联选择器Bug问题的解决
2020/07/31 Javascript
python使用nntp读取新闻组内容的方法
2015/05/08 Python
Python迭代器与生成器基本用法分析
2018/07/26 Python
pyqt5 禁止窗口最大化和禁止窗口拉伸的方法
2019/06/18 Python
Python 实现打印单词的菱形字符图案
2020/04/12 Python
美国祛痘、抗衰老药妆品牌:Murad
2016/08/27 全球购物
日本最大美瞳直送网:Morecontact(中文)
2019/04/03 全球购物
你懂得怎么写自荐信吗?
2013/12/27 职场文书
违反学校规定检讨书
2014/01/18 职场文书
运动会广播稿200米
2014/01/27 职场文书
党风廉设责任书
2014/04/16 职场文书
房屋租房协议书范本
2014/12/04 职场文书
2014年医院个人工作总结
2014/12/09 职场文书
开学随笔
2015/08/15 职场文书
中考百日冲刺决心书
2015/09/22 职场文书
Jupyter notebook 输出部分显示不全的解决方案
2021/04/24 Python