Regardez d'abord le code, vous verrez les effets suivants, il suffit de copier et d'utiliser, certaines parties doivent être modifiées et ont été remarquées.
Si vous êtes satisfait, veuillez donner à Mo Chengchen un fabuleux
<template>
<view>
<view class="Administration">
<view class="welcome">
我们这个小程序欢迎您！
</view>
<view class="fondyour">
请确认授权以下信息
</view>
<view class="fondyourson">
获取你的公开信息 (昵称，头像等)
</view>
<!-- 依据微信要求 使用getUserInfo 来获取用户授权-->
<button class="isbtn" open-type="getUserInfo" @getuserinfo="getUserList">
微信授权
</button>
</view>
</view>
</template>
<script>
//请注意 这是我封装的接口调用
// import { GetOpenId , Login } from "../../API"
// API.js中 这两个函数 如下定义
// //获取用户信息信息
// let base = 'https://接口地址.cn/api';
// export const GetOpenId = params => { return Get(`${base}/user/getSessionKey`,params).then(res => res.data); };
// //登录
// export const Login = params => { return Get(`${base}/user/login`,params).then(res => res.data); };
export default {
data() {
return {
userMsg:'', //用户信息
}
},
methods: {
getUserList(res) {
const _this = this;
uni.setStorageSync('usermsg', res); // 获取到用户授权后 会得到用户公开信息
_this.userMsg = res.detail
console.log('用户公开信息',res)
if(_this.userMsg){
uni.login({
//调用登陆方法 获取code
success(res) {
console.log('code信息',res)
let params = {
code:res.code
}
uni.setStorageSync('usercode', res); //当然也可以存起来
// 这个地方就获取到了 几乎您所需要的一切登陆需要的信息
//当然 有可能获取失败 我们的做法是
//清除历史记录 如果没有历史记录 会让用户重新授权一次
// 这里调用您的接口方法
// 比如 请求网络数据 下面是您可能用到的数据
// GetOpenId(params).then(res=>{ //GetOpenId 是我自己封装的函数 获取openid
// if(res.code==1){
// uni.setStorageSync('useOpenId', res.data); //存储openid
// let data = {
// openid:res.data.openid,
// session_key:res.data.session_key,
// encrypted_data:_this.userMsg.encryptedData,
// iv:_this.userMsg.iv,
// }
// Login(data).then(rep=>{ // 一个获取token的接口函数
// if(rep.code==1){
// uni.setStorageSync('token', rep.data.token);
// wx.showToast({
// title: '登录成功',
// icon: 'success',
// duration: 1000,
// })
// setTimeout(()=>{ //登陆成功 返回上一页
// uni.navigateBack({
// delta:-1
// })
// },1000)
// }else{
// wx.showToast({
// title: rep.msg.msg,
// icon: 'none',
// duration: 1000,
// })
// wx.clearStorage()
// setTimeout(()=>{ //token 获取失败 清除Storage 返回上一页
// wx.switchTab({
// url: '../Mine/Mine'
// })
// },1000)
// }
// })
// }else{
// wx.showToast({
// title: '请求失败,请重试',
// icon: 'none',
// duration: 1500,
// })
// wx.clearStorage()
// setTimeout(()=>{ //token 获取失败 清除Storage 返回上一页
// wx.switchTab({
// url: '../Mine/Mine'
// })
// },1000)
// }
// })
}
})
}
}
}
}
</script>
<style scoped lang="scss">
.Administration{
width: 74%;
height: auto;
padding-top:120rpx;
margin-left:13%;
}
.welcome{
font-size:30rpx;
font-weight:600;
color:#000;
}
.fondyour{
font-size:22rpx;
color:#000;
font-weight:600;
margin-top:35rpx;
}
.fondyourson{
color:rgba(159,160,160,1);
font-size:20rpx;
margin-top:10rpx;
}
.isbtn{
height: 70rpx;
line-height:70rpx;
font-size:30rpx;
background: #339900;
color:#fff;
margin-top:60rpx;
}
</style>
Les informations supplémentaires et utiles qui peuvent apparaître ont été annotées
Si vous avez des questions sur uniapp ou si vous ne comprenez pas cette méthode, vous pouvez laisser un message, je vous répondrai dans les plus brefs délais et vous aiderai à le résoudre.