H5页面微信、QQ和微博的快捷登录

admin管理员组

文章数量:1558099

1、QQ的快捷登录：
https://graph.qq/oauth2.0/authorize?response_type=token&client_id=12345678&redirect_uri=http://www.pipihou/test/newShare.html&scope=get_user_info

a、请求成功后，会跳转到填写的回调地址，并在结尾处拼接上：#access_token=FE04************************CCE2&expires_in=7776000&state=test
access_token为获取的用户的access_token，expires_in为access_token的过期时间；
b、获取到用户的access_token后利用GET方式请求：
移动应用：https://graph.qq/oauth2.0/me
WAP网站：https://graph.z.qq/moc2/me
这两个接口，接口请求成功后会返回用户的openid：

c、获取到了用户的openid、access_token，以及开发者自己应用的appid，就可以请求qq的api获取用户的信息，以及进行一些其他操作；
提示：回调地址需要配置在腾讯开放平台上面（具体配置：https://wiki.open.qq/wiki/【QQ登录】回调地址常见问题及修改方法);
参考地址：https://wiki.open.qq/wiki/mobile/%E5%87%86%E5%A4%87%E5%B7%A5%E4%BD%9C

2、微信的快捷登录：
var redirectURL = ‘http://www.pipihou/test/newShare.html
‘https://open.weixin.qq/connect/oauth2/authorize?appid=wxd12345678945612&redirect_uri=’+encodeURIComponent(redirectURL)+’&response_type=code&scope=snsapi_base&state=123#wechat_redirect’;

回调地址一定要urlEncode处理，并且配置到公众号的管理后台！！（配置路径为：微信公众平台–开发–基本配置–公众号开发信息–IP白名单）；
a、请求成功后，会跳转到填写的回调地址，并在结尾处拼接上：?code=CODE&state=STATE。
code作为换取access_token的票据，每次用户授权带上的code将不一样，code只能使用一次，5分钟未被使用自动过期。
b、通过code换取网页授权access_token:通过get方式请求接口https://api.weixin.qq/sns/oauth2/access_token，具体的参数为：

请求成功后返回参数为：{ "access_token":"ACCESS_TOKEN", "expires_in":7200, "refresh_token":"REFRESH_TOKEN", "openid":"OPENID", "scope":"SCOPE" }

c、拉取用户信息(需scope为 snsapi_userinfo)：通过GET方式请求（请使用https协议） https://api.weixin.qq/sns/userinfo?access_token=ACCESS_TOKEN&openid=OPENID&lang=zh_CN 参数说明：

请求成功后会返回用户的基本信息：{ "openid":" OPENID", " nickname": NICKNAME, "sex":"1", "province":"PROVINCE" "city":"CITY", "country":"COUNTRY", "headimgurl": "http://thirdwx.qlogo/mmopen/g3MonUZtNHkdmzicIlibx6iaFqAc56vxLSUfpb6n5WKSYVY0ChQKkiaJSgQ1dZuTOgvLLrhJbERQQ4eMsv84eavHiaiceqxibJxCfHe/46", "privilege":[ "PRIVILEGE1" "PRIVILEGE2" ], "unionid": "o6_bmasdasdsad6_2sgVt7hMZOPfL" }

参考地址为：https://developers.weixin.qq/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html

3、微博的快捷登录：微博开放的各个接口

a、跳转这个地址：
https://api.weibo/oauth2/authorize?client_id=YOUR_CLIENT_ID&response_type=code&redirect_uri=YOUR_REGISTERED_REDIRECT_URI 当用户用户同意授权,页面跳转至 YOUR_REGISTERED_REDIRECT_URI/?code=CODE，就可以获取到用户的code；
回调地址一定要配置在微博的管理后台：
b、利用获取到的code去换用户的access_token：
https://api.weibo/oauth2/access_token?client_id=YOUR_CLIENT_ID&client_secret=YOUR_CLIENT_SECRET&grant_type=authorization_code&redirect_uri=YOUR_REGISTERED_REDIRECT_URI&code=CODE
这个接口会返回{ "access_token": "SlAV32hkKG", "remind_in": 3600, "expires_in": 3600 }，这样就获取到了用户的access_token；
c、利用access_token调用微博的api获得用户的个人信息和进行操作：

参考文档：https://open.weibo/wiki/Connect/login

本文标签： 快捷页面qq