1. 程式人生 > >微信公眾號選單openid 點選選單即可開啟並登入微站

微信公眾號選單openid 點選選單即可開啟並登入微站

現在大部分微站都通過使用者的微信openid來實現自動登入。在我之前的開發中,使用者通過點選一個選單,公眾號返回一個圖文,使用者點選這個圖文才可以自動登入微站。但是如果你擁有高階介面,就可以實現點選選單,開啟網頁就能獲取這個openid,實現自動登入。

這裡已經提到,必須要擁有高階介面的許可權(服務號、企業號),開啟了開發者模式。

1.設定回撥地址 

在微信公眾平臺後臺“開發者中心”中找到“高階介面”下的“OAuth2.0網頁授權”,後面有一個“修改”,點選之後就會彈出填寫回調地址的對話方塊。具體如何授權,請點選這裡學習。只有獲得高階介面許可權後,才能出現這個地方的“修改”。

注意,這裡填寫的是域名,不是帶http://的網址,而且解釋中很清楚,“授權回撥域名配置規範為全域名”,也就是說帶www和不帶是不同的兩個域名。因此我這裡要填寫如下圖中的域名。

2014-10-31-232011

2. 建立選單 

建立選單可以通過你的微站後臺建立,如果沒有開啟開發者模式,也可以通過微信公眾平臺後臺建立。

選單使用點選開啟連結的模式,也就是view模式。如果你是使用開發者模式,通過向微信提交如下程式碼,即可建立公眾號選單(開發者文件):

 {
     "button":[
     {	
          "type":"view",
          "name":"登入微站",
          "url":"https://open.weixin.qq.com/connect/oauth2/authorize?appid={在微信公眾平臺後臺獲取這個APPID}&redirect_uri={你填寫的回撥域名下的地址}&response_type=code&scope=snsapi_base&state=1#wechat_redirect"
      }]
 }

程式碼1 要提交的選單程式碼,下面要用到

APPID的獲取位置就是上面你填寫回調地址的那個“開發者中心”。下面我們用PHP來實現一下選單提交:

<?php
function curl_info($appid,$secret) {
? $ch = curl_init(); 
? curl_setopt($ch, CURLOPT_URL, "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=".$appid."&secret=".$secret);
? curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "GET");
? curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE); 
? curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE);
? curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (compatible; MSIE 5.01; Windows NT 5.0)');
? curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1);
? curl_setopt($ch, CURLOPT_AUTOREFERER, 1); 
? // curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
? curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); 
? $tmpInfo = curl_exec($ch); 
? if (curl_errno($ch)) { ?
??? echo 'Errno'.curl_error($ch);
? }
? curl_close($ch); 
? $arr= json_decode($tmpInfo,true);
? return $arr;
}
function curl_menu($ACCESS_TOKEN,$data) {
? $ch = curl_init(); 
? curl_setopt($ch, CURLOPT_URL, "https://api.weixin.qq.com/cgi-bin/menu/create?access_token=".$ACCESS_TOKEN
); ? curl_setopt($ch, CURLOPT_CUSTOMREQUEST, "POST"); ? curl_setopt($ch, CURLOPT_SSL_VERIFYPEER, FALSE); ? curl_setopt($ch, CURLOPT_SSL_VERIFYHOST, FALSE); ? curl_setopt($ch, CURLOPT_USERAGENT, 'Mozilla/5.0 (compatible; MSIE 5.01; Windows NT 5.0)'); ? curl_setopt($ch, CURLOPT_FOLLOWLOCATION, 1); ? curl_setopt($ch, CURLOPT_AUTOREFERER, 1); ? curl_setopt($ch, CURLOPT_POSTFIELDS, $data); ? curl_setopt($ch, CURLOPT_RETURNTRANSFER, true); ? $tmpInfo = curl_exec($ch); ? if (curl_errno($ch)) { ??? echo 'Errno'.curl_error($ch); ? } ? curl_close($ch); ? $arr= json_decode($tmpInfo,true); ? return $arr; } function creat_menu() { ? $ACCESS_LIST= curl_info(APP_ID,APP_SCR);//獲取到的憑證,你需要自己define APP_ID和APP_SCR(應用金鑰),這個也是在微信公眾平臺後臺開發者中心找 ? if($ACCESS_LIST['access_token']!='') { ??? $access_token = $ACCESS_LIST['access_token'];//獲取到ACCESS_TOKEN ??? $data = '把上面程式碼1拷貝黏貼在這裡'; ??? $msg = curl_menu($access_token,preg_replace("#\\\u([0-9a-f]+)#ie", "iconv('UCS-2', 'UTF-8', pack('H4', '\\1'))", $data)); ??? if($msg['errmsg']=='ok') { ????? die('建立自定義選單成功!'); ??? } ??? else { ????? die('建立自定義選單失敗!'); ??? } ? } ? else { ??? die('建立失敗,微信AppId或微信AppSecret填寫錯誤'); ? } } create_menu(); ?>

程式碼2 用PHP來建立微信公眾號選單

程式碼2其實有點冗餘了,核心部分用紅色標出來了。就這樣,你的微信公眾號中應該很快就可以看到建立了一個“登入微站”的選單。點選這個選單就可以實現登入微站了。

如果你不需要PHP,可以直接在微信公眾平臺後臺的選單自定義中寫連結就可以了。

2014-11-01-000630

在上圖中的這個地方,選擇開啟連結的方式建立選單。OK,接下來把上面那個連結放進去:

https://open.weixin.qq.com/connect/oauth2/authorize?appid={在微信公眾平臺後臺獲取這個APPID}&redirect_uri={你填寫的回撥域名下的地址}&response_type=code&scope=snsapi_base&state=1#wechat_redirect

建立選單就可以了。

當然,你也有可能只需要在你自己的微信管理後臺加入這個連結就可以了。

3.在回撥頁獲取openid 

細心的你可能已經發現了,上面的連結地址中含有引數scope=snsapi_base,而非scope=snsapi_userinfo,因為使用前者不需要使用者點選一個授權按鈕,直接跳轉到回撥頁面,而後者需要點選授權按鈕,不過點選授權按鈕有好處,一是可以在沒有關注公眾號的情況下也可以授權,二是授權後可以獲得使用者的一些資訊,如暱稱、性別、所在地。但是我們是為了利用openid進行登入,所以直接選擇前者就可以了。

點選選單之後,經過微信authorize的處理,會跳轉到你提交的回撥地址(這裡需要提醒,回撥地址最好不要帶引數,例如xxx/?callback=from_weixin,因為微信跳轉到你的回撥地址也要帶引數,而這個引數就你需要的)。微信跳轉到如下URL:

回撥地址/?code=CODE&state=1

上面程式碼可以通過$_GET['code']獲得一個CODE值,利用這個CODE值和appid,可以獲得openid和access_token。

下面再用PHP來實現以下:

if($_GET['code']) {
? $code = $_GET['code'];
? $data = get_by_curl('https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=APPSRC&code='.$code.'&grant_type=authorization_code');
? $data = json_decode($data);
? $openid = $data->openid;
? $access_token = $data->access_token;
}

function get_by_curl($url,$post = false){
?? ?$ch = curl_init();
?? ?curl_setopt($ch,CURLOPT_URL,$url);
?? ?curl_setopt($ch, CURLOPT_HEADER, 0);
?? ?curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
?? ?if($post){
?? ??? ?curl_setopt($ch, CURLOPT_POST, 1);
?? ??? ?curl_setopt($ch, CURLOPT_POSTFIELDS,$post);
?? ?}
?? ?$result = curl_exec($ch);
?? ?curl_close($ch);
?? ?return $result;
}

這樣可以就可以獲得openid和access_token,利用這些值,我們還可以利用微信公眾平臺的獲取使用者基本資訊api介面獲取使用者基本資訊。