huangchucai/My-Note-Blog

OAuth2.0理解和实战

Opened this issue · 0 comments

huangchucai commented

OAuth2.0理解

需求来源分析：当我们在自己开发的网站中，需要让用户可以通过第三方登录，我们肯定想让用户直接用第三方的账号和密码在我们自己的登录页面登录，然后让第三方服务器来返回用户的个人数据。但是这样第三方服务器肯定觉得这样不安全，凭什么我的用户的账号和密码要给你，并且还给你用户数据，那你保存起来，那就是盗取了我的用户资料，干一些羞羞的事情怎么搞？

在这样的一个背景下，就需要一种授权标准孕育而生，让开发网站者可以在不使用账号密码的情况下，通过一个令牌来获取第三方服务器的个人数据。

原理

OAuth2.0通过一个中间的授权机制，来满足需求。

  1. 第三方客户端(自己开发的网站)发送授权请求给用户。
  2. 用户点击同意授权。
  3. 客户端通过上一步获得的授权，去向认证服务器获取令牌。
  4. 认证服务器根据判定授权，确定无误后，返回给客户端令牌。
  5. 客户端利用令牌向第三方服务器发送请求。
  6. 第三方服务器确定令牌正确后，返回相应的资源。

微信公众号实战

前期工作

  1. 获取测试号

    测试号链接地址

  2. 申请了测试号后，可以获得appId和appsecret

  3. 在下面的体验接口权限表中，网页服务中的网页帐号点击修改配置我们之后的客户端（自己开发的网站）

OAuth2.0微信授权

  1. 在微信客户端点击https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

    appid: 对应第三方运用id,就是我们客户端对应的微信内部的一个id识别身份
redirect_uri： 授权回调页面
response_type： 回调方式，就是回调返回的参数
scope： 权限，想要获取的东西
state: 会被带到回调网址中的参数
wechat_redirect：微信要求的hash值

  2. 在微信开发者工具中获取对应的返回参数

    1. 假如我们在前期工作中的第三步中配置的是 http://huangchucai.cn  这个域名
2. 在网址中输入我们刚刚申请的appId和配置的域名（对域名encodeURIComponent()）
https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx4ca7b1cbfbf9c3c7&redirect_uri=http%3A%2F%2Fhuangchucai.cn%2F&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect
3. 就会跳转到微信的页面，弹出一个确认登录的界面
4. 我们确认登录后，就会跳回http://huangchucai.cn，并携带2个参数
   // http://huangchucai.cn/?code=0814V09f1q09tt0XrWaf1qZM8f14V09R&state=STATE

test

  1. 我们看返回跳转的网址就有一个code和我们之前传入的state

    这里的code就相当于一个授权，通过code我们去拿取令牌access_token

  2. 通过code和appid和app_secret请求下面链接，获取access_token

    https://api.weixin.qq.com/sns/oauth2/access_token?appid=wx4ca7b1cbfbf9c3c7&secret=c3bdea770631b1ddd83d1659f2c20939&code=081ezO1U1itSl815tE3U1Cnw1U1ezO1x&grant_type=authorization_code 

//返回
{
    "access_token": "Urd3BeCglpTlG-ccz5M9yj93sgHK18QnZl7nrbW_I9PR5z2G0DhO0QMkf8c-vquNY9Q6ZnGqlfGNpIK_I9F10w",
    "expires_in": 7200,
    "refresh_token": "glXUWHWmqya-aYCp4UMdt6kzS2U02DRWCZgBo2UwyiOZF6zVc9l5SbMy0RNSSQHptd6VkdqtQXbdysbEVORidA",
    "openid": "oTsyG0RvdrIH8qcaCxtE7fLhPM8A",
    "scope": "snsapi_userinfo"
}

  3. 获取到access_token就像获取到令牌，通过access_token去微信服务器请求用户信息

     https://api.weixin.qq.com/sns/userinfo?access_token=Urd3BeCglpTlG-ccz5M9yj93sgHK18QnZl7nrbW_I9PR5z2G0DhO0QMkf8c-vquNY9Q6ZnGqlfGNpIK_I9F10w&openid=oTsyG0RvdrIH8qcaCxtE7fLhPM8A&lang=zh_CN 

// 返回
{
    "openid": "oTsyG0RvdrIH8qcaCxtE7fLhPM8A",
    "nickname": "MY.captain",
    "sex": 1,
    "language": "zh_CN",
    "city": "广州",
    "province": "广东",
    "country": "**",
  "headimgurl":"http://wx.qlogo.cn/mmopen/vi_32/f0r2J5U6aIVOnibNIglbFTb5HLo2PYtdneg2EWk5exlpCpErO2r4gl4Z9OcpQwYwEwUCvqln3gia5G5qQWs4R1wQ/0",
    "privilege": []
}

    ​