由于某一个误导,误打误撞的实现了微信登录...(其实是要实现第三方平台授权的,下一篇文档会讲解下第三方平台授权)
第三方登录多么常见我就不多说了,想要实现第三方登录首先需要在第三方平台(QQ、新浪微博、微信…)注册平台账号,然后配置…在此我就拿微信登录做一个简单的例子。
在此只写一个简单的小demo,是想告诉大家这个第三方登录其实很简单,没有想象的那么难。大家还是要多看官方文档。
首先也是最重要的:微信开放平台注册账号(收费di~)
注册完毕,去管理中心,如下:
有五个功能:移动应用、网站应用、公众账号、小程序、第三方平台
此篇文章主要说得是微信登录,所以主要讲一下网站应用,其他的功能大家百度一下哈
>>>官方文档>>>
看到官方文档这么简短,就可以知道微信登录的实现很简单啦
下面我直接贴我测试的代码(前端实现代码):
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>第三方登录---微信登录</title>
</head>
<body>
<div id="login_container">
这是装二维码的容器div
</div>
<script src="http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script>
<script type="text/javascript">
//id和scope不用改、appid和redirect_uri改为自己的
var obj = new WxLogin({
id:"login_container",
appid: "***************",
scope: "snsapi_login",
redirect_uri:"http%3A%2F%2Fwww.baidu.cn",
state: "",
style: "black",
href: ""
});
</script>
</body>
</html>
效果:
然后嵌到前端页面就可以了!
还有一种方式是跳转到二维码页面再跳转回来,那种方式估计很少用吧。。。因此我就没有写demo。
用户扫了二维码后,我们可以获得code。然后通过code获取access_token,然后再去调用接口获取用户信息。
在此只写一个简单的小demo,是想告诉大家这个第三方登录其实很简单,没有想象的那么难。大家还是要多看官方文档。
再往下就去看文档吧,我再写也不如官网详细啦
>>>官方文档>>>