网站应用微信第三方扫码登录

网站应用微信第三方扫码登录

为了让用户登录网站更方便，微信扫码登录变得越来越广泛。
在开始之前首先要有开放平台的账号，没有账号需要用邮箱注册，但在小程序或公众号注册过的邮箱就不可再开放平台注册了。其次需要企业认证才能注册。

微信开放平台

主要面对移动应用/网站应用开发者，为其提供微信登录、分享、支付等相关权限和服务。

官方文档链接

准备工作

网站应用微信登录是基于OAuth2.0协议标准构建的微信OAuth2.0授权登录系统。 在进行微信OAuth2.0授权登录接入之前，在微信开放平台注册开发者帐号，并拥有一个已审核通过的网站应用，并获得相应的AppID和AppSecret，申请微信登录且通过审核后，可开始接入流程。

首先需要创建网站应用

按照要求填写信息，等待审核通过就可以查看Appid和AppSecret。

最后在该页面往下找到授权回调域，修改成要回调的域名（例如：www.baidu.com 不需要加http://或https://）。

准备工作就做完了。

编码

接下来把二维码嵌套到自己网站，只需要修改前台代码，在html中产能创建一个div容器用来放二维码。

<div id="wechat_container"></div>

然后要导入微信登录的js。
wxLogin.js下载链接：
提取码：szsr

<script src="wxlogin.js"></script>

JS代码：

$(document).ready(function()
{
	new WxLogin({
		id:"wechat_container",//二维码容器的ID
		appid: "appid",//网站应用的appid
		scope: "snsapi_login",//写死
		redirect_uri: "https://www.baidu.com ",//回调地址
		state: "",
		style: "black",//二维码样式
		href: ""//css文件
	});
});

打开该页面就会自动加载微信登录的二维码。扫码后手机会弹出登录授权，同意后即可跳转至回调地址，回调地址中含有code参数。

最后通过AppID、AppSecret、Code获取用户信息即可。获取地址如下，最后会返回一个json格式的值。

"https://api.weixin.qq.com/sns/oauth2/access_token?appid=" + AppID + "&secret=" + AppSecret + "&code=" + Code + "&grant_type=authorization_code"