大家好，又见面了，我是你们的朋友全栈君。
（这仅为小弟的学习笔记，不作为教程，如有错误请大佬指出）
cocos creator中通过调用微信的接口去获取用户授权的信息，之后云函数把用户数据保存至云数据库，再从数据库回调到cocos端处理。比如把用户头像和名称通过远程加载到cocos小游戏中使用。
一.登录游戏，授权用户信息：
在微信开发者中进入游戏，用户点击任意位置的时候，获取用户的授权信息。
代码语言：javascript复制//main.js
onLoad() {
this.authorizationBox()
}
//微信授权按钮的创建,点击屏幕任意位置弹出授权框
authorizationBox() {
if (sys.Platform.WECHAT_GAME) {
//如果是微信平台
window['wx'].login({
//登录游戏
success: function (res) {
if (res.code) {
console.log('登陆成功');
}
//创建一个全屏的授权按钮
let button = window['wx'].createUserInfoButton({
//创建一个获取用户信息的按钮
type: 'text',
text: '',
style: {
height: window['wx'].getSystemInfoSync().screenHeight,//获取屏幕的宽高
width: window['wx'].getSystemInfoSync().screenWidth,
backgroundColor: '#00000000',//最后两位为透明度
color: '#ffffff',
textAlign: 'center',
}
})
button.show() //把按钮显示出来
button.onTap((res) => {
//监听按钮的点击
if (res.errMsg === 'getUserInfo:ok') {
console.log('授权成功');
button.destroy()
} else {
console.log('授权失败');
}
})
}
})
}
}效果：弹出两次授权框
二.初始化云环境：
把刚刚授权好的用户信息通过微信云函数保存到微信云数据库中。所以这里需要一个数据库和一个云函数。
1.初始化“cloud”云环境
2.创建一个微信云数据库“data”
3.创建“login”云函数
4.编写”login”云函数的index.js
//login云函数的index.js脚本
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()//引用云数据库
const userinfo = db.collection("data")//引用data数据表（刚创建的那个数据表名称）
// 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
//查询数据库是否已经注册
let isHas =await userinfo.where({
openid:wxContext.OPENID
}).get()
//如果没有注册
if(isHas.data.length==0){
let isAdd = null
let addData = {
openid:wxContext.OPENID,
userinfo:event.userinfo,
due:new Date()
}
//把获取的数据添加到数据库
isAdd = userinfo.add({
data:addData,
})
return{
code:'save',
res:isAdd,
data:addData
}
}
else{
//已经注册
return{
code:'get',
res:isHas.data
}
}
}5.上传部署
上传部署成功
三.处理用户授权信息：
在cocos中创建一个变量存储云函数回调的用户信息，再创建一个全局函数调用云函数。
1.创建全局变量，用于保存从云端回调的用户信息
代码语言：javascript复制//GlobaData.js
export {
}
window['Globa'] = {
userInfo: null
}2.创建全局云函数调用login
代码语言：javascript复制//GlobalWechat.js
export {
}
//调用云函数处理注册信息
window['onReisterUser'] = function (_userInfo) {
window['wx'].cloud.callFunction({
name: "login",//云函数名字
data: {
userinfo: _userInfo,
},
success(res) {
console.log('处理注册信息成功', res);
window['Globa'].userInfo = res.result.res[0].userinfo
console.log('获取到回调的用户信息：', window['Globa'].userInfo);
},
fail: console.error()
})
}3.在main.js授权脚本调用全局函数，对用户授权的注册信息进行处理
4.打包发布，在微信云开发上运行，并设置云环境（每一次构建打包都需要重新设置云环境）
5.上传用户数据成功，这样子在cocos中就可以获取到用户数据了，也能把用户数据存到云数据库中。
四.分享转发
分享有两种，一种是主动分享(wx.shareAppMessage)，l另一种是右上角的被动分享（wx.showShareMenu）。
这里主动分享我用微信云来存储要分享的信息，而被动分享的话把分享信息直接存在本地，存在本地比存在微信云方便，就是想练练手。
被动分享
代码语言：javascript复制//share.js,被动分享（右上角分享按钮）
passiveShare() {
if (sys.Platform.WECHAT_GAME) {
//显示当前页面转发按钮
window['wx'].showShareMenu({
success: (result) => {
console.log('开启被动转发成功');
},
fail: (res) => {
console.log('开启被动转发失败', res);
},
});
//分享
window['wx'].onShareAppMessage(() => {
let title = [//分享时候显示的标题
'来锻炼一下左右脑协调能力吧！跟着我左脑右脑一个慢动作！',
'你是左脑快还是右脑快呢，快来试试看把！',
'冰墩墩邀请你一起玩钢架雪车！',
'听说你也想拥有一个冰墩墩！',
]
let rand = Math.floor(Math.random() * 4)
return {
title: title[rand],
imageUrl: '', //分享时候显示的图片，如果没有图片就是默认的Canvas，这里我没有添加图片
query: '成功分享游戏'
}
})
}
}主动分享
1.上传分享需要需要用到的图片到云存储中，这里上传两张。
图一：
图二：
2.在数据库创建两个集合保存需要分享的标题和图片
集合一：保存分享标题
集合二：保存分享图片
3.在cocos中创建一个按钮，并且调用onClickButton函数
//share.js
onClickButton() {
//主动分享页面,调用getShareInfo云函数
window['wx'].cloud.callFunction({
name: 'getShareInfo',//调用云函数，下面步骤会写这个函数
success(res) {
console.log('主动分享成功',res);
let _title = res.result.title.title //由数据表传过来的数据
let _pic = res.result.picture.url
window['wx'].shareAppMessage({
title: _title,
imageUrl: _pic,
})
},
fail: console.error
})
}4.在微信写getShareInfo云函数，然后上传部署。
代码语言：javascript复制// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
//链接数据库
let db = cloud.database()
let _pic = db.collection('share_pic')
let _title = db.collection('share_title')
// 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext()
//获取数据表数据
let promise_pic = await _pic.get()
let promise_title = await _title.get()
//把数据随机返回给调用者
return({
title:promise_title.data[Math.floor(Math.random()*promise_title.data.length)],
picture:promise_pic.data[Math.floor(Math.random()*promise_pic.data.length)],
errMsg:promise_title.errMsg,
})
}5.构建打包，点击分享按钮就可以成功！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
发布者：全栈程序员栈长，转载请注明出处：https://javaforall.cn/213615.html原文链接：https://javaforall.cn
