• <bdo id="g6euu"><blockquote id="g6euu"></blockquote></bdo>
    <bdo id="g6euu"><samp id="g6euu"></samp></bdo>
  • 首页 > 建站资源 > 微信营销 > 微信开发教程:自定义菜单扫一扫、发图片、发地理位置

    微信开发教程:自定义菜单扫一扫、发图片、发地理位置

    时间:2014-10-08    来源:方倍工作室

    自定义菜单能够帮助公众号丰富界面,让用户更好更快地理解公众号的重要功能。微信增加了点击菜单后调起扫一扫(支持二维码/一维码)、发图片、发地理位置的能力,需开发实现。原有自定义菜单开发权限的公众号,均可获得以上能力。

    在这篇微信公众?#25945;?#24320;发教程中,我们将介绍如何在自定义菜单上开发扫一扫、发图片、发地理位置等功能。原有点击和跳转事件的开发,请参考微信公众?#25945;?#24320;发(58)自定义菜单

    本文分为以下二个部分:

    1. 扫一扫、发图片、发地理位置介绍
    2. 生成扫一扫、发图片、发地理位置功能菜单
    3. 开发扫一扫、发图片、发地理位置响应程序
    4. 使用场景
    一、菜单介绍

    1. 扫码推送事件 scancode_push
    用户点击按钮后,微信客户端将调起扫一扫工具,完成扫码操作后显示扫描结果(如果是URL,将进入URL),?#19968;?#23558;扫码的结果传给开发者,开发者可以下发消息。

    2. 扫码推送事件,且弹出“消息接收中”提示框 scancode_waitmsg
    用户点击按钮后,微信客户端将调起扫一扫工具,完成扫码操作后,将扫码的结果传给开发者,同时收起扫一扫工具,然后弹出“消息接收中”提示框,随后可能会收到开发者下发的消息。

    3. 弹出系统拍照发图 pic_sysphoto
    用户点击按钮后,微信客户端将调起系统相机,完成拍照操作后,将拍摄的相片发送给开发者,并推送事件给开发者,同时收起系统相机,随后可能会收到开发者下发的消息。

    4. 弹出拍照或者相册发图 pic_photo_or_album
    用户点击按钮后,微信客户端将弹出选择器供用户选择“拍照”或者“从手机相册选择”。用户选择后即走其他两种流程。

    5. 弹出微信相册发图器 pic_weixin
    用户点击按钮后,微信客户端将调起微信相册,完成选择操作后,将选择的相片发送给开发者的服务器,并推送事件给开发者,同时收起相册,随后可能会收到开发者下发的消息。

    6. 弹出地理位置选择器 location_select
    用户点击按钮后,微信客户端将调起地理位置选择工具,完成选择操作后,将选择的地理位置发送给开发者的服务器,同时收起位置选择工具,随后可能会收到开发者下发的消息。

    以上新增能力,均仅支持微信iPhone5.4.1以上版本,和Android5.4以上版本的微信用户,旧版本微信用户点击后将没有回应,开发者也不能正常接收到事件推送。

    接口调用请求?#24471;?/strong>

    http请求方式:POST(请使用https协议)

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

     按钮请求示例如下

    {
        "button": [
            {
                "name": "扫码", 
                "sub_button": [
                    {
                        "type": "scancode_waitmsg", 
                        "name": "扫码带提示", 
                        "key": "rselfmenu_0_0", 
                        "sub_button": [ ]
                    }, 
                    {
                        "type": "scancode_push", 
                        "name": "扫码推事件", 
                        "key": "rselfmenu_0_1", 
                        "sub_button": [ ]
                    }
                ]
            }, 
            {
                "name": "发图", 
                "sub_button": [
                    {
                        "type": "pic_sysphoto", 
                        "name": "系统拍照发图", 
                        "key": "rselfmenu_1_0", 
                       "sub_button": [ ]
                     }, 
                    {
                        "type": "pic_photo_or_album", 
                        "name": "拍照或者相册发图", 
                        "key": "rselfmenu_1_1", 
                        "sub_button": [ ]
                    }, 
                    {
                        "type": "pic_weixin", 
                        "name": "微信相册发图", 
                        "key": "rselfmenu_1_2", 
                        "sub_button": [ ]
                    }
                ]
            }, 
            {
                "name": "发送位置", 
                "type": "location_select", 
                "key": "rselfmenu_2_0"
            }
        ]
    }

    参数?#24471;?/strong>

    参数是否必须?#24471;?/th>
    button 一级菜单数组,个数应为1~3个
    sub_button 二级菜单数组,个数应为1~5个
    type 菜单的响应动作类型
    name 菜单标题,不超过16个字节,子菜单不超过40个字节
    key click等点击类型必须 菜单KEY值,用于消息接口推送,不超过128字节
    url view类型必须 网页链接,用户点击菜单可打开链接,不超过256字节

    二、生成菜单

    菜单具体的生成方法,与之前是一样的,先生成access token,再将菜单post内容提交给微信服务器,具体代码及方法可以参考 微信公众?#25945;?#24320;发(58)自定义菜单

    生成后的效果如下如示:

     

    三、响应菜单点击

    响应菜单点击,则需要在接口文件中添加新的EventKey事件的响应,并回复相应的内容。

    相关代码如下

     1     //接收事件消息
     2     private function receiveEvent($object)
     3     {
     4         $content = "";
     5         switch ($object->Event)
     6         {
     7             case "subscribe":
     8                 $content = "欢迎关注方倍工作室 ";
     9                 $content .= (!empty($object->EventKey))?("\n来自二维码场景 ".str_replace("qrscene_","",$object->EventKey)):"";
    10                 break;
    11             case "unsubscribe":
    12                 $content = "取消关注";
    13                 break;
    14             case "CLICK":
    15                 switch ($object->EventKey)
    16                 {
    17                     case "COMPANY":
    18                         $content = array();
    19                         $content[] = array("Title"=>"方倍工作室", "Description"=>"", "PicUrl"=>"http://discuz.comli.com/weixin/weather/icon/cartoon.jpg", "Url" =>"http://m.cnblogs.com/?u=txw1958");
    20                         break;
    21                     default:
    22                         $content = "点击菜单:".$object->EventKey;
    23                         break;
    24                 }
    25                 break;
    26             case "VIEW":
    27                 $content = "跳转链接 ".$object->EventKey;
    28                 break;
    29             case "SCAN":
    30                 $content = "扫描场景 ".$object->EventKey;
    31                 break;
    32             case "LOCATION":
    33                 $content = "上传位置?#20309;?#24230; ".$object->Latitude.";经度 ".$object->Longitude;
    34                 break;
    35             case "scancode_waitmsg":
    36                 $content = "扫码带提示:类型 ".$object->ScanCodeInfo->ScanType." 结果:".$object->ScanCodeInfo->ScanResult;
    37                 break;
    38             case "scancode_push":
    39                 $content = "扫码推事件";
    40                 break;
    41             case "pic_sysphoto":
    42                 $content = "系统拍照";
    43                 break;
    44             case "pic_weixin":
    45                 $content = "相册发图:数量 ".$object->SendPicsInfo->Count;
    46                 break;
    47             case "pic_photo_or_album":
    48                 $content = "拍照或者相册:数量 ".$object->SendPicsInfo->Count;
    49                 break;
    50             case "location_select":
    51                 $content = "发送位置:标签 ".$object->SendLocationInfo->Label;
    52                 break;
    53             default:
    54                 $content = "receive a new event: ".$object->Event." \n技术支持 方倍工作室";
    55                 break;
    56         }
    57 
    58         if(is_array($content)){
    59             if (isset($content[0]['PicUrl'])){
    60                 $result = $this->transmitNews($object, $content);
    61             }else if (isset($content['MusicUrl'])){
    62                 $result = $this->transmitMusic($object, $content);
    63             }
    64         }else{
    65             $result = $this->transmitText($object, $content);
    66         }
    67         return $result;
    68     }

     各项类型推送给后台的xml详解如下

    scancode_waitmsg,回应该事件给用户,用户可收到消息

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075435</CreateTime>
        <MsgType><![CDATA[event]]></MsgType>
        <Event><![CDATA[scancode_waitmsg]]></Event>
        <EventKey><![CDATA[rselfmenu_0_0]]></EventKey>
        <ScanCodeInfo>
            <ScanType><![CDATA[qrcode]]></ScanType>
            <ScanResult><![CDATA[http://weixin.qq.com/r/pUNnf4HEX9wgrcUc9xa3]]></ScanResult>
            <EventKey><![CDATA[rselfmenu_0_0]]></EventKey>
        </ScanCodeInfo>
    </xml>

    scancode_push,回应该事件给用户,用户不能收到消息

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075451</CreateTime>
        <MsgType><![CDATA[event]]></MsgType>
        <Event><![CDATA[scancode_push]]></Event>
        <EventKey><![CDATA[rselfmenu_0_1]]></EventKey>
        <ScanCodeInfo>
            <ScanType><![CDATA[qrcode]]></ScanType>
            <ScanResult><![CDATA[http://weixin.qq.com/r/pUNnf4HEX9wgrcUc9xa3]]></ScanResult>
            <EventKey><![CDATA[rselfmenu_0_1]]></EventKey>
        </ScanCodeInfo>
    </xml>

    pic_weixin ,下面是一次推送3张相片时的数据

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075552</CreateTime>
        <MsgType><![CDATA[event]]></MsgType>
        <Event><![CDATA[pic_weixin]]></Event>
        <EventKey><![CDATA[rselfmenu_1_2]]></EventKey>
        <SendPicsInfo>
            <Count>3</Count>
            <PicList>
                <item>
                    <PicMd5Sum><![CDATA[a6ab74b73a298f49f6fc66f41f88d3c7]]></PicMd5Sum>
                </item>
                <item>
                    <PicMd5Sum><![CDATA[5b9aea2b3683c5c21aaf3629739cafd9]]></PicMd5Sum>
                </item>
                <item>
                    <PicMd5Sum><![CDATA[2325ff3f39705ac987d3e0660906791d]]></PicMd5Sum>
                </item>
            </PicList>
            <EventKey><![CDATA[rselfmenu_1_2]]></EventKey>
        </SendPicsInfo>
    </xml>

    回应上述消息,用户收不到,但微信会继续推送3个图片消息给接口

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075562</CreateTime>
        <MsgType><![CDATA[image]]></MsgType>
        <PicUrl><![CDATA[http://mmbiz.qpic.cn/mmbiz/qOTIrRtMKFxZQo3cQ6vYxmfteo0fw2Y00MuuFS6OjlNvTkx0nBQJibjjafQMf4dCtJwyMeP5e3SQCuJpcoJdb8Q/0]]></PicUrl>
        <MsgId>6064818358471506877</MsgId>
        <MediaId><![CDATA[AM8Gbiu7S2vTIMS2l9zNCWiMCpeM8wccmKdFxmstHiuAybCbB-08dTQJN40cCIBD]]></MediaId>
    </xml>
    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075564</CreateTime>
        <MsgType><![CDATA[image]]></MsgType>
        <PicUrl><![CDATA[http://mmbiz.qpic.cn/mmbiz/qOTIrRtMKFxZQo3cQ6vYxmfteo0fw2Y0ellMniarWto4zL0pWKhr6a0FSARDeXprSgd0JmgU0YQo2iagGsYc1iaLA/0]]></PicUrl>
        <MsgId>6064818367061441471</MsgId>
        <MediaId><![CDATA[2CJKZ2mft-5hWEkVcVmnKwyvp3y59Uzv7YdpBsnGIyTlkMNb0ytU4oimTgimBGyP]]></MediaId>
    </xml>
    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075567</CreateTime>
        <MsgType><![CDATA[image]]></MsgType>
        <PicUrl><![CDATA[http://mmbiz.qpic.cn/mmbiz/qOTIrRtMKFxZQo3cQ6vYxmfteo0fw2Y0mwQoENttnmYAz0VTicY3xkO0lhn9mE5r3FB4cF04kia50riajcjY1qvzA/0]]></PicUrl>
        <MsgId>6064818379946343361</MsgId>
        <MediaId><![CDATA[VICm1-y8w_MmdpcLYWP0u12HVXrWdhm3c3tdq1PTsbiFFgH6YOcmmIEbZ27z-Qcl]]></MediaId>
    </xml>

    上述多个图片消息,后台收到都能进行单独回应,用户可以收到响应消息。

    pic_photo_or_album,方式和pic_weixin 一样,先推送菜单事件,再推送图片消息

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075614</CreateTime>
        <MsgType><![CDATA[event]]></MsgType>
        <Event><![CDATA[pic_photo_or_album]]></Event>
        <EventKey><![CDATA[rselfmenu_1_1]]></EventKey>
        <SendPicsInfo>
            <Count>1</Count>
            <PicList>
                <item>
                    <PicMd5Sum><![CDATA[58f4989164b2a432889e64fa81632152]]></PicMd5Sum>
                </item>
            </PicList>
            <EventKey><![CDATA[rselfmenu_1_1]]></EventKey>
        </SendPicsInfo>
    </xml>
    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075618</CreateTime>
        <MsgType><![CDATA[image]]></MsgType>
        <PicUrl><![CDATA[http://mmbiz.qpic.cn/mmbiz/qOTIrRtMKFxZQo3cQ6vYxmfteo0fw2Y0fwSdF54rribCj9zqDG0wVDsiasKuUC8gskbuZmX43a1hs9esySIvmrqA/0]]></PicUrl>
        <MsgId>6064818598989675467</MsgId>
        <MediaId><![CDATA[Jh7Bsjaodmz-Dc_Hdz_wRzY3RiFxNvA4JHpUWRNRCIgps19ANsDFIOYOUV1dIVYV]]></MediaId>
    </xml>

     pic_sysphoto 这个后台其实收不到该菜单的消息,点击它后,调用的是手机里面的照相机功能,而照相以后再发过来时,就收到的是一个图片消息了

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412135923</CreateTime>
        <MsgType><![CDATA[image]]></MsgType>
        <PicUrl><![CDATA[http://mmbiz.qpic.cn/mmbiz/qOTIrRtMKFxGzYCchrNiczZ9aCd1fgCEWbicHGvmaz1d7VZOSMqoLB4RL69rK2Fos6fSM4FJRkLtiajpe32ibkicw1A/0]]></PicUrl>
        <MsgId>6065077606992462276</MsgId>
        <MediaId><![CDATA[PqRRUPLhMc27EG5F4cCtTozBsin7SY8kPRRuAF-CwPl5MzR5ewE5oji0FhGTDl6_]]></MediaId>
    </xml>

    location_select 将会调起发送位置功能,菜单的响应用户收不到,在用户发送位置之后,会再推送一个地理位置消息功能给用户

    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075681</CreateTime>
        <MsgType><![CDATA[event]]></MsgType>
        <Event><![CDATA[location_select]]></Event>
        <EventKey><![CDATA[rselfmenu_2_0]]></span>EventKey>
        <SendLocationInfo>
            <Location_X><![CDATA[22.538145]]></Location_X>
            <Location_Y><![CDATA[113.952298]]></Location_Y>
            <Scale><![CDATA[13]]></Scale>
            <Label><![CDATA[深圳市南山区高新南一道9号]]></Label>
            <Poiname><![CDATA[]]></Poiname>
            <EventKey><![CDATA[rselfmenu_2_0]]></EventKey>
        </SendLocationInfo>
    </xml>
    <xml>
        <ToUserName><![CDATA[gh_82479813ed64]]></ToUserName>
        <FromUserName><![CDATA[ojpX_jig-gyi3_Q9fHXQ4rdHniQs]]></FromUserName>
        <CreateTime>1412075681</CreateTime>
        <MsgType><![CDATA[location]]></MsgType>
        <Location_X>22.538145</Location_X>
        <Location_Y>113.952298</Location_Y>
        <Scale>13</Scale>
        <Label><![CDATA[深圳市南山区高新南一道9号飞亚达科技大厦方倍工作室]]></Label>
        <MsgId>6064818869572615123</MsgId>
    </xml>
    四、使用场景

    4.1 产品二维码检测真伪

     使用scancode_waitmsg事件,可以获得扫描结果,再与现有结果进行比对,从而可?#28304;?#21040;检测二维码真实性的功能。

    一个检测代码如下所示:

    1 case "scancode_waitmsg":
    2     if ($object->ScanCodeInfo->ScanResult == "http://mm.wanggou.com/item/jd2.shtml?sku=11447844"){
    3         $content = array();
    4         $content[] = array("Title"=>"该产品检测结果为正品", "Description"=>"书名:微信公众?#25945;?#24320;发最佳实践\n定价:¥69.00\n作者:方倍工作室\n\n点击“查看全文”,使用微信支付在线购买", "PicUrl"=>"http://images.cnitblog.com/i/340216/201404/301756448922305.jpg", "Url" =>"http://mm.wanggou.com/item/jd2.shtml?sku=11447844");
    5     }else{
    6         $content = "扫码带提示:类型 ".$object->ScanCodeInfo->ScanType." 结果:".$object->ScanCodeInfo->ScanResult;
    7     }
    8     break;

    当用户使用scancode_waitmsg菜单扫描以下二维码时,将出现检测结果,结果为真时,还可以再进一步,让用户进入购买

    4.2 快递进度查询

    基于上面同样的原理,可以实现扫描快递条形码,就查询快递进度的功能。

    一个快递的单号如下

    扫描以后,返回结果为 

    扫码带提示:类型 qrcode/CODE_39 结果:762480955342

    正确识别了其中的快递单号

    4.3 导航/附近/地图

    location_select事件比之前的直接发送地理位置消息更少了一步,比如下面的

    相关推荐
    微信5.0上线 自定义菜单申请将重新开启
    微信公众?#25945;?#24320;发模式自定义菜单开发指南
    微信公众?#25945;?#21019;建自定义菜单的PHP代码
    微信公众帐号自定义菜单创建及事件响应开发教程 附源代码
    微信公众帐号自定义菜单接口开发流程示例
    微信公众?#25945;?#26381;务号自定义菜单开发代码实例
    微信公众号自定义菜单申请与使用问题解答
    微信服务号申请自定义菜单的介绍
    微信公众?#25945;?#33258;定义菜单创建的Java代码示例
    从微信自定义菜单猜想微信App?#25945;?#21270;的未来
    微信公众?#25945;?#33258;定义菜单开发文档详解
    微信公众号开放自定义菜单 可输入跳转网址
    微信公众号页面模版功能和图文消息正文可插入历史群发链
    “扫一扫”与会员升级 微信并没有想象中那么简单
    微信公众?#25945;?#28040;息接口使用教程
    微信公众?#25945;?#25945;程?#22909;?#26377;正确响应Token验证的解决方法
    微信公众?#25945;?#28040;息接口开发教程之语音触发应用
    微信公众?#25945;?#25509;口开发教程之人脸识别应用
    微信公众?#25945;?#28040;息接口开发之小黄鸡机器人应用
    微信公众?#25945;?#24320;发教程之在线音乐/在线点歌
    微信公众?#25945;?#24320;发教程之快递查询应用
    微信公众?#25945;ˋPI接口开发教程
    微信公众?#25945;?#24320;发教程之通用接口API指南
    微信公众?#25945;?#25945;程之生成带参数二维码
    微信公众?#25945;?#24320;发模式启用及接口配置图文教程
    微信公众?#25945;?#28040;息接口开发教程 附封装工具实例代码
    微信公众?#25945;?#24320;发教程之消息的接收与响应实例代码
    微信公众帐号开发教程之文本消息长度限制详解
    微信公众?#25945;?#24320;发教程之文本消息换行符详解
    微信公众帐号开发教程之文本消息中如何添加网页超链接
    微信公众?#25945;?#24320;发教程之QQ表情的发送与接收
    微信开发教程之解析接口中的消息创建时间CreateTime
    微信公众?#25945;?#24320;发教程之符号表情的发送(1)
    微信公众帐号开发教程之符号表情的发送(2)

    精彩推荐

    ?#35753;?#25945;程

    任选五走势图
  • <bdo id="g6euu"><blockquote id="g6euu"></blockquote></bdo>
    <bdo id="g6euu"><samp id="g6euu"></samp></bdo>
  • <bdo id="g6euu"><blockquote id="g6euu"></blockquote></bdo>
    <bdo id="g6euu"><samp id="g6euu"></samp></bdo>