uni开发的H5接入QQ登录
uni开发的H5接入QQ登录本以为网上应该有现成的答案,没想到啊,没个有用的,只能自己琢磨,阿西八!uni-H5接入QQ流程第一步:首先肯定要去QQ互联 申请开发者啦,然后注册,然后得到APPID,对,就是很基操的一套流程,这个就不多废话了第二步:uni的H5在没有Vue的那种index.html如何配置外链scirpt呢???解决办法:首先在目录创建个index.html,然后把https://
uni开发的H5接入QQ登录
本以为网上应该有现成的答案,没想到啊,没个有用的,只能自己琢磨,阿西八!
uni-H5接入QQ流程
第一步:首先肯定要去QQ互联 申请开发者啦,然后注册,然后得到APPID
,对,就是很基操的一套流程,这个就不多废话了
第二步:uni的H5在没有Vue的那种index.html如何配置外链scirpt呢???
解决办法
:
首先在目录创建个index.html,然后把
https://uniapp.dcloud.io/collocation/manifest?id=h5-template
官方的模板代码拿进来,直接拿就行,不用改动,否则可能会出现点稀奇古怪的毛病。
创建了index.html模板后,打开下图
这样就配置好了你的index.html
接着就是打开你的index.html把QQ互联的那个外链Script拿进来,具体代码在QQ互联文档上面有,地址是:QQ互联SDK文档
这里注意一下
:
data-appid:你申请的appid
data-redirecturl:登录成功后回调的地址(这个地址必须是别人可以访问到的地址,如果不会的话,可以找你们的后端协调一块整
)
到这一步你就已经成功引入QQ的互联了,接下来就是触发了,找到你要触发的点击事件
—— 注意!!!!
——
设置完这些模板后,一定要重启项目!一定要重启项目!一定要重启项目! 否则会出现QC未定义的错误!
登录成功后回调的页面可以卸下如下代码
created() {
if(QC.Login.check()){
console.log('已经登录')
QC.Login.getMe((openId, accessToken, ) => {
this.openId = openId;
this.accessToken = accessToken;
console.log('openId:'+this.openId)
console.log('accessToken:'+this.accessToken)
})
}else{
console.log('没有登录')
}
},
示例代码:
https://gitee.com/myGitHuya/qqlogin-demo.git
补充
如果要获取用户信息,最好交给后台去调用,因为前台调用可能会出现跨域问题,后台去调接口,具体接口方式也在QQ互联文档上有QQ互联API列表
更多推荐
所有评论(0)