记录开发过程中的小问题,请多指教
由于是直接从微信文制过来,文章样式格式有点乱·····
完整样式请阅读微信原文
更多笔记和源码请访问公众号


技术摘要
主域工程
微信授权
创建子域节点
向子域发送消息
子域工程
读写用户云托管数据
接收主域发送的消息
构建运行
实现
1微信授权
只实现微信小游戏排行榜的话可以不用添加微信授权
但多记录点,以备不时之需

微信授权按钮代码:
`//创建一个透明按钮在登录按钮的node节点上
createAuthorizeButton(nodeAuthorize: cc.Node) {
let nodeSize = cc.size(nodeAuthorize.width, nodeAuthorize.height);
let frameSize = cc.view.getFrameSize();
let winSize = cc.winSize;
let left = (winSize.width * 0.5 + nodeAuthorize.x - nodeSize.width * 0.5) / winSize.width * frameSize.width;
let top = (winSize.height * 0.5 - nodeAuthorize.y - nodeSize.height * 0.5) / winSize.height * frameSize.height;
let width = nodeSize.width / winSize.width * frameSize.width;
let height = nodeSize.height / winSize.height * frameSize.height;
let btnAuthorize = wx.createUserInfoButton({
type: ‘text’,
text: ‘’,
style: {
left: left,
top: top,
width: width,
height: height,
lineHeight: 0,
backgroundColor: ‘’,
color: ‘#ffffff’,
textAlign: ‘center’,
fontSize: 16,
borderRadius: 4
}
})
btnAuthorize.onTap((res) => {
if (res.userInfo) {
console.log(“wx authorize success”);
//wx.showToast({title:“授权成功”});
} else {
console.log(“wx authorize fail”);
//wx.showToast({title:“授权失败”});
}
btnAuthorize.destroy();
});
}`
2创建子域节点
具体方法文档写的已经很详尽,请参考文档:
https://docs.cocos.com/creator/2.2/manual/zh/publish/publish-wechatgame-sub-domain.html
在场景中新建节点
添加组件->其他组件->WXSubContextView
设置节点的size为排行榜的size
此节点就是显示微信开放数据域的容器

3创建子域工程
新建项目:wx-open-data-project
或者直接使用官方GitHub上的项目
记得一定要精简项目模块,不然包体会是双倍大小
开放数据域项目的Canvas尺寸需要和主域项目中WXSubContextView组件的尺寸保持一致
勾选 Fit Height 和 Fit Width

在场景里添加scrollview或者你需要的组件

这里我就简单的在content组件上挂载了一个layout

如果需要大量数据的话,需要优化scrollview
创建预制件并填写对应的预制件代码

4相关代码
主域:
向开放域发送消息(用户最高分数)
wx.getOpenDataContext().postMessage({
score: score
});
子域:
监听主域发送的消息(用户最高分数)并提交至云托管
//监听主域发送的消息
wx.onMessage((data) => {
if (data.score) {
//存储最高分
//注意value类型必须为string
let kvScore = { key: “score”, value: String(data.score) };
let kvList = [];
kvList.push(kvScore);
//对用户托管数据进行写数据操作
wx.setUserCloudStorage({
KVDataList: kvList,
success: (res) => {
console.log(res);
this.initFriendInfo();
},
fail: (res) => {
console.error(res);
}
});
}
});
无需用户授权,获取用户信息
//在无须用户授权的情况下,批量获取用户信息
//要获取信息的用户的 openId 数组,如果要获取当前用户信息,则将数组中的一个元素设为 ‘selfOpenId’
wx.getUserInfo({
openIdList: [‘selfOpenId’],
lang: ‘zh_CN’,
success: (res) => {
},
fail: (res) => {
console.error(res);
}
});
获取好友数据
//拉取当前用户所有同玩好友的托管数据
let self = this;
wx.getFriendCloudStorage({
keyList: [‘score’],
success: (res) => {
console.log(res);
self._listRank = res.data;
self.initList();
},
fail: (res) => {
console.error(res);
}
});
获取当前用户托管数据
//获取当前用户托管数
wx.getUserCloudStorage({
keyList: [‘score’],
success: (res) => {
console.log(res.KVDataList);
},
fail: (res) => {
console.error(res);
}
})
将好友信息按分数降序排序,并显示
compare(property) {
return (x, y) => {
return Number(y[property]) - Number(x[property]);
}
}
initList() {
this._listRank.sort(this.compare(“score”));
this.nodeContent.removeAllChildren();
for (let i = 0; i < this._listRank.length; ++i) {
this.createItem(this._listRank[i], i);
}
}
createItem(info, rank) {
let node = cc.instantiate(this.prefabItem);
node.parent = this.nodeContent;
node.getComponent(PrefabItem).init(info, rank);
}
5
构建运行
借用官方文档的两张图片
构建游戏项目:
打开主域项目,在 菜单栏 -> 项目 中打开 构建发布 面板,选择 微信小游戏,填入 开放数据域代码目录。该目录是开放数据域构建后所在的路径,并且这个路径需要放在主域构建目录下。然后点击 构建
构建开放域项目:
发布路径 指定到主域项目工程的发布包目录即 build 目录下。然后点击 构建。
游戏名称 必须和主域项目中设置的 开放数据域代码目录 名称一致
运行结果:

