**微信小程序登录:QQ小程序登录: uniapp制作小程序登录 **
内容写的有点很仔细了 但是小白可能不好理解 看我的博客之前 请放下自己的坏情绪 调整下心情
否则事半功倍
微信小程序之前的一版本是通过点击按钮的形式进行弹窗的:但是现在已经废弃了
还是可以使用的 但是不会在弹窗授权了 而是直接返回的匿名的微信名称 微信头像 但是那些必要的参数还是没有改变的—eg(例如)::::(iv , rawData , signature)
但是还是有好处的 :我们另类客户不想要授权弹窗 那正好可以考虑这个方式 但是大多小程序我的导航哪里显示的手机微信的昵称头像 这时候就惨了(鱼和熊掌不可得兼)
<button open-type="getUserInfo" @click="logo"></button>
methods:{
logo(){
wx.getUserInfo({provider: 'weixin',success: (res) => {}})
//uniapp的写法是
uni.getUserInfo({provider: 'weixin',success: (res) => {}})
}
完整的写法: 微信原生开发直接吧uni改为wx QQ小程序直接改为QQ 例如:( uni.getUserInfo===>wx.getUserInfo==>QQ.getUserInfo) uniapp开发直接使用
uni.login({
provider: 'weixin',
success: reslogin => {
uni.showLoading({
title: 'rading...',
})
uni.getUserInfo({
provider: 'weixin',
success: (res) => {
console.log('用户昵称,iv,encryptedData...', res);
//------------------------------以上步骤就已经登录成功了----------------------
//获取到了参数 发给后端获取token 置换session_key等参数
wx.request({
// 注意,如果小程序开启校验合法域名时必须使用https协议
//在测试的情况下可以不开启域名校验
url: 'https://api.xxxx.com/api/Loginxxxu/LogxxxxOpenId',
data: {
// 接口设置的固定参数值
"postdata": [{
"field": "AppID",
"value": "98429DF9"//后端的参数
},
{
"field": "code",
"value": code
},
{
"field": "encryptedData",
"value": res.encryptedData
},
{
"field": "iv",
"value": res.iv
},
{
"field": "rawData",
"value": res.rawData
},
{
"field": "signature",
"value": res.signature
}
]
},
// 请求的方法
method: 'POST', // 或 ‘POST’
// 设置请求头,不能设置 Referer
header: {
'content-type': 'application/json' // 默认值
},
// 请求成功时的处理
success: (res) => {
},
// 请求失败时的一些处理
fail: err => {
uni.hideLoading()
},
})
}
});
}
});
下面是更新的版本:
备注:QQ小程序不支持最新的方式(getUserProfile) 还是使用button配合getUserInfo使用
<view @click="logo"></view> //最新的getUserProfile不需要配合button使用了
logo(){
uni.login({
provider: 'weixin',
success: reslogin => {
}
});
if (uni.getUserProfile) {
uni.getUserProfile({
desc: '用于完善会员资料', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (res) => {
uni.showLoading({
title: '登录中...',
})
wx.request({
// 注意,如果小程序开启校验合法域名时必须使用https协议
//在测试的情况下可以不开启域名校验
url: 'https://api.xxx.com/api/Logxxxuth/LogixxxhatGetOpenId',
data: {
// 接口设置的固定参数值
"postdata": [{
"field": "AppID",
"value": "0BB80B3D336A9390xxxxxx2B"
},
{
"field": "code",
"value": code
},
{
"field": "encryptedData",
"value": res.encryptedData
},
{
"field": "iv",
"value": res.iv
},
{
"field": "rawData",
"value": res.rawData
},
{
"field": "signature",
"value": res.signature
}
]
},
// 请求的方法
method: 'POST', // 或 ‘POST’
// 设置请求头,不能设置 Referer
header: {
'content-type': 'application/json' // 默认值
},
// 请求成功时的处理
success: (res) => {
console.log(res, 'code')
if (res.data.code == 20000) {
uni.hideLoading()
}
},
// 请求失败时的一些处理
fail: err => {
uni.hideLoading()
},
})
},
})
}
}