使用qq登录第三方软件（网站应用接入QQ登录）

1.网站接入QQ登录的好处，我来为大家讲解一下关于使用qq登录第三方软件?跟着小编一起来看一看吧!

使用qq登录第三方软件

1.网站接入QQ登录的好处

QQ登录使网站可以免除注册的流程，并充分利用庞大的QQ用户群来实现快速传播；网站接入QQ登录后，用户只需要使用手机扫码就可登录，简化用户注册流程，更有效率的提高转化用户流量。

2.网站接入QQ登录之前需要申请

网站接入QQ登录之前，我们是以瓴码官网http://www.zeropaas.com申请并获得对应的appid与appkey，以保证后续流程中可正确对网站与用户进行验证与授权。

3.瓴码官网http://www.zeropaas.com前端增加相关代码

let nowUrl = location.href; let result = /code=(\w*)&state=([0-9]*)/.exec(nowUrl); if(result){ window.parent.postMessage(nowUrl,'*'); }

4.网站前端打开QQ登录授权页面

!function () { const state = Number(new Date()).toString(); window.sessionStorage.setItem('state', state) const appid = "101886199" const redirect_uri = "http://www.zeropaas.com/QQLogin" const url = "http://graph.qq.com/oauth2.0/authorize?response_type=code&client_id=" appid "&redirect_uri=" redirect_uri "&state=" state; window.open(url, '', 'width=750,height=450') }()

5.网站前端QQ登录授权成功之后的处理

window.onmessage = (e)=> { const codeObj = e.data let oldState = window.sessionStorage.getItem('state'); let newState = codeObj.state; if(oldState === newState){ thirdLogin(1,codeObj.code,1,$this.sessionID,0,null) //向云端发送第三登录事件,code是QQ登录码 if ($lm_para.$result [0] === null) { $this.$router.push('/') //QQ登录成功，并且不要绑定手机号 } else { $this.Openid = result[0] //QQ登录成功，并且不要绑定手机号 $this.compShow('bindingPhone') } } window.onmessage = null },

6.网站云端获取QQopenid和access_token

function getOpenid_QQ(appid, appSecret,code, successCB, errorCB) { const request = require(global.nodePath "/node_modules/request"); const redirectURI = require('/qqConfig').getRedirectUrl(); let url_1 = " http://graph.qq.com/oauth2.0/token? grant_type=authorization_code&client_id=" appid "&client_secret=" appSecret "&redirect_uri=" encodeURIComponent(redirectURI) "&code=" code; request.get( { url: url1, method: "GET", json: true, headers: { "Content-type": "application/JSON", }, }, function (error, response, body) { if (response.statusCode == 200) { let data = JSON.stringify(body, null, 4); let data1 = (JSON.parse(data)); let access_token = data1.access_token; request.get({ url: "http://graph.qq.com/oauth2.0/me?access_token=" access_token }, function (error, response, body) { if (response.statusCode == 200) { var userinfo = JSON.parse(body); let openid = userinfo.openid; success(access_token,openid); } else { console.log('获取openid失败！', response.statusCode); } } ); let openid = data1.openid; successCB(access_token, openid); } else { errorCB(['获取access_token失败！状态码：' response.statusCode]); } } );

7.微信登录和QQ登录的区别

内嵌不同

微信登录可以内嵌网站登录页面，也可以打开微信登录授权页面，QQ登录不可以内嵌网站登录授权页面，必须打开QQ登录授权页面，如果是打开微信或QQ登录授权页面，则登录授权成功后必须关闭该页面。

回调地址要求不同

微信登录回调地址可以指定一级根目录或二级子目录，比如"http://zeropaas.com "或"http://zeropaas.com/wxLogin"，QQ登录回调地址必须指定二级子目录，比如"http://zeropaas.com/qqLogin"