uniapp前后端数据对接,以微信授权登录为例
uni.request({ //URL填写后端给的地址
url: 'http://167:8080/ddaddemo/api/wxlogin',
method: 'POST',
header: {
"content-type": "application/jsGBN",
"source": "fromApp"
},
//需要传到后端的数据放在data
data: {
"code" :code,
"nickName": userInfo.nickName,
"gender": userInfo.gender,
"city": userInfo.city,
"country": userInfo.country,
"language": userInfo.language,
"province": userInfo.province,
"avatarUrl": userInfo.avatarUrl
},
success: (res3) => {
// 登录成功,后端返回数据在res里面
uni.showToast({
icon:"success",
title:"登陆成功!"
})
console.log('登录成功:' + JSON.stringify(res3));
uni.hideLoading()
console.log(res3)
// 步骤4:处理业务逻辑
// 比如:更换昵称和头像
this.nickName = userInfo.nickName
this.avatarUrl = userInfo.avatarUrl
this.city = userInfo.city
//关闭登录按键
this.loginShow = false
},
fail: (err) => {
// 登录失败
uni.hideLoading()
uni.showToast({
title: '登录失败',
icon: 'none'
});
}
});
登陆成功会返回的data中会包含session_key ,open_id以及token,由于涉及到隐私,因此不在此处贴出来了,由此登录完成!
所有的登录流程代码如下:
// 登录流程
login() {
// 提醒:如果遇到this未定义问题,需要在方法开始的时候,执行下面的代码,然后将后面的this换成that。
let that = this
// 步骤1:调用uni.getUserProfile(),弹出授权窗口
uni.getUserProfile({
desc: '注册', // 这个参数是必须的,desc属性(声明获取用户个人信息后的用途)后续会展示在弹窗中,请开发者谨慎填写。
success: (res) => {
// 用户点击了允许,拿到用户信息
console.log("用户信息: " + JSON.stringify(res.userInfo));
let userInfo = res.userInfo;
// 步骤2:调用uni.login(),获取code
uni.login({
provider: 'weixin', // 登录服务提供商,这里是weixin
success: (res2) => {
uni.showLoading({
title: '登录中',
})
// 获得code
var code = res2.code
// appid和appsecret可以不用获取
// var appid = res2.appid
// var appsecret = res2.appsecret
console.log("获取code成功: " + JSON.stringify(res2));
console.log("code"+JSON.stringify(res2.code))
// 步骤3:向后端服务器发送请求,带上参数:code和用户信息,将用户信息保存到数据库
uni.request({
url: 'http://167:8080/ddaddemo/api/wxlogin',
method: 'POST',
header: {
"content-type": "application/jsGBN",
"source": "fromApp"
},
data: {
"code" :code,
// info: JSON.stringify({
// "code": code,
"nickName": userInfo.nickName,
"gender": userInfo.gender,
"city": userInfo.city,
"country": userInfo.country,
"language": userInfo.language,
"province": userInfo.province,
"avatarUrl": userInfo.avatarUrl
// })
},
success: (res3) => {
// 登录成功
uni.showToast({
icon:"success",
title:"登陆成功!"
})
// console.log('登录成功:' + JSON.stringify(res3));
uni.hideLoading()
console.log(res3)
// 步骤4:处理业务逻辑
// 比如:更换昵称和头像
this.nickName = userInfo.nickName
this.avatarUrl = userInfo.avatarUrl
this.city = userInfo.city
//关闭登录按键
this.loginShow = false
},
fail: (err) => {
// 登录失败
uni.hideLoading()
uni.showToast({
title: '登录失败',
icon: 'none'
});
}
});
}
})
},
fail: (err) => {
// 用户点击了拒绝
uni.showToast({
title: '您点击了拒绝',
icon: 'none'
})
console.log("用户点击了拒绝" + JSON.stringify(err));
}
})
},