微信第三方登录

布满荆棘的人生 2022-05-30 12:12 478阅读 0赞

转自：http://www.cnblogs.com/linjunjie/p/6378166.html\#3902595

*  从http://www.cnblogs.com/v-weiwang/p/5732423.htm

申请开发者账号之内的就不累赘了，网上一大堆：

说下需求，一个网页要在三类容器运行，公司app，微信自动登录，浏览器。

![802779-20161011222713453-989228801.png][]

假设是已经申请完成各平台开发者账号。

先来简单的，微博和QQ

微博：

引入微博JS

appkey中，填入你的微博开发者id(替换\*\*\*\*)

<table style="width:981px;border-spacing:0px;border:1px solid #C0C0C0;margin:0px;padding:0px;float:none;height:auto;line-height:1.1em;vertical-align:baseline;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;font-size:12px;min-height:auto;background-image:none;"> 
 <tbody style="margin:0px;padding:0px;float:none;height:auto;line-height:1.1em;vertical-align:baseline;width:auto;min-height:auto;background-image:none;"> 
  <tr style="border-top:0px;background:none;margin:0px;padding:0px;float:none;height:auto;line-height:1.1em;vertical-align:baseline;width:auto;min-height:auto;"> 
   <td style="border-color:#C0C0C0;padding:3px;border-collapse:collapse;color:rgb(175,175,175);line-height:1.1em;margin:0px;float:none;height:auto;vertical-align:baseline;width:35px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;min-height:auto;background-image:none;"> 
    <div style="margin:0px;padding:0px .5em;border-width:0px 2px 0px 0px;border-right-style:solid;border-right-color:rgb(108,226,108);float:none;height:auto;line-height:1.8em;text-align:right;vertical-align:baseline;width:auto;min-height:auto;white-space:nowrap;background:rgb(244,244,244) none;">
      1 
    </div></td> 
   <td style="border-color:#C0C0C0;padding:3px;border-collapse:collapse;line-height:1.1em;margin:0px;float:none;height:auto;vertical-align:baseline;width:auto;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;min-height:auto;background-image:none;"> 
    <div style="margin:0px;padding:0px;width:auto;border:0px;float:none;height:auto;line-height:1.1em;vertical-align:baseline;min-height:auto;background-image:none;"> 
     <div style="margin:0px;padding:0px 1em;border:0px;float:none;height:auto;line-height:1.8em;vertical-align:baseline;width:auto;min-height:auto;white-space:nowrap;background:rgb(244,244,244) none;"> 
      <code style="font-size:14px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;line-height:1.8em;background:none;margin:0px;padding:0px;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;">&lt;</code> 
      <code style="font-size:14px;background:none;color:rgb(0,0,255);padding:0px;margin:0px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;line-height:1.8em;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;">span</code>&nbsp; 
      <code style="font-size:14px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;line-height:1.8em;background:none;margin:0px;padding:0px;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;">id="wb_connect_btn"&gt;微博登录按钮&lt;/</code> 
      <code style="font-size:14px;background:none;color:rgb(0,0,255);padding:0px;margin:0px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;line-height:1.8em;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;">span</code> 
      <code style="font-size:14px;font-family:Consolas, 'Bitstream Vera Sans Mono', 'Courier New', Courier, monospace;line-height:1.8em;background:none;margin:0px;padding:0px;border:0px;float:none;height:auto;vertical-align:baseline;width:auto;min-height:auto;">&gt;</code> 
     </div> 
    </div></td> 
  </tr> 
 </tbody> 
</table>

在你的页面微博登录按钮标签上，加入以上id。页面加载时，微博会自动加载样式，你也可以自己强行修改。

![复制代码][copycode.gif]

![复制代码][copycode.gif]

将以上标签全部加入html中。

至此，只要在页面中登录之后，就能在控制台看到返回数据。当然，测试要在微博注册的域下。

QQ登录：

和微博一样，引入JavaScript文件

微博类似，替换为你的appid

登录标签中加入id标识

然后JavaScript中加入以下代码：

![复制代码][copycode.gif]

QC.Login({
                        //btnId：插入按钮的节点id，必选
                        btnId:"qqLoginBtn",
                        //用户需要确认的scope授权项，可选，默认all
                        scope:"all",
                        //按钮尺寸，可用值[A_XL| A_L| A_M| A_S|  B_M| B_S| C_S]，可选，默认B_S
                        size: "B_S"
                    }, function(reqData, opts){
         //登录成功
                        //根据返回数据，更换按钮显示状态方法
                        console.log(reqData);//查看返回数据
                        QC.Login.getMe(function(openId, accessToken){//获取用户的openId
                            console.log('QQOPENID:'+openId);
                            thirdparty(null,null,reqData.figureurl_qq_2,reqData.nickname,1,openId);
                            QC.Login.signOut();//退出QQ登录调用事件
                        });
                    }
                );

![复制代码][copycode.gif]

测试要在QQ中注册的域名下。重要的事情，再说一遍。

QQ和微博登录，大致相同，只要引入JS文件，然后直接调用方法即可，QQ比微博更和谐，直接提供退出事件。上面代码中有。。

现在来说最蛋疼的微信登录。

微信登录提供两种方法：

第一种，扫码登录：

需要在微信开发者平台中，注册获取appId。

微信登录按钮：

在你微信登录按钮上，添加点击事件，执行以下代码：

$('.weixin-login').on('click',function(){
                window.location.href='https://open.weixin.qq.com/connect/qrconnect?' +
                    'appid=*******&redirect_uri=http%3a%2f%2fwww.xxxxxx.com%2f'+window.location.pathname.substr(1)+'&response_type=code&scope=snsapi_login&state=3d6be0a4035d839573b04816624a415e#wechat_redirect';
            });

需要替换：

![802779-20161011222931875-1145390638.png][]

redirect\_url:要想传当前url，直接encodeURIComponent(window.location.href) //当然，需要你自己进行拼接，不懂的留言

至此，当用户点击之后，跳转至扫码界面：

![802779-20161011223228406-486921276.png][]

![802779-20161011223615125-2074577399.png][]

例如：[https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e][https_passport.yhd.com_wechat_callback.do_code_CODE_state_3d6be0a4035d839573b04816624a415e]

至此，拿到第一步令牌，code。在你的回调页面中，你要获取url中的code去和微信换取下一步的令牌。因为换取下一步的令牌需要涉及到跨域请求，但是微信不让跨域请求，只能在后台进行后续事项。

第二步，后台请求：https://api.weixin.qq.com/sns/oauth2/access\_token?appid=\[APPID\]&secret=\[SECRET\]&code=\[CODE\]&grant\_type=authorization\_code

替换中括号中的数据。（我走的get请求）。

![802779-20161011225103062-1798020810.png][]

返回以下数据：

![复制代码][copycode.gif]

{ 
    "access_token":"ACCESS_TOKEN", 
    "expires_in":7200, 
    "refresh_token":"REFRESH_TOKEN",
    "openid":"OPENID", 
    "scope":"SCOPE",
    "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
    }

![复制代码][copycode.gif]

最后一步就不说了：

https://api.weixin.qq.com/sns/userinfo?access\_token=\[ACCESS\_TOKEN\]&openid=\[OPENID\]

替换成上次请求获取到的数据，再请求一次，获奖用户基本信息。

1、OAuth2.0

OAuth（开放授权）是一个开放标准，允许用户让第三方应用访问该用户在某一网站上存储的私密的资源（如照片，视频，联系人列表），而无需将用户名和密码提供给第三方应用。

允许用户 提供一个令牌， 而不是用户名和密码来访问他们存放在特定服务提供者的数据。每一个令牌授权一个特定的网站（例如，视频编辑网站)在特定的时段（例如，接下来的2小时内）内访问特定的资源（例如仅仅是某一相册中的视频）。这样，OAuth允许用户授权第三方网站访问他们存储在另外的服务提供者上的信息，而不需要分享他们的访问许可或他们数据的所有内容。

2、目标

我们这里主要模拟使用OAuth2.0，用户通过扫描我们网页应用的二维码并进行授权登录来获取用户的基本信息的过程。详细的接口相关信息可以在微信开放平台上查看： [https://open.weixin.qq.com/cgi-bin/showdocument?action=dir\_list&t=resource/res\_list&verify=1&lang=zh\_CN][https_open.weixin.qq.com_cgi-bin_showdocument_action_dir_list_t_resource_res_list_verify_1_lang_zh_CN]

3、前期准备（获取微信开发者权限）

我们这里主要讲的是网站（Web）应用，网站应用微信登录是基于OAuth2.0协议标准构建的微信OAuth2.0授权登录系统(即上面的协议)。在微信客户端授权登录(获取用户信息）的可以查看: [http://www.cnblogs.com/0201zcr/p/5131602.html][http_www.cnblogs.com_0201zcr_p_5131602.html]

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

3.1、注册开发者账号

可以在 [https://open.weixin.qq.com/][https_open.weixin.qq.com] 这里申请开发的账号。由于是腾讯的网页，这里可以直接通过 QQ号进行登录。

3.2、提交网站应用审核

在已经登录的界面中选择“管理中心”——》网站应用——》创建网站应用

![731178-20160115131041991-1058874094.png][]

将会弹出下面的界面

![731178-20160115131108803-1188358406.png][]

填写过后，还有有一个页面需要填写，提交一份纸质版申请书扫描件（会提供模板，我们下载再来填写后，需盖章，签名），配置回调域名（扫码登录后会跳转的页面）等。

之后提交审核即可，等微信审核通过，我们即可获得我们需要的网页应用的 appid和AppSecret，并配置后回调的域名了（这三样是我们开发所必须的）。

3.3、开发者资质认证

由于我们这里要使用微信登录的接口，所以我们还需要向微信提出认证，只有认证了才能使用微信那些高级的接口。未认证的如下图所示

![731178-20160115131632616-547932195.png][]

认证之后是这样子的：

![731178-20160115131729288-457434641.png][]

我现在暂时没有找到可以向公众账号那样子的测试账号的申请。如果有知道怎么可以申请到测试账号的高手，希望能赐教一下。

接下来，我们就可以开始我们的网页微信扫码登录开发了。

4、授权流程说明

微信OAuth2.0授权登录让微信用户使用微信身份安全登录第三方应用或网站，在微信用户授权登录已接入微信OAuth2.0的第三方应用后，第三方可以获取到用户的接口调用凭证（access\_token），通过access\_token可以进行微信开放平台授权关系接口调用，从而可实现获取微信用户基本开放信息和帮助用户实现基础开放功能等。

微信OAuth2.0授权登录目前支持authorization\_code模式，适用于拥有server端的应用授权。该模式整体流程为：

1. 第三方发起微信授权登录请求，微信用户允许授权第三方应用后，微信会拉起应用或重定向到第三方网站，并且带上授权临时票据code参数；
    2. 通过code参数加上AppID和AppSecret等，通过API换取access_token；
    3. 通过access_token进行接口调用，获取用户基本数据资源或帮助用户实现基本操作。

获取access\_token时序图：

![731178-20160115132145897-758264873.png][]

5、获取网页的二维码

当我们通过微信的认证，获取到了 appid和AppSecret，并配置了回调的域名。我们就已经可以获取属于我们网页的二维码了，获取的方式很简单，只需打开一个微信的链接，加上我们的appid和回调域名即可在网页上面打开二维码，用户用微信客户端扫码并授权登录之后即会跳转到我们配置的回调域名下。

注意：

1、这里填写的是域名（是一个字符串），而不是URL，因此请勿加http://等协议头；
    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鉴权

5.1、请求url说明

第三方使用网站应用授权登录前请注意已获取相应网页授权作用域（scope=snsapi\_login），则可以通过在PC端打开以下链接：

https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

参数说明

<table style="margin:0px auto;padding:0px;border-spacing:0px;border:1px solid #C0C0C0;"> 
 <thead style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">参数</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是否必须</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">说明</th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">appid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用唯一标识（前面认证网页应用中获得）</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">redirect_uri</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">重定向地址，需要进行UrlEncode（前面认证网页应用中获得）</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">response_type</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">填code</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">scope</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">state</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">否</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验</td> 
  </tr> 
 </tbody> 
</table>

返回说明

用户允许授权后，将会重定向到redirect\_uri的网址上，并且带上code和state参数

redirect_uri?code=CODE&state=STATE

若用户禁止授权，则重定向后不会带上code参数，仅会带上state参数

redirect_uri?state=STATE

5.2、事例：

一号店的微信二维码链接如下：

https://open.weixin.qq.com/connect/qrconnect?appid=wxbdc5610cc59c1631&redirect_uri=https%3A%2F%2Fpassport.yhd.com%2Fwechat%2Fcallback.do&response_type=code&scope=snsapi_login&state=3d6be0a4035d839573b04816624a415e#wechat_redirect

将其复制到浏览器中打开即可获得一号店的二维码，二维码页面如下：

![731178-20160116103317257-2080473155.png][]

通过使用微信客户端的扫一扫功能，扫描该二维码，即会跳转到上面填写redirect\_uri所在的地址上。假如用户同意授权，这里就获得了微信返回的code参数了。

6、获取用户信息

假如前面已经获得code。我们可以通过code参数去获取用户openid和access\_token,进而获得用户的信息。

6.1、通过code参数获取access\_token

https://api.weixin.qq.com/sns/oauth2/access_token?appid=APPID&secret=SECRET&code=CODE&grant_type=authorization_code

参数说明

###### 返回说明 ######

正确的返回：

![复制代码][copycode.gif]

![复制代码][copycode.gif 1]

{ 
    "access_token":"ACCESS_TOKEN", 
    "expires_in":7200, 
    "refresh_token":"REFRESH_TOKEN",
    "openid":"OPENID", 
    "scope":"SCOPE",
    "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"
    }

![复制代码][copycode.gif 1]

![复制代码][copycode.gif]

错误返回样例：

{"errcode":40029,"errmsg":"invalid code"}

注意：

*  code参数的超时时间是5分钟，且每次请求的code参数的值都不一样。
 *  access\_token的超时时间是32分钟。

6.2、通过access\_token获取用户的基本信息

获取的前提条件

*  access\_token有效且为超时；
 *  微信用户已授权给第三方应用账号相应接口作用域（scope)【在二维码生成连接那里填写】

对于接口作用域（scope），能调用的接口有以下：

使用snsapi\_base作用域的授权是扫码之后无需用户点击授权，扫码后直接跳转，用户感觉不到授权了，但这种授权方式能获取的数据量有限，这里我们要获取用户的基本信息，我们需要使用snsapi\_userinfo授权。使用snsapi\_userinfo授权，扫码后出现类似于下面的授权界面

![731178-20160116104851882-1088738021.jpg][]

此接口用于获取用户个人信息。开发者可通过OpenID来获取用户基本信息。特别需要注意的是， 如果开发者拥有多个移动应用、网站应用和公众帐号，可通过获取用户基本信息中的unionid来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号，用户的unionid是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用，unionid是相同的。请注意，在用户修改微信头像后，旧的微信头像URL将会失效，因此开发者应该自己在获取用户信息后，将头像图片保存下来，避免微信头像URL失效后的异常情况。

https://api.weixin.qq.com/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID

参数说明

###### 返回说明 ######

正确的Json返回结果：

![复制代码][copycode.gif]

![复制代码][copycode.gif 1]

{ 
    "openid":"OPENID",
    "nickname":"NICKNAME",
    "sex":1,
    "province":"PROVINCE",
    "city":"CITY",
    "country":"COUNTRY",
    "headimgurl": "http://wx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/0",
    "privilege":[
    "PRIVILEGE1", 
    "PRIVILEGE2"
    ],
    "unionid": " o6_bmasdasdsad6_2sgVt7hMZOPfL"
    
    }

![复制代码][copycode.gif 1]

![复制代码][copycode.gif]

<table style="margin:0px auto;padding:0px;border-spacing:0px;border:1px solid #C0C0C0;"> 
 <thead style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">参数</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">说明</th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">openid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户的标识，对当前开发者帐号唯一</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">nickname</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户昵称</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">sex</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户性别，1为男性，2为女性</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">province</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户个人资料填写的省份</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">city</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户个人资料填写的城市</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">country</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">国家，如中国为CN</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">headimgurl</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户头像，最后一个数值代表正方形头像大小（有0、46、64、96、132数值可选，0代表640*640正方形头像），用户没有头像时该项为空</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">privilege</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户特权信息，json数组，如微信沃卡用户为（chinaunicom）</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">unionid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。</td> 
  </tr> 
 </tbody> 
</table>

错误的Json返回示例:

{ 
    "errcode":40003,"errmsg":"invalid openid"
    }

7、总结

最近着手开发了微信网页扫码登录和公众号授权登录收获颇丰，两者的开发很类似。以下是我个人摸索过程中发现的两者的异同：

*  两者都可以通过微信客户端扫码授权的方式，让第三方页面获得微信用户的一些基本信息（昵称、性别、所在地、在微信唯一标示等……）。他们都是通过提供一个链接让用户授权的方式。但网页版需要在页面打开二维码之后授权，而公众号则需要用户先关注了我们的公众号，然后点开公众号里面的链接，确认授权即可。
 *  网页扫码登录需要将授权的链接（二维码链接）在网页中打开、而公众号授权登录的链接必须要微信客户端中打开。
 *  无论网页扫码登录还是在公众号中授权登录，都是通过授权的方式获得一个code参数，之后通过code参数获取access\_token和openid和通过access\_token和openid去获取用户的基本信息的请求链接是一样的。
 *  在开发公众号授权登录的过程中，我发现了有测试账号的提供，足以满足我们的测试和开发，但在开发网页扫码时，暂时未发现哪里能获取测试账号，我是通过申请获取的。（希望知道哪里有测试账号的请求高手赐教）。

第一步：获取AppID AppSecret(不做解释，自己去微信公众平台申请)

第二步：生成扫描二维码，获取code

https://open.weixin.qq.com/connect/qrconnect?appid=AppID&redirect\_uri=http://www.baidu.com&response\_type=code&scope=snsapi\_login&state=2014\#wechat\_redirect

第三步：通过code获取access\_token  
https://api.weixin.qq.com/sns/oauth2/access\_token?appid=AppID&secret=AppSecret&code=00294221aeb06261d5966&grant\_type=authorization\_code

第四步：因接口频率有次数限制，如果需要，刷新access\_token

https://api.weixin.qq.com/sns/oauth2/refresh\_token?appid=AppID&grant\_type=refresh\_token&refresh\_token=REFRESH\_TOKEN

第五步：通过access\_token和openid获取用户的基础信息，包括头像、昵称、性别、地区

https://api.weixin.qq.com/sns/userinfo?access\_token=bezXEiiBSKSxW0eoblIewFNHqAG-PyW9OqI\_L81E4ZCi2cFpfoJTyQc0xKlPPCtqK1kLJfiRbVrpoOVLw7fjpqh52bn7C68SHa2HSgYsVPXZPvJvtayDa57-\_7TeHYw&openid=o39YsbmuV\_bIPGpj1MTe

这是接口在线调试工具：

http://mp.weixin.qq.com/debug/  
这是错误码说明文档：

http://mp.weixin.qq.com/wiki/17/fa4e1434e57290788bde25603fa2fcbd.html

另外需要特别注意，如果开发者有在多个公众号，或在公众号、移动应用之间统一用户帐号的需求，需要前往微信开放平台（open.weixin.qq.com）绑定公众号后，才可利用UnionID机制来满足上述需求，文档：  
http://mp.weixin.qq.com/wiki/14/bb5031008f1494a59c6f71fa0f319c66.html

# 微信网页第三方登录原理 #

微信开放平台和公众平台的区别

1.公众平台面向的时普通的用户，比如自媒体和媒体，企业官方微信公众账号运营人员使用，当然你所在的团队或者公司有实力去开发一些内容，也可以调用公众平台里面的接口，比如自定义菜单，自动回复，查询功能。目前大多数微信通过认证之后，都在做这个事情。

mp.weixin.qq.com

2.开放平台面向的开发者和第三方独立软件开发商。我觉得开发平台最大的开放就是微信登录。当年腾讯没有花大力气去做统一登录这个事情，导致目前各个网站都要弄一套登录机制。好在他们现在认清了局势。开发者或软件开发商，通过微信开放提供的平台和接口，可以开发适合企业的电子商务网站，扫描二维码进去一个游戏界面，然后去购买商品等。当然后续开放平台要开放支付接口，那么类似口袋通这种软件开发厂商，就可以为大型，中小企业提供微信小店这种服务和软件了。

open.weixin.qq.com

公众平台就是服务号订阅号的管理开发后台。

开发平台说得通俗一点就是实现手机里边安装软件的内容一键分享朋友圈；

下面的第三方登陆就是依托于开放平台（open.weixin.qq.com）的功能

#### 准备工作 ####

网站应用微信登录是基于[OAuth2.0协议标准][OAuth2.0]构建的微信OAuth2.0授权登录系统。

#### 授权流程说明 ####

微信OAuth2.0授权登录目前支持authorization\_code模式，适用于拥有server端的应用授权。该模式整体流程为：

1. 第三方发起微信授权登录请求，微信用户允许授权第三方应用后，微信会拉起应用或重定向到第三方网站，并且带上授权临时票据code参数；

2. 通过code参数加上AppID和AppSecret等，通过API换取access\_token；

3. 通过access\_token进行接口调用，获取用户基本数据资源或帮助用户实现基本操作。

获取access\_token时序图：

![1087656-20170104191743972-218803961.png][]

##### 第一步：请求CODE #####

第三方使用网站应用授权登录前请注意已获取相应网页授权作用域（scope=snsapi\_login），则可以通过在PC端打开以下链接：  
[https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect\_uri=REDIRECT\_URI&response\_type=code&scope=SCOPE&state=STATE\#wechat\_redirect][https_open.weixin.qq.com_connect_qrconnect_appid_APPID_redirect_uri_REDIRECT_URI_response_type_code_scope_SCOPE_state_STATE_wechat_redirect]

若提示“该链接无法访问”，请检查参数是否填写错误，如redirect\_uri的域名与审核时填写的授权域名不一致或scope不为snsapi\_login。

###### 参数说明 ######

<table style="margin:0px auto;padding:0px;border-spacing:0px;border:1px solid #C0C0C0;"> 
 <thead style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">参数</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是否必须</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">说明</th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">appid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用唯一标识</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">redirect_uri</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">重定向地址，需要进行UrlEncode</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">response_type</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">填code</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">scope</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">state</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">否</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验</td> 
  </tr> 
 </tbody> 
</table>

###### 返回说明 ######

用户允许授权后，将会重定向到redirect\_uri的网址上，并且带上code和state参数

`redirect_uri?code=CODE&state=STATE`

若用户禁止授权，则重定向后不会带上code参数，仅会带上state参数

`redirect_uri?state=STATE`

###### 请求示例 ######

登录一号店网站应用

[https://passport.yhd.com/wechat/login.do][https_passport.yhd.com_wechat_login.do]

打开后，一号店会生成state参数，跳转到  
[https://open.weixin.qq.com/connect/qrconnect?appid=wxbdc5610cc59c1631&redirect\_uri=https%3A%2F%2Fpassport.yhd.com%2Fwechat%2Fcallback.do&response\_type=code&scope=snsapi\_login&state=3d6be0a4035d839573b04816624a415e\#wechat\_redirect][https_open.weixin.qq.com_connect_qrconnect_appid_wxbdc5610cc59c1631_redirect_uri_https_3A_2F_2Fpassport.yhd.com_2Fwechat_2Fcallback.do_response_type_code_scope_snsapi_login_state_3d6be0a4035d839573b04816624a415e_wechat_redirect]

微信用户使用微信扫描二维码并且确认登录后，PC端会跳转到

[https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e][https_passport.yhd.com_wechat_callback.do_code_CODE_state_3d6be0a4035d839573b04816624a415e]

为了满足网站更定制化的需求，我们还提供了第二种获取code的方式，支持网站将微信登录二维码内嵌到自己页面中，用户使用微信扫码授权后通过JS将code返回给网站。

JS微信登录主要用途：网站希望用户在网站内就能完成登录，无需跳转到微信域下登录后再返回，提升微信登录的流畅性与成功率。 网站内嵌二维码微信登录JS实现办法：

###### 步骤1：在页面中先引入如下JS文件（支持https）： ######

###### 步骤2：在需要使用微信登录的地方实例以下JS对象： ######

var obj = new WxLogin(\{

id:"login\_container",

appid: "",

scope: "",

redirect\_uri: "",

state: "",

style: "",

href: ""

\});

###### 参数说明 ######

<table style="margin:0px auto;padding:0px;border-spacing:0px;border:1px solid #C0C0C0;"> 
 <thead style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">参数</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是否必须</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">说明</th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">id</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">第三方页面显示二维码的容器id</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">appid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用唯一标识，在微信开放平台提交应用审核通过后获得</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">scope</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">应用授权作用域，拥有多个作用域用逗号（,）分隔，网页应用目前仅填写snsapi_login即可</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">redirect_uri</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">是</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">重定向地址，需要进行UrlEncode</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">state</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">否</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用于保持请求和回调的状态，授权请求后原样带回给第三方。该参数可用于防止csrf攻击（跨站请求伪造攻击），建议第三方带上该参数，可设置为简单的随机数加session进行校验</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">style</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">否</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">提供"black"、"white"可选，默认为黑色文字描述。详见文档底部FAQ</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">href</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">否</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">自定义样式链接，第三方可根据实际需求覆盖默认样式。详见文档底部FAQ</td> 
  </tr> 
 </tbody> 
</table>

##### 第二步：通过code获取access\_token #####

通过code获取access\_token

https://api.weixin.qq.com/sns/oauth2/access\_token?appid=APPID&secret=SECRET&code=CODE&grant\_type=authorization\_code

###### 参数说明 ######

###### 返回说明 ######

正确的返回：

`{  "access_token":"ACCESS_TOKEN",  "expires_in":7200,  "refresh_token":"REFRESH_TOKEN", "openid":"OPENID",  "scope":"SCOPE",``"unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL"``}`

错误返回样例：

`{"errcode":40029,"errmsg":"invalid code"}`

##### 刷新access\_token有效期 #####

access\_token是调用授权关系接口的调用凭证，由于access\_token有效期（目前为2个小时）较短，当access\_token超时后，可以使用refresh\_token进行刷新，access\_token刷新结果有两种：

1.  1. 若access\_token已超时，那么进行refresh\_token会获取一个新的access\_token，新的超时时间；
2.  2. 若access\_token未超时，那么进行refresh\_token不会改变access\_token，但超时时间会刷新，相当于续期access\_token。

refresh\_token拥有较长的有效期（30天），当refresh\_token失效的后，需要用户重新授权。

###### 请求方法 ######

获取第一步的code后，请求以下链接进行refresh\_token：

https://api.weixin.qq.com/sns/oauth2/refresh\_token?appid=APPID&grant\_type=refresh\_token&refresh\_token=REFRESH\_TOKEN

###### 参数说明 ######

###### 返回说明 ######

正确的返回：

`{  "access_token":"ACCESS_TOKEN",  "expires_in":7200,  "refresh_token":"REFRESH_TOKEN",  "openid":"OPENID",  "scope":"SCOPE"  }`

错误返回样例：

`{"errcode":40030,"errmsg":"invalid refresh_token"}`

##### 注意： #####

1、Appsecret 是应用接口使用密钥，泄漏后将可能导致应用数据泄漏、应用的用户数据泄漏等高风险后果；存储在客户端，极有可能被恶意窃取（如反编译获取Appsecret）；

2、access\_token 为用户授权第三方应用发起接口调用的凭证（相当于用户登录态），存储在客户端，可能出现恶意获取access\_token 后导致的用户数据泄漏、用户微信相关接口功能被恶意发起等行为；

3、refresh\_token 为用户授权第三方应用的长效凭证，仅用于刷新access\_token，但泄漏后相当于access\_token 泄漏，风险同上。

建议将secret、用户数据（如access\_token）放在App云端服务器，由云端中转接口调用请求。

#### ####

##### 第三步：通过access\_token调用接口 #####

获取access\_token后，进行接口调用，有以下前提：

1.  1. access\_token有效且未超时；
2.  2. 微信用户已授权给第三方应用帐号相应接口作用域（scope）。

对于接口作用域（scope），能调用的接口有以下：

其中snsapi\_base属于基础接口，若应用已拥有其它scope权限，则默认拥有snsapi\_base的权限。使用snsapi\_base可以让移动端网页授权绕过跳转授权登录页请求用户授权的动作，直接跳转第三方网页带上授权临时票据（code），但会使得用户已授权作用域（scope）仅为snsapi\_base，从而导致无法获取到需要用户授权才允许获得的数据和基础功能。

接口调用方法可查阅[《微信授权关系接口调用指南》][Link 1]

##### F.A.Q #####

###### 1. 什么是授权临时票据（code）？ ######

答：第三方通过code进行获取access\_token的时候需要用到，code的超时时间为10分钟，一个code只能成功换取一次access\_token即失效。code的临时性和一次保障了微信授权登录的安全性。第三方可通过使用https和state参数，进一步加强自身授权登录的安全性。

###### 2. 什么是授权作用域（scope）？ ######

答：授权作用域（scope）代表用户授权给第三方的接口权限，第三方应用需要向微信开放平台申请使用相应scope的权限后，使用文档所述方式让用户进行授权，经过用户授权，获取到相应access\_token后方可对接口进行调用。

###### 3. 网站内嵌二维码微信登录JS代码中style字段作用？ ######

答：第三方页面颜色风格可能为浅色调或者深色调，若第三方页面为浅色背景，style字段应提供"black"值（或者不提供，black为默认值），则对应的微信登录文字样式为黑色。相关效果如下：

![1087656-20170104192242659-1489160886.png][]![1087656-20170104192248769-1801161916.png][]

若提供"white"值，则对应的文字描述将显示为白色，适合深色背景。相关效果如下：

![1087656-20170104192435769-79869042.png][]![1087656-20170104192440487-1578475330.png][]

###### 4.网站内嵌二维码微信登录JS代码中href字段作用？ ######

答：如果第三方觉得微信团队提供的默认样式与自己的页面样式不匹配，可以自己提供样式文件来覆盖默认样式。举个例子，如第三方觉得默认二维码过大，可以提供相关css样式文件，并把链接地址填入href字段

`.impowerBox .qrcode {width: 200px;} .impowerBox .title {display: none;} .impowerBox .info {width: 200px;} .status_icon {display：none} .impowerBox .status {text-align: center;} `

相关效果如下：

![1087656-20170104192539909-1538949616.png][]![1087656-20170104192545206-545349429.png][]

##### 通过code获取access\_token #####

###### 接口说明 ######

通过code获取access\_token的接口。

###### 请求说明 ######

http请求方式: GET

https://api.weixin.qq.com/sns/oauth2/access\_token?appid=APPID&secret=SECRET&code=CODE&grant\_type=authorization\_code

###### 参数说明 ######

###### 返回说明 ######

正确的返回：

`{  "access_token":"ACCESS_TOKEN",  "expires_in":7200,  "refresh_token":"REFRESH_TOKEN", "openid":"OPENID",  "scope":"SCOPE"  }`

错误返回样例：

`{ "errcode":40029,"errmsg":"invalid code" }`

##### 刷新或续期access\_token使用 #####

###### 接口说明 ######

1.  1. 若access\_token已超时，那么进行refresh\_token会获取一个新的access\_token，新的超时时间；
2.  2.若access\_token未超时，那么进行refresh\_token不会改变access\_token，但超时时间会刷新，相当于续期access\_token。

refresh\_token拥有较长的有效期（30天），当refresh\_token失效的后，需要用户重新授权。

###### 请求方法 ######

使用/sns/oauth2/access\_token接口获取到的refresh\_token进行以下接口调用：

http请求方式: GET

https://api.weixin.qq.com/sns/oauth2/refresh\_token?appid=APPID&grant\_type=refresh\_token&refresh\_token=REFRESH\_TOKEN

###### 参数说明 ######

###### 返回说明 ######

正确的返回：

`{  "access_token":"ACCESS_TOKEN",  "expires_in":7200,  "refresh_token":"REFRESH_TOKEN",  "openid":"OPENID",  "scope":"SCOPE"  }`

错误返回样例：

`{ "errcode":40030,"errmsg":"invalid refresh_token" }`

###### 接口说明 ######

检验授权凭证（access\_token）是否有效

###### 请求说明 ######

http请求方式: GET

https://api.weixin.qq.com/sns/auth?access\_token=ACCESS\_TOKEN&openid=OPENID

###### 参数说明 ######

###### 返回说明 ######

正确的Json返回结果：

`{  "errcode":0,"errmsg":"ok" }`

错误的Json返回示例:

`{  "errcode":40003,"errmsg":"invalid openid" }`

##### 获取用户个人信息（UnionID机制） #####

###### 接口说明 ######

此接口用于获取用户个人信息。开发者可通过OpenID来获取用户基本信息。特别需要注意的是，如果开发者拥有多个移动应用、网站应用和公众帐号，

可通过获取用户基本信息中的unionid来区分用户的唯一性，因为只要是同一个微信开放平台帐号下的移动应用、网站应用和公众帐号，用户的unionid是唯一的。换句话说，同一用户，对同一个微信开放平台下的不同应用，unionid是相同的。

###### 请求说明 ######

http请求方式: GET

https://api.weixin.qq.com/sns/userinfo?access\_token=ACCESS\_TOKEN&openid=OPENID

###### 参数说明 ######

###### 返回说明 ######

正确的Json返回结果：

`{  "openid":"OPENID", "nickname":"NICKNAME", "sex":1, "province":"PROVINCE", "city":"CITY", "country":"COUNTRY", "headimgurl": "http://wx.qlogo.cn/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/0", "privilege":[ "PRIVILEGE1",  "PRIVILEGE2" ], "unionid": " o6_bmasdasdsad6_2sgVt7hMZOPfL" }`

<table style="margin:0px auto;padding:0px;border-spacing:0px;border:1px solid #C0C0C0;"> 
 <thead style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">参数</th> 
   <th style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">说明</th> 
  </tr> 
 </thead> 
 <tbody style="margin:0px;padding:0px;"> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">openid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户的标识，对当前开发者帐号唯一</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">nickname</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户昵称</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">sex</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户性别，1为男性，2为女性</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">province</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户个人资料填写的省份</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">city</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">普通用户个人资料填写的城市</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">country</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">国家，如中国为CN</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">headimgurl</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户头像，最后一个数值代表正方形头像大小（有0、46、64、96、132数值可选，0代表640*640正方形头像），用户没有头像时该项为空</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">privilege</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户特权信息，json数组，如微信沃卡用户为（chinaunicom）</td> 
  </tr> 
  <tr style="margin:0px;padding:0px;"> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">unionid</td> 
   <td style="margin:0px;padding:3px;border-color:#C0C0C0;border-collapse:collapse;">用户统一标识。针对一个微信开放平台帐号下的应用，同一用户的unionid是唯一的。</td> 
  </tr> 
 </tbody> 
</table>

错误的Json返回示例:

`{  "errcode":40003,"errmsg":"invalid openid" }`

###### 调用频率限制 ######

### 第一步：填写服务器配置 ###

### 第二步：验证服务器地址的有效性 ###

### 第三步：依据接口文档实现业务逻辑 ###

用户向公众号发送消息时，公众号方收到的消息发送者是一个OpenID，是使用用户微信号加密后的结果，每个用户对每个公众号有一个唯一的OpenID。此外，由于开发者经常有需在多个平台（移动应用、网站、公众帐号）之间共通用户帐号，统一帐号体系的需求，微信开放平台（open.weixin.qq.com）提供了UnionID机制。开发者可通过OpenID来获取用户基本信息，而如果开发者拥有多个应用（移动应用、网站应用和公众帐号，公众帐号只有在被绑定到微信开放平台帐号下后，才会获取UnionID），可通过获取用户基本信息中的UnionID来区分用户的唯一性，

1.获取access\_token

公众号可以使用AppID和AppSecret调用本接口来获取access\_token;

接口调用：[https://api.weixin.qq.com/cgi-bin/token?grant\_type=client\_credential&appid=APPID&secret=APPSECRET][https_api.weixin.qq.com_cgi-bin_token_grant_type_client_credential_appid_APPID_secret_APPSECRET]

2.获知微信服务器的IP地址列表：[https://api.weixin.qq.com/cgi-bin/getcallbackip?access\_token=ACCESS\_TOKEN][https_api.weixin.qq.com_cgi-bin_getcallbackip_access_token_ACCESS_TOKEN]

自定义菜单

自定义菜单接口可实现多种类型按钮，如下：

1、click：点击推事件

用户点击click类型按钮后，微信服务器会通过消息接口推送消息类型为event 的结构给开发者（参考消息接口指南），并且带上按钮中开发者填写的key值，开发者可以通过自定义的key值与用户进行交互；  
  
2、view：跳转URL

用户点击view类型按钮后，微信客户端将会打开开发者在按钮中填写的网页URL，可与网页授权获取用户基本信息接口结合，获得用户基本信息。  
  
3、scancode\_push：扫码推事件

4、scancode\_waitmsg：扫码推事件且弹出“消息接收中”提示框  
  
5、pic\_sysphoto：弹出系统拍照发图

6、pic\_photo\_or\_album：弹出拍照或者相册发图  
7、pic\_weixin：弹出微信相册发图器

8、location\_select：弹出地理位置选择器

9、media\_id：下发消息（除文本消息）

10、view\_limited：跳转图文消息URL

请注意，3到8的所有事件，仅支持微信iPhone5.4.1以上版本，和Android5.4以上版本的微信用户，旧版本微信用户点击后将没有回应，开发者也不能正常接收到事件推送。9和10，是专门给第三方平台旗下未微信认证（具体而言，是资质认证未通过）的订阅号准备的事件类型，它们是没有事件推送的，能力相对受限，其他类型的公众号不必使用。

# #

微信网页授权 如果用户在微信客户端中访问第三方网页，公众号可以通过微信网页授权机制，来获取用户基本信息，进而实现业务逻辑。
    1.到公众平台官网中的开发者中心页配置授权回调域名

snsapi_base 只获取到用户的openid

snsapi_userinfo 用来获取用户的基本信息
    
    关于网页授权access_token和普通access_token的区别

1、微信网页授权是通过OAuth2.0机制实现的，在用户授权给公众号后，公众号可以获取到一个网页授权特有的接口调用凭证（网页授权access_token），通过网页授权access_token可以进行授权后接口调用，如获取用户基本信息；
    2、其他微信接口，需要通过基础支持中的“获取access_token”接口来获取到的普通access_token调用。

网页授权获取用户基本信息也遵循UnionID机制，可通过获取用户基本信息中的unionid来区分用户的唯一性

具体而言，网页授权流程分为四步：

*   *  [1 第一步：用户同意授权，获取code][1_code]
     *  [2 第二步：通过code换取网页授权access\_token][2_code_access_token]
     *  [3 第三步：刷新access\_token（如果需要）][3_access_token]
     *  [4 第四步：拉取用户信息(需scope为 snsapi\_userinfo)][4_scope_ snsapi_userinfo]
     *  [5 附：检验授权凭证（access\_token）是否有效][5_access_token]

微信网页授权自我总结：

首先打开OAuth 配置；确定Scopes是snsapi\_base还是snsapi\_userinfo？

1、以snsapi_base为scope发起的网页授权，是用来获取进入页面的用户的openid的，并且是静默授权并自动跳转到回调页的。用户感知的就是直接进入了回调页（往往是业务页面）
    2、以snsapi_userinfo为scope发起的网页授权，是用来获取用户的基本信息的。但这种授权需要用户手动同意，并且由于用户同意过，所以无须关注，就可在授权后获取该用户的基本信息。

然后可通过

$wechat = app('wechat');
    $oauth = $wechat->oauth;
    $wechat_user = $oauth->user();
    实例来获取用户信息；从中拿去到对应微信的openid;
    亦或者也可通过微信公众平台文档中的接口逐步获取code,access_token等
    
    如果需要微信授权登录的情况下，获取到用户的信息之后可继续逻辑操作。比如：判断用户如果有登录过就直接跳转到网站首页或者个人中心；若未登录需授权登录方可继续下一步操作。

微信JS-SDK说明文档 微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力，同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力，为微信用户提供更优质的网页体验。

### JSSDK使用步骤 ###

#### 步骤一：绑定域名 ####

#### 步骤二：引入JS文件 ####

#### 步骤三：通过config接口注入权限验证配置 ####

#### 步骤四：通过ready接口处理成功验证 ####

所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。

### 判断当前客户端版本是否支持指定JS接口 ###

wx.checkJsApi({
        jsApiList: ['chooseImage'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
        success: function(res) {
            // 以键值对的形式返回，可用的api值true，不可用为false
            // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
        }
    });

### 获取“分享给朋友”按钮点击状态及自定义分享内容接口 ###

wx.onMenuShareAppMessage({
        title: '', // 分享标题
        desc: '', // 分享描述
        link: '', // 分享链接
        imgUrl: '', // 分享图标
        type: '', // 分享类型,music、video或link，不填默认为link
        dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
        success: function () { 
            // 用户确认分享后执行的回调函数
        },
        cancel: function () { 
            // 用户取消分享后执行的回调函数
        }
    });
    
    相关例子：

![1087656-20170209141922276-33666270.png][]

![1087656-20170209141933869-170800289.png][]

开发公众号需要用到微信公众平台的服务号，不能是订阅号；因为订阅号可能会对一些权限有限制；从而不能使用到安正超给我们提供的laravel-wechat当中的一些方法和package.

在开发公众号之前我们需要在公众平台的基本配置里面拿到AppId、AppSecret、URL、Token、AESkey.

1.安装包文件：composer require "overtrue/laravel-wechat:~3.0"

2.配置：

（1）注册 `ServiceProvider`:

Overtrue\\LaravelWechat\\ServiceProvider::class,

（2）添加外观到 `config/app.php` 中的 `aliases` 部分:

'EasyWeChat' => Overtrue\LaravelWechat\Facade::class,

（3）创建配置文件：

php artisan vendor:publish

创建成功之后进入到config/wehcat.php文件当中找到appid,secret,token;然后在.env文件中进行配置

然后创建路由：

Route::any('/wechat', 'WechatController@serve');

这里用到any请求的原因是因为是通过get请求验证的，但后面发送消息是通过post请求发送的。

创建控制器WechatController：

<?php namespace App\Http\Controllers; use Log; class WechatController extends Controller { /** * 处理微信的请求消息 * * @return string */ public function serve() { Log::info('request arrived.'); # 注意：Log 为 Laravel 组件，所以它记的日志去 Laravel 日志看，而不是 EasyWeChat 日志 $wechat = app('wechat'); $wechat->server->setMessageHandler(function($message){ return "欢迎关注 overtrue！"; }); Log::info('return response.'); return $wechat->server->serve();//这一句是对微信进行了验证 } } 最后把这一段代码publish到与服务器同步，再对之前公众平台的基本配置进行提交，提交成功之后在接口权限中的网页授权获取用户信息处点击修改；把相对应的域名放上去，如果没有放上去，它的权限也就获取不到。

红包接口调用：

在使用红包请求功能的时候，注意mch\_billno（商户订单号）这个参数；

商户订单号（每个订单号必须唯一）

组成： mch\_id+yyyymmdd+10位一天内不能重复的数字。

微信支付：

用easywechat来开发[微信][Link 2]支付功能，步骤如下：

一，需要有一个商品下单页面，页面上有你的商品的信息，还要有购买数量，和一个购买按钮。

用户在这个页面浏览商品信息的时候，可以选择购买的数量，然后点击提交进入下一个页面。

（这个页面，跟淘宝的商品购买页面一样。）

二，创建一个页面，接收上面一步提交来的数据，然后做如下计算 。

1，根据商品ID或是提交来的商品信息，生成商品的参数数组。

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  $product = \[  
2.      'trade\_type'       => 'JSAPI', // 微信公众号支付填JSAPI  
3.      'body'             => '一盒火柴',  
4.      'detail'           => '一盒火柴',  
5.      'out\_trade\_no'     => 'MYERPORDERID12345678', // 这是自己ERP系统里的订单ID，不重复就行。  
6.      'total\_fee'        => 8888, // 金额，这里的8888分人民币。单位只能是分。  
7.      'notify\_url'       => 'http://www.xxx.com/order\_notify', // 支付结果通知网址，如果不设置则会使用配置里的默认地址  (填写发起支付请求的网址)
8.      'openid'           => 'you-open-id', // 这个不能少，少了要报错。  
9.      // ...  基本上这些参数就够了，或者参考微信文档自行添加删除。  
10. \];

2，接下来，生成商品对象。

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  $order = **new Order($product);  **

3，再接下来，要进行调用前计算了。

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  $app = **new Application(config('wechat'));  **
2.  $payment = $app->payment;  
3.  //统一下单（像公众号支付、扫码支付、APP支付都使用这个接口）
4.  $result = $payment->prepare($order); // 这里的order是上面一步得来的。 这个prepare()帮你计算了校验码，帮你获取了prepareId.省心。
5.  //刷卡支付使用下面这个接口：
6.  //$result = $payment->pay($order);
7.  $prepayId = null;  
8.  **if ($result->return\_code == 'SUCCESS' && $result->result\_code == 'SUCCESS')\{  **
9.      $prepayId = $result->prepay\_id; // 这个很重要。有了这个才能调用支付。  
10. \} **else \{  **
11.     var\_dump($result);  
12.     **die("出错了。");  // 出错就说出来，不然还能怎样？  **
13. \}  
14. $config = $payment->configForJSSDKPayment($prepayId); // 这个方法是取得js里支付所必须的参数用的。 没这个啥也做不了，除非你自己把js的参数生成一遍

4，就快进入正题，但是，还没完。还要取得一个数据。

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  $app = **new Application(config('wechat'));  **
2.  $js = $app->js;  // 这个是jssdk里页面上需要用到的js参数信息。

5，上面获得的$js 和 $config数据，要在页面里显示出来。

注意，上面几步都不涉及显示，只是在生成页面显示所需要的数据。

现在才需要把这些显示在页面上。

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript" charset="utf-8"></script>  
2.  1.  <script type="text/javascript" charset="utf-8">  
    2.      wx.config(\{ \{ $js->config(**array('chooseWXPay')) \}\});  **
    3.  </script>
3.  <script>  
4.      $(**function()\{  **
5.    
6.          $(".btn-do-it").click(**function()\{  **
7.              wx.chooseWXPay(\{  
8.                  timestamp: "\{ \{$config\['timestamp'\]\}\}", // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符  
9.                  nonceStr: '\{ \{$config\['nonceStr'\]\}\}', // 支付签名随机串，不长于 32 位  
10.                 package: '\{ \{$config\['package'\]\}\}', // 统一支付接口返回的prepay\_id参数值，提交格式如：prepay\_id=\*\*\*）  
11.                 signType: '\{ \{$config\['signType'\]\}\}', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'  
12.                 paySign: '\{ \{$config\['paySign'\]\}\}', // 支付签名  
13.                 success: **function (res) \{  **
14.                     // 支付成功后的回调函数  
15.                     **if(res.err\_msg == "get\_brand\_wcpay\_request：ok" ) \{  **
16.                         alert('支付成功。');  
17.                         window.location.href="\{ \{url("wechat/pay\_ok")\}\}";  
18.                     \}**else\{  **
19.                         //alert(res.errMsg);  
20.                         alert("支付失败，请返回重试。");  
21.                     \}  
22.                 \},  
23.                 fail: **function (res) \{  **
24.                     alert("支付失败，请返回重试。");  
25.                 \}  
26.             \});  
27.         \});  
28.     \});  
29. </script>

没错，只需要修改这些。

再来理一个，第二步里，这个页面需要显示一个确认信息，比如商品的名称，和支付的总金额。

页面上应该有一个按钮，用来触发支付（.btn-do-it）。

页面里的js就是第5步里要显示的内容。

总结:

第一步，商品信息页面，用户选择购买数据，点购买，提交到第二步的确认页面。

第二步的确认页面，根据商品信息，和微信配置信息，生成必要的支付数据，并显示购买确认信息，和一个支付按钮，

用户点击支付按钮，发起支付。

支付完成，提示用户，或转到相应页面。

微信的开发团队提醒我们，请以微信的推送信息为准来处理订单，不然有可能人财两空。

product.html

\[html\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  <!DOCTYPE html>  
2.  <html lang="en">  
3.  <head>  
4.      <meta charset="UTF-8">  
5.      <title>一盒火柴</title>  
6.  </head>  
7.  <body>  
8.    
9.  <h1>一盒火柴</h1>  
10.   
11. <div>  
12.     卖火柴的小女孩，手里有一堆火柴。  
13. </div>  
14.   
15. <hr>  
16.   
17. <div>  
18.     <form name="form1" action="payment.php" method="post">  
19.         <lable>数量：</lable>  
20.         <input name="qty" value="1" />  
21.         <input name="submit" type="submit" value="购买" />  
22.     </form>  
23. </div>  
24.   
25. </body>  
26. </html>

payment.php

\[php\]  [view plain][]  [copy][view plain]

[![在CODE上查看代码片][CODE]][CODE_CODE][![派生到我的代码片][ico_fork.svg]][ico_fork.svg 1]

1.  <?php  
2.  **use EasyWeChat\\Foundation\\Application;  **
3.  **use EasyWeChat\\Payment\\Order;  **
4.    
5.  $product = \[  
6.      'body'             => '一盒火柴',  
7.      'trade\_type'       => 'JSAPI',  
8.      'out\_trade\_no'     => 'ERP'.time(),  
9.      'total\_fee'        => 1,  
10.     'notify\_url'       => 'http://test.xxoo.com/wechat/notify/',  
11.     'openid'           => $\_SESSION\['openid'\],  
12.     'attach'           => '卖火柴的小女孩',  
13. \];  
14.   
15. $order = **new Order($product);  **
16.   
17. $app = **new Application(config('wechat'));  **
18. $js = $app->js;  
19. $payment = $app->payment;  
20. $result = $payment->prepare($order);  
21. $prepayId = null;  
22. **if ($result->return\_code == 'SUCCESS' && $result->result\_code == 'SUCCESS')\{  **
23.     $prepayId = $result->prepay\_id;  
24. \} **else \{  **
25.     var\_dump($result);  
26.     **die("出错了。");  **
27. \}  
28. $config = $payment->configForJSSDKPayment($prepayId);  
29. ?>  
30. <!DOCTYPE html>  
31. <html lang="en">  
32. <head>  
33.     <meta charset="UTF-8">  
34.     <title>购买支付</title>  
35. </head>  
36. <body>  
37.   
38. <h1>一盒火柴</h1>  
39.   
40. <div>  
41.     <p>您购买了“一盒火柴”，总价格： 0.01元。</p>  
42.     <p>数量：1盒。</p>  
43. </div>  
44.   
45. <hr>  
46.   
47. <div>  
48.     <input name="button" id="btnPay" type="button" value="支付" />  
49. </div>  
50.   
51.   
52.   
53.   
54. <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" type="text/javascript" charset="utf-8"></script>  
55. <script type="text/javascript" charset="utf-8">  
56.     wx.config(\{ \{ $js->config(**array('chooseWXPay')) \}\});  **
57. </script>  
58. <script>  
59.     $(**function()\{  **
60.   
61.         $(".btn-do-it").click(**function()\{  **
62.             wx.chooseWXPay(\{  
63.                 timestamp: "\{ \{$config\['timestamp'\]\}\}", // 支付签名时间戳，注意微信jssdk中的所有使用timestamp字段均为小写。但最新版的支付后台生成签名使用的timeStamp字段名需大写其中的S字符  
64.                 nonceStr: '\{ \{$config\['nonceStr'\]\}\}', // 支付签名随机串，不长于 32 位  
65.                 package: '\{ \{$config\['package'\]\}\}', // 统一支付接口返回的prepay\_id参数值，提交格式如：prepay\_id=\*\*\*）  
66.                 signType: '\{ \{$config\['signType'\]\}\}', // 签名方式，默认为'SHA1'，使用新版支付需传入'MD5'  
67.                 paySign: '\{ \{$config\['paySign'\]\}\}', // 支付签名  
68.                 success: **function (res) \{  **
69.                     // 支付成功后的回调函数  
70.                     **if(res.err\_msg == "get\_brand\_wcpay\_request：ok" ) \{  **
71.                         alert('支付成功。');  
72.                         window.location.href="\{ \{url("wechat/pay\_ok")\}\}";  
73.                     \}**else\{  **
74.                         //alert(res.errMsg);  
75.                         alert("支付失败，请返回重试。");  
76.                     \}  
77.                 \},  
78.                 fail: **function (res) \{  **
79.                     alert("支付失败，请返回重试。");  
80.                 \}  
81.             \});  
82.         \});  
83.     \});  
84. </script>  
85. </body>  
86. </html>

这些是伪代码，payment.php并没有对product.html传来的商品信息做处理。

其实只要看payment.php文件应该知道怎么做了。

其它就两点。a，获取$config，b， 自己写wx.chooseWXPay。

其它的看easywechat文档就行了。

[802779-20161011222713453-989228801.png]: /images/20220530/d48f5089e53d4438a3b3e3f871717245.png
[copycode.gif]: /images/20220530/e38d0f015a984e7e8d5b351b31041d4b.png
[802779-20161011222931875-1145390638.png]: /images/20220530/874ec4f7c0de47979f6158e9cabb6123.png
[802779-20161011223228406-486921276.png]: /images/20220530/db9aa26c559c4a88815f107160c579da.png
[802779-20161011223615125-2074577399.png]: /images/20220530/c616fa7927714cdd80da9d2a51c6f57b.png
[https_passport.yhd.com_wechat_callback.do_code_CODE_state_3d6be0a4035d839573b04816624a415e]: https://passport.yhd.com/wechat/callback.do?code=CODE&state=3d6be0a4035d839573b04816624a415e
[802779-20161011225103062-1798020810.png]: /images/20220530/d00738606c2c43e2a55f9c73e8b86350.png
[https_open.weixin.qq.com_cgi-bin_showdocument_action_dir_list_t_resource_res_list_verify_1_lang_zh_CN]: https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&lang=zh_CN
[http_www.cnblogs.com_0201zcr_p_5131602.html]: http://www.cnblogs.com/0201zcr/p/5131602.html
[https_open.weixin.qq.com]: https://open.weixin.qq.com/
[731178-20160115131041991-1058874094.png]: /images/20220530/60e5b50ec9c74087b80264684c528bf5.png
[731178-20160115131108803-1188358406.png]: /images/20220530/418a50ec76e7431c95545a41438509b6.png
[731178-20160115131632616-547932195.png]: /images/20220530/77afd24052014c9f899f4a93c7b7b81e.png
[731178-20160115131729288-457434641.png]: /images/20220530/fe88b16b906d41c7a437aa5e74e22267.png
[731178-20160115132145897-758264873.png]: /images/20220530/5de611fc22a24d13b436cf935fc2e370.png
[731178-20160116103317257-2080473155.png]: /images/20220530/9d35b04ec98546b2a9bdd25f5819cc61.png
[copycode.gif 1]: /images/20220530/225c3788764448a1b4d659930c34d978.png
[731178-20160116104851882-1088738021.jpg]: /images/20220530/27129e655aa24aad912e18fa0c7c72d7.png
[OAuth2.0]: http://oauth.net/2/
[1087656-20170104191743972-218803961.png]: /images/20220530/dffd6346f2b946538097bd610f3fa34b.png
[https_open.weixin.qq.com_connect_qrconnect_appid_APPID_redirect_uri_REDIRECT_URI_response_type_code_scope_SCOPE_state_STATE_wechat_redirect]: https://open.weixin.qq.com/connect/qrconnect?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect
[https_passport.yhd.com_wechat_login.do]: https://passport.yhd.com/wechat/login.do
[https_open.weixin.qq.com_connect_qrconnect_appid_wxbdc5610cc59c1631_redirect_uri_https_3A_2F_2Fpassport.yhd.com_2Fwechat_2Fcallback.do_response_type_code_scope_snsapi_login_state_3d6be0a4035d839573b04816624a415e_wechat_redirect]: https://open.weixin.qq.com/connect/qrconnect?appid=wxbdc5610cc59c1631&redirect_uri=https%3A%2F%2Fpassport.yhd.com%2Fwechat%2Fcallback.do&response_type=code&scope=snsapi_login&state=3d6be0a4035d839573b04816624a415e#wechat_redirect
[Link 1]: https://open.weixin.qq.com/cgi-bin/showdocument?action=dir_list&t=resource/res_list&verify=1&id=open1419316518&lang=zh_CN
[1087656-20170104192242659-1489160886.png]: https://images2015.cnblogs.com/blog/1087656/201701/1087656-20170104192242659-1489160886.png
[1087656-20170104192248769-1801161916.png]: /images/20220530/f941d0c05df94de1a2fa191881c9be13.png
[1087656-20170104192435769-79869042.png]: https://images2015.cnblogs.com/blog/1087656/201701/1087656-20170104192435769-79869042.png
[1087656-20170104192440487-1578475330.png]: /images/20220530/6d530a8e5be3442db4da066dd1e3f2b8.png
[1087656-20170104192539909-1538949616.png]: https://images2015.cnblogs.com/blog/1087656/201701/1087656-20170104192539909-1538949616.png
[1087656-20170104192545206-545349429.png]: /images/20220530/424b5ec3037249bf8c5c27c4c8262948.png
[https_api.weixin.qq.com_cgi-bin_token_grant_type_client_credential_appid_APPID_secret_APPSECRET]: https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
[https_api.weixin.qq.com_cgi-bin_getcallbackip_access_token_ACCESS_TOKEN]: https://api.weixin.qq.com/cgi-bin/getcallbackip?access_token=ACCESS_TOKEN
[1_code]: https://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html#.E7.AC.AC.E4.B8.80.E6.AD.A5.EF.BC.9A.E7.94.A8.E6.88.B7.E5.90.8C.E6.84.8F.E6.8E.88.E6.9D.83.EF.BC.8C.E8.8E.B7.E5.8F.96code
[2_code_access_token]: https://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html#.E7.AC.AC.E4.BA.8C.E6.AD.A5.EF.BC.9A.E9.80.9A.E8.BF.87code.E6.8D.A2.E5.8F.96.E7.BD.91.E9.A1.B5.E6.8E.88.E6.9D.83access_token
[3_access_token]: https://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html#.E7.AC.AC.E4.B8.89.E6.AD.A5.EF.BC.9A.E5.88.B7.E6.96.B0access_token.EF.BC.88.E5.A6.82.E6.9E.9C.E9.9C.80.E8.A6.81.EF.BC.89
[4_scope_ snsapi_userinfo]: https://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html#.E7.AC.AC.E5.9B.9B.E6.AD.A5.EF.BC.9A.E6.8B.89.E5.8F.96.E7.94.A8.E6.88.B7.E4.BF.A1.E6.81.AF.28.E9.9C.80scope.E4.B8.BA_snsapi_userinfo.29
[5_access_token]: https://mp.weixin.qq.com/wiki/4/9ac2e7b1f1d22e9e57260f6553822520.html#.E9.99.84.EF.BC.9A.E6.A3.80.E9.AA.8C.E6.8E.88.E6.9D.83.E5.87.AD.E8.AF.81.EF.BC.88access_token.EF.BC.89.E6.98.AF.E5.90.A6.E6.9C.89.E6.95.88
[1087656-20170209141922276-33666270.png]: /images/20220530/52d969e85934452dadd7f4570b2cf8b9.png
[1087656-20170209141933869-170800289.png]: /images/20220530/fff0c98687264b8b96b1f795ae599d47.png
[Link 2]: http://lib.csdn.net/base/5
[view plain]: http://blog.csdn.net/hooloo/article/details/52171733#
[CODE]: https://code.csdn.net/assets/CODE_ico.png
[CODE_CODE]: https://code.csdn.net/snippets/1821109
[ico_fork.svg]: https://code.csdn.net/assets/ico_fork.svg
[ico_fork.svg 1]: https://code.csdn.net/snippets/1821109/fork