第三方登录---微信登录

由于某一个误导，误打误撞的实现了微信登录...（其实是要实现第三方平台授权的，下一篇文档会讲解下第三方平台授权）

第三方登录多么常见我就不多说了，想要实现第三方登录首先需要在第三方平台（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，是想告诉大家这个第三方登录其实很简单，没有想象的那么难。大家还是要多看官方文档。

再往下就去看文档吧，我再写也不如官网详细啦
>>>官方文档>>>

第三方登录---微信登录

猜你喜欢