【QQ官网在线进入流程 网页qq登录界面在哪里】说明
- 本文中所说的QQ登录功能,是采用官方的OAuth2.0来实现的,这样有更多的自主权 。另一种较为简单的JS-SDK开发方式,虽然非常简便 , 但自主性不够,所以没有采用 。
- 下文中所构造的URL,均使用了JavaScript的ES6语法 。
先登录QQ互联官网,登录时所用的QQ号会和相关信息绑定 , 这一点要注意 。
登录之后点击顶部导航栏右侧自己的QQ头像,进入开发者的注册/认证界面 。
这里可以选择以“公司”或“个人”的身份注册为开发者 。自己最开始用的是公司的相关资料来注册的,但总是提示审核失败 , 却又不说为什么失败,最后干脆用个人信息注册,很快就成功了 。
PS:不知道用个人信息注册为开发者的话 , 权限方面会不会有什么限制 。微信公众平台对个人开发者是有限制的 , 个人身份注册的公众号无法认证,公众平台的部分权限也无法调用 。
创建网站应用
要想让网站能够使用QQ登录功能,就必须先在QQ互联中创建网站应用 。
在QQ互联网站顶部导航栏上 , 点击应用管理 。点击页面中的网站应用这个标签,再点击创建应用,按照要求填写相关的信息即可 。
注意这里需要填写两个 URL,一个是网站地址,也就是需要让用户能够通过QQ登录的网站 。另一个是网站回调域,则是用户发起QQ登录请求之后 , 负责与腾讯服务器通讯,实现QQ登录功能的URL , 这两个URL要注意区分 。
所创建的网站应用审核通过之后,点击查看按钮 , 在网站应用的详情界面,能看到为这个网站分配的APP ID和APP Key,后面实现QQ登录功能的时候要用到 。
另外,还能看到审核通过的网站应用,有两个可用的应用接口,第一个登录默认是开启的,第二个unionid需要手动开启,这里先把它开启了,后面说不定就用上了 。
流程概述
接下来就需要编写代码,实现QQ登录功能了 。这里先简要说明一下整体流程:
- 按照要求访问指定网址,会显示QQ登录界面,选择QQ账号进行登录之后,会向之前所填写的 网站回调域 发起回调,回调URL中包含Authorization Code(授权码) 。
- 网站回调域 用这个Authorization Code(授权码) , 结合其它数据,向指定的地址发送请求,接收到的响应中包含Access Token(访问令牌) 。
- 网站回调域 再用Access Token(访问令牌) 向指定的地址发送请求,接收到的响应中包含所登录QQ账号的 OpenID(不涉及用户隐私) 。
- 网站回调域 拿到用户的OpenID之后 , 结合前面获取到的Access Token以及其它数据,就可以调用QQ的接口 , 实现特定的功能了 。比如可以调用get_user_info接口,获取登录用户的昵称、头像、性别 , 用来显示在前端页面中 。
在自己编写的登录页面,点击QQ图标之后,请求下面的地址:
https://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=${appId}&redirect_uri=${redirectUrl}&state=${state}&scope=${scope}上面的地址中,appId为网站应用的APP ID,redirectUrl为网站应用的网站回调域,state为用户自定义的字符串 , scope为向用户所请求的授权列表 。
scope之外的参数均为必填项,scope如果不写,则默认只请求对接口get_user_info进行授权 , 获取用户最基本的几项信息:QQ昵称、QQ头像、性别 。
发起请求之后,会将用户导向到QQ官方的登录页面,用户在这个页面上选择需要登录的QQ号,点击“登录”,网站回调域就会收到的腾讯服务器所发起的回调 。
比如之前所填写的 网站回调域 为 a.com/api/getauthcode 的话,腾讯服务器就会向 网站回调域 发送如下请求:
GET /getauthcode?code=F91C6110********在上面接收到的这个请求中,URL查询字符串里,code= 后面的字符串,就是腾讯服务器发来的Authorization Code 。
二、获取Access Token
拿到Authorization Code,结合其它数据 , 请求如下地址:
https://graph.qq.com/oauth2.0/token?grant_type=authorization_code&client_id=${appId}&client_secret=${appKey}&code=${authCode}&state=${state}&redirect_uri=${redirectUrl}网站回调域 会收到如下响应:
access_token=FF3A****&expires_in=7776000&refresh_token=2516****其中就包含了Access Token,并且这个Access Token有90天的有效期 , 但并不会按照官方文档所说的,用户再次登录时自动刷新,而是短时间(一天内)连续多次登录都不会刷新 。
对于这个Access Token , 官网建议开发者将其进行保存,以便后续调用OpenAPI访问和修改用户信息时使用 。
三、获取OpenID
有了Access Token之后 , 就可以用它来获取当前所登录QQ账号的OpenID了 。请求如下地址:
https://graph.qq.com/oauth2.0/me?access_token=${accessToken}网站回调域 会收到如下响应:
callback( {"client_id":"appId","openid":"openId"} );上面的响应中包含了 APP ID 和 OpenID,APP ID 可用来确认是否为合法的网站请求,OpenID 自然就是所登录QQ账号的 OpenID 了 。
四、调用接口访问数据
有了第二步获取到的获取Access Token,和第三步获取到的OpenID,就可以拿来访问QQ的接口,获取用户的相关信息了 。
比如以下面的方式请求 get_user_info 接口,就能够获取到用户昵称、QQ头像等信息 。
https://graph.qq.com/user/get_user_info?access_token=${accessToken}&oauth_consumer_key=${appId}&openid=${openId}
以上关于本文的内容,仅作参考!温馨提示:如遇健康、疾病相关的问题,请您及时就医或请专业人士给予相关指导!
「爱刨根生活网」www.aipaogen.com小编还为您精选了以下内容,希望对您有所帮助:- 有哪些优质翻译软件 百度翻译在线翻译
- 如何在中国移动官网查询手机移动卡PUK码并解锁
- 提升人像魅力的秘密武器:美图秀秀在线版腮红功能
- 这将会是LV今年最受欢迎的男款包 lv中国官网
- 如何在电脑版QQ兴趣部落中进入
- 如何使用360安全卫士进入系统输入法入口
- 如何设置幻灯片切换效果从上方进入
- 提升网页设计效果:在线PS套索工具调出滤镜库的新技巧
- 如何查看钉钉在线课堂数据
- 如何利用亿图在线快速绘制高效因果图
