如果用戶在微信客戶端中訪問第三方網頁,公衆號可以通過微信網頁授權機制,來獲取用戶基本信息,進而實現業務邏輯。
關於網頁授權回調域名的說明
1、在微信公衆號請求用戶網頁授權之前,開發者需要先到公衆平臺官網中的“開發 - 接口權限 - 網頁服務 - 網頁帳號 - 網頁授權獲取用戶基本信息”的配置選項中,修改授權回調域名。請注意,這裏填寫的是域名(是一個字符串),而不是URL,因此請勿加 http:// 等協議頭;
這裏會要求下載一個文件,放到web服務器上,記得放就行。
2、授權回調域名配置規範爲全域名,比如需要網頁授權的域名爲:www.qq.com,配置以後此域名下面的頁面http://www.qq.com/music.html 、 http://www.qq.com/login.html 都可以進行OAuth2.0鑑權。但http://pay.qq.com 、 http://music.qq.com 、 http://qq.com 無法進行OAuth2.0鑑權
3、如果公衆號登錄授權給了第三方開發者來進行管理,則不必做任何設置,由第三方代替公衆號實現網頁授權即可
授權頁面demo
<html>
<!doctype html>
<html lang="ch">
<head>
<title>用戶信息獲取</title>
<meta charset="utf-8" />
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1"/>
<style>
.container {
text-align: center;
font-size: 24px;
}
.head {
width: 150px;
height: 150px;
}
</style>
<script>
//獲取地址參數, 參數可以是中文也可以是英文
function getUrlParam(key) {
var url = window.location.search;
var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)");
var result = url.substr(1).match(reg);
return result ? decodeURIComponent(result[2]) : null;
}
var openid = getUrlParam("openid"); // 用戶openid
var nickname = getUrlParam("nickname"); // 用戶暱稱
var headimgurl = getUrlParam("headimgurl"); //用戶頭像
var appID = "公衆號AppID"; // 公衆號AppID
var redirectUri = "http://授權接口地址"; // 授權接口地址
var state = "project1"; // 狀態標識
if(openid == null || openid == undefined || openid == ''){ // 通過判斷地址參數是否有openid來確定是否要跳轉授權
var strUrl = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=" + appID + "&redirect_uri=" + redirectUri + "&response_type=code&scope=snsapi_userinfo&state=" + state + "#wechat_redirect";
window.location.href = strUrl;
}
</script>
</head>
<body>
<div class="container">
<img src="" alt="head" id="head" />
<br/><br/>
<span>暱稱:<font id="nickname"></font></span>
<br/><br/>
<span>openid:<font id="openid"></font></span>
</div>
<script>
document.getElementById("head").src = headimgurl;
document.getElementById("nickname").innerHTML = nickname;
document.getElementById("openid").innerHTML = openid;
</script>
</body>
</html>
授權提取部分
<?php
$appId = '公衆號AppId'; // 公衆號AppId
$appSecret = '公衆號AppSecret'; // 公衆號AppSecret
$code = $_GET['code'];
$state = $_GET['state'];
$url = "https://api.weixin.qq.com/sns/oauth2/access_token?appid=$appId&secret=$appSecret&code={$code}&grant_type=authorization_code";
$a = file_get_contents($url);
switch($state){
case 'project1':
preg_match_all("/\"openid\":\"(.*?)\"/", $a, $matches, PREG_SET_ORDER);
$openid = $matches[0][1];
//返回的JSON數據包裏面有很都東西,按照需求加載
$json=(array)json_decode($a);
if(!isset($json['errcode'])){
$openid = $json['openid'];
$url ="https://api.weixin.qq.com/sns/userinfo?access_token=".$json['access_token']."&openid=".$json['openid'];
$a = file_get_contents($url);
$json = (array)json_decode($a);
$nickname = $json['nickname'];
$headimgurl = $json['headimgurl'];
header("Location:http://你的地址/index.html?openid=$openid&nickname=$nickname&headimgurl=$headimgurl");
}else{
}
break;
//可以再定義事件
default:
echo "ERROR";
}
?>
正確返回的json包裏面包含的數據如下:
{
"openid":" OPENID",//用戶的唯一標識
"nickname": NICKNAME,
"sex":"1", //用戶的性別,值爲1時是男性,值爲2時是女性,值爲0時是未知
"province":"PROVINCE",
"city":"CITY",
"country":"COUNTRY",
"headimgurl": "http://thirdwx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/46",//用戶頭像
"privilege":[ "PRIVILEGE1" "PRIVILEGE2" ],//用戶特權信息,json 數組,如微信沃卡用戶爲(chinaunicom)
"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"//只有在用戶將公衆號綁定到微信開放平臺帳號後,纔會出現該字段。
}
搗鼓一天,集百家之所長的結果。