一，小程序新增隐私协议
1，创建隐私组件 privacy
component/privacy/privacy.js
const app = getApp()
Component({
/**
* 组件的初始数据
*/
data: {
privacyContractName: '',
showPrivacy: false
},
/**
* 组件的生命周期
*/
pageLifetimes: {
show() {
const that = this
wx.getPrivacySetting({
success(res) {
if (res.needAuthorization) {
// 打开隐私弹窗
that.setData({
privacyContractName: res.privacyContractName,
showPrivacy: true
})
} else {
// 用户已经同意过隐私协议，直接执行同意隐私协议的后续操作，比如展示被隐藏的相关功能
app.agreePrivacy()
}
}
})
}
},
/**
* 组件的方法列表
*/
methods: {
// 打开隐私协议页面
openPrivacyContract() {
if(wx.openPrivacyContract){
wx.openPrivacyContract({
fail: () => {
wx.showToast({
title: '遇到错误',
icon: 'error'
})
}
})
} else {
wx.showToast({
title: '请下载最新的微信客户端', icon: 'none'
})
}
},
// 拒绝隐私协议
exitMiniProgram() {
// 直接退出小程序
wx.exitMiniProgram()
},
// 同意隐私协议
handleAgreePrivacyAuthorization() {
const that = this
wx.requirePrivacyAuthorize({
success: () => {
// 用户同意授权
// 继续小程序逻辑
that.setData({
showPrivacy: false
})
app.agreePrivacy()
},
fail: () => {}, // 用户拒绝授权
complete: () => {}
})
},
}
})
component/privacy/privacy.wxml
<view class="privacy" wx:if="{{showPrivacy}}">
<view class="content">
<view class="title">隐私保护指引</view>
<view class="des">
在使用当前小程序服务之前，请仔细阅读<text class="link" bind:tap="openPrivacyContract">{{privacyContractName}}</text>。如你同意{{privacyContractName}}，请点击“同意”开始使用。
</view>
<view class="btns">
<button class="item reject" bind:tap="exitMiniProgram">拒绝</button>
<button id="agree-btn" class="item agree" open-type="agreePrivacyAuthorization" bindagreeprivacyauthorization="handleAgreePrivacyAuthorization">同意</button>
</view>
</view>
</view>
component/privacy/privacy.wxss
.privacy {
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, .5);
z-index: 9999999;
display: flex;
align-items: center;
justify-content: center;
}
.content {
width: 632rpx;
padding: 48rpx;
box-sizing: border-box;
background: #fff;
border-radius: 16rpx;
}
.content .title {
text-align: center;
color: #333;
font-weight: bold;
font-size: 32rpx;
}
.content .des {
font-size: 26rpx;
color: #666;
margin-top: 40rpx;
text-align: justify;
line-height: 1.6;
}
.content .des .link {
color: #07c160;
text-decoration: underline;
}
.btns {
margin-top: 48rpx;
display: flex;
}
.btns .item {
justify-content: space-between;
width: 244rpx;
height: 80rpx;
display: flex;
align-items: center;
justify-content: center;
border-radius: 16rpx;
box-sizing: border-box;
border: none;
}
.btns .reject {
background: #f4f4f5;
color: #909399;
}
.btns .agree {
background: #07c160;
color: #fff;
}
2，初始页引入隐私组件
pages/index/index.json
{
"navigationBarTitleText": "首页",
"usingComponents": {
"Privacy": "/component/privacy/privacy"
}
}
pages/index/index.wxml
<view class="container">
<Privacy></Privacy>
</view>
pages/index/index.js
const app = getApp()
Page({
data: {
...
},
onLoad() {
...
// 调用 app.js 里登录方法
app.doInit()
},
3，app.js 登录流程
App({
onLaunch() {
},
doInit(callback) {
// 获取用户信息
wx.showLoading({
title: '加载中',
});
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
wx.hideLoading();
}
}
});
},
// 隐私协议-- 点击【同意】按钮
agreePrivacy() {
console.log('=====同意隐私协议=====')
this.getUserInfo()
this.wxLogin()
},
getUserInfo() {
// 已经授权，可以直接调用 getUserInfo 获取头像昵称，不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo;
// 由于 getUserInfo 是网络请求，可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
},
fail:err=>{
wx.hideLoading();
}
})
},
// 小程序登录
wxLogin(){
// 登录
wx.login({
success: res => {
// 登录接口
this.login(res);
}
})
},
/**
* 登录接口
* @param res: 入参
*/
login(res){
let that = this
let data = {
"jscode": res.code
}
const header = {
'content-type': 'application/x-www-form-urlencoded'
}
const url = `${this.globalData.BASE_URL}/auth`;
wx.request({
url: url,
data: data,
method: 'GET',
header: header,
success(res) {
wx.hideLoading();
if(res.data.code == '0') {
that.globalData.loginInfo = res.data
that.globalData.cookies = res.cookies
wx.reLaunch({
url: '../serviceLists/serviceLists'
})
} else if(res.data.code == '3' || res.data.code == '4') {
that.globalData.loginInfo = res.data
// 登录失败，openid没有绑定手机号，需要走手机号绑定流程
wx.reLaunch({
url: '../user-type/user-type'
})
} else {
wx.showModal({
title: '提示',
showCancel: false,
content: res.data.message || res.errMsg || ''
})
}
},
fail(e) {
wx.hideLoading();
}
})
},
globalData: {
BASE_URL: 'http://127.0.0.1:8082',
userInfo: Object,
loginInfo: Object,
cookies: null
}
})
二，更新用户隐私保护指引
发现 wx.getUserInfo 获取不到用户信息
wx.getUserInfo错误信息
则在小程序文档里找到左侧的【设置】，【服务内容声明】更新信息
服务隐私保护指引
点击 【增加信息类型】选择 【昵称、头像】，审核结束之后就能通过 wx.getUserInfo 获取用户信息。
增加信息类型
