前言
之前有篇文章说了下微信扫描带参数二维码进行登录,今天再说一下另外一种微信扫码登录方式,即PC端授权登录
吐槽两句
作为一个开发者,对于微信的接口调用上,一开始我是拒绝的。。。为什么呢?因为微信的文档不是很完整,就拿支付宝的文档做比,同样功能用支付宝的接口开发,会节省至少一半的时间,这是大多数开发者的心声;
但是,不得不说,微信在大量用户基础上的产品还是不错的,方便了一大批人,比如今天我们要说的第三方登录;
还得吐槽一句,微信的认证机制真的恶心。。。做这个要认证,做那个要认证,每次认证三百大洋。。。而且还是每年都要认证。。。恶心!
功能了解
网站应用微信登录是基于OAuth2.0协议标准构建的微信OAuth2.0授权登录系统。
在进行微信OAuth2.在进行微信OAuth2.0授权登录接入之前,在微信开放平台注册开发者帐号,并拥有一个已审核通过的网站应用,并获得相应的AppID和AppSecret,申请微信登录且通过审核后,可开始接入流程。
微信OAuth2.0授权登录让微信用户使用微信身份安全登录第三方应用或网站,在微信用户授权登录已接入微信OAuth2.0的第三方应用后,第三方可以获取到用户的接口调用凭证(access_token),通过access_token可以进行微信开放平台授权关系接口调用,从而可实现获取微信用户基本开放信息和帮助用户实现基础开放功能等。
微信OAuth2.0授权登录目前支持authorization_code模式,适用于拥有server端的应用授权。
获取access_token
第三方发起微信授权登录请求,微信用户允许授权第三方应用后,微信会拉起应用或重定向到第三方网站,并且带上授权临时票据code参数;
通过code参数加上AppID和AppSecret等,通过API换取access_token;
- 通过access_token进行接口调用,获取用户基本数据资源或帮助用户实现基本操作。
实现方法
实现一
php代码处理
/**
* 获取openid
*/
public function followAction(){
$appid = 'appid';
$secret = 'appsecret';
//处理业务
if (GeneralUtility::_GET('code')) {
$code = GeneralUtility::_GET('code');
$codeUrl = 'https://api.weixin.qq.com/sns/oauth2/access_token?appid='.$appid.'&secret='.$secret.'&code='.$code.'&grant_type=authorization_code';
$result = json_decode(file_get_contents($url), true);
if (isset($result['access_token']) && isset($result['openid'])) {
// 已获取到用户openid和access_token,可以继续使用这两个参数获取详细的用户信息了
}
$this->redirect('follow');
}
$baseUrl = GeneralUtility::getIndpEnv('TYPO3_SITE_URL');
$redirect_uri = urlencode(GeneralUtility::getIndpEnv('TYPO3_REQUEST_URL'));
//准备向微信发请求
$url = "https://open.weixin.qq.com/connect/qrconnect?appid=".$appid."&redirect_uri=".$redirect_uri
."&response_type=code&scope=snsapi_login&state=STATE#wechat_redirect";
// header("Location:".$url);
$this->view->assign('loginurl', $url);
}
实现二
php 处理业务代码
/**
* 获取openid
*/
public function followAction(){
$appid = 'appid';
$secret = 'appsecret';
//处理业务
if (GeneralUtility::_GET('code')) {
$code = GeneralUtility::_GET('code');
$codeUrl = 'https://api.weixin.qq.com/sns/oauth2/access_token?appid='.$appid.'&secret='.$secret.'&code='.$code.'&grant_type=authorization_code';
$result = json_decode(file_get_contents($url), true);
if (isset($result['access_token']) && isset($result['openid'])) {
$user = $this->tuserRepository->findByUid($GLOBALS['TSFE']->fe_user->user['uid']);
$user->setOpenid($result['openid']);
$this->tuserRepository->update($user);
$this->refreshObjData();
}
$this->redirect('follow');
}
$baseUrl = GeneralUtility::getIndpEnv('TYPO3_SITE_URL');
$redirect_uri = urlencode(GeneralUtility::getIndpEnv('TYPO3_REQUEST_URL'));
$this->view->assign('redirect_uri', $redirect_uri);
}
html代码
<!--把这个代码放在你想要显示二维码的地方--!>
<div id="login_container"></div
javascript代码
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
<script type='text/javascript'>
$(document).ready(function(){
var redirect_uri = 'redirect_uri';//用于处理业务的链接,可由后台传值
var hash = Date.parse(new Date());
var obj = new WxLogin({
id:"login_container",//二维码容器id
appid: "appid",//APPID
scope: "snsapi_login",//写死就行
redirect_uri:encodeURI("'.$redirect_uri.'"),//业务处理链接 需要用encodeURI()处理
state: hash,//任意字符
style: "black", //样式:white
href: "https://typo3_go.gitee.io/wechat_login_css/wxlogin.css" //自定义样式链接,放在码云上最好不过了
});
});
</script>
评论 (0)