一、第一步引入sdk:在uniapp index.html里面加入以下代码
<script type="text/javascript" charset="utf-8"
src="http://connect.qq.com/qc_jssdk.js"
data-appid="填入APPID"
data-redirecturi="填入回调地址"
></script>
其中回调地址在上述代码填写完毕后还需要在接入的腾讯开放平台上平台信息页面进行填写,两者保持一致。
二、调用QQ登录
let local = encodeURIComponent(window.location.href); //获取当前页面地址作为回调地址
QC.Login.showPopup({
appId:填入appid,
redirectURI: local
})
注意:window.location.href的值就是你第一步需要填入的回调域名
三、后端部分:后端进行回调域名配置(必须的),其他后端部分暂时没有了解。
四、相关问题 1、本地如何进行测试:在电脑hosts文件进行域名映射
127.0.0.1 映射的域名
比如 127.0.0.1 www.woyaoceshi.com 回调地址因此也需要按着这个改 比如回调地址:https://www.woyaoceshi.com/#/pages/my/my/my 反正运行出来看看浏览器上面地址栏是啥就知道回调地址填啥了。 2、线上部署回调地址可能会变,腾讯开放平台允许填写多个回调域名以分号隔开就好。 3、其他遇到问题可能需要调整的: (1)uniapp manifest.json进行H5相关配置:https协议和端口配置,主要都是回调地址相关产生的问题。
后续有时间再慢慢完善这篇文章!