關鍵字:微信公眾平臺 自定義菜單掃一掃 發圖片 發地理位置作者:方倍工作室原文:http://www.49028c.com/txw1958/p/weixin-menu-new-type.html
自定義菜單能夠幫助公眾號豐富界面,讓用戶更好更快地理解公眾號的重要功能。微信增加了點擊菜單后調起掃一掃(支持二維碼/一維碼)、發圖片、發地理位置的能力,需開發實現。原有自定義菜單開發權限的公眾號,均可獲得以上能力。
在這篇微信公眾平臺開發教程中,我們將介紹如何在自定義菜單上開發掃一掃、發圖片、發地理位置等功能。原有點擊和跳轉事件的開發,請參考微信公眾平臺開發(58)自定義菜單。
本文分為以下二個部分:
1. 掃碼推送事件 scancode_push用戶點擊按鈕后,微信客戶端將調起掃一掃工具,完成掃碼操作后顯示掃描結果(如果是URL,將進入URL),且會將掃碼的結果傳給開發者,開發者可以下發消息。
2. 掃碼推送事件,且彈出“消息接收中”提示框 scancode_waitmsg用戶點擊按鈕后,微信客戶端將調起掃一掃工具,完成掃碼操作后,將掃碼的結果傳給開發者,同時收起掃一掃工具,然后彈出“消息接收中”提示框,隨后可能會收到開發者下發的消息。
3. 彈出系統拍照發圖 pic_sysphoto用戶點擊按鈕后,微信客戶端將調起系統相機,完成拍照操作后,將拍攝的相片發送給開發者,并推送事件給開發者,同時收起系統相機,隨后可能會收到開發者下發的消息。
4. 彈出拍照或者相冊發圖 pic_photo_or_album用戶點擊按鈕后,微信客戶端將彈出選擇器供用戶選擇“拍照”或者“從手機相冊選擇”。用戶選擇后即走其他兩種流程。
5. 彈出微信相冊發圖器 pic_weixin用戶點擊按鈕后,微信客戶端將調起微信相冊,完成選擇操作后,將選擇的相片發送給開發者的服務器,并推送事件給開發者,同時收起相冊,隨后可能會收到開發者下發的消息。
6. 彈出地理位置選擇器 location_select用戶點擊按鈕后,微信客戶端將調起地理位置選擇工具,完成選擇操作后,將選擇的地理位置發送給開發者的服務器,同時收起位置選擇工具,隨后可能會收到開發者下發的消息。
以上新增能力,均僅支持微信iphone5.4.1以上版本,和Android5.4以上版本的微信用戶,舊版本微信用戶點擊后將沒有回應,開發者也不能正常接收到事件推送。
接口調用請求說明
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" } ]}
參數說明
參數 | 是否必須 | 說明 |
---|---|---|
button | 是 | 一級菜單數組,個數應為1~3個 |
sub_button | 否 | 二級菜單數組,個數應為1~5個 |
type | 是 | 菜單的響應動作類型 |
name | 是 | 菜單標題,不超過16個字節,子菜單不超過40個字節 |
key | click等點擊類型必須 | 菜單KEY值,用于消息接口推送,不超過128字節 |
url | view類型必須 | 網頁鏈接,用戶點擊菜單可打開鏈接,不超過256字節 |
菜單具體的生成方法,與之前是一樣的,先生成access token,再將菜單post內容提交給微信服務器,具體代碼及方法可以參考微信公眾平臺開發(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.VEVb.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 = "上傳位置:緯度 ".$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><![CD
新聞熱點
疑難解答