微信原生开放域实现排行榜、好友送礼
在使用Cocos Creator制作微信小游戏的时候,基本上都是需要排行榜功能的。
鉴于如果使用Cocos Creator官方提供的WxSubContextView,会增大不少开放域包体。如果本身主域工程的包体已经有点大,并且还不想用分包加载的话,那么可以考虑使用微信提供的API和Canvas渲染来做排行榜系统。这样可以极大的减小开放域包体。一起来试试吧。下面我将分享我自己整理的一份微信原生开放域实现排行榜的工程。其中实现的功能有:
工程运行截图如下:
主域和子域通信
主域和子域的通信,大家应该都很熟悉,主域和子域的通信是单向的,只能主域向子域发消息,子域不能向主域发消息。在子域(开放域)中,用wx.onMessage进行监听,在主域中发送消息给子域。
在子域中监听
用户授权按钮(位置适配)
我看见有很多小游戏的用户授权按钮点击位置并没有做好适配,基本就是在一个UI界面点击任何位置都可以进行授权,有时候用户可能会不理解,或者不知道是怎么回事。那么有一个非常明显提示用户登录的按钮,是有必要的。
这里需要注意的是,微信的单位像素并不是标准的游戏设计中的像素单位。 所以要注意单位的转换,把游戏设计中的像素单位转换为微信中的像素单位。
上传用户数据
上传用户数据可以直接在主域中调用微信的提供的API,上传用户托管数据
获取好友托管信息、展示好友排行榜
主要难点是在子域中,怎么渲染界面。渲染界面用的是Canvas,获取Canvas对象的绘制上下文,进行绘制渲染
好友互动
好友互动的话,就要加点击事件了,但是在子域中,怎么添加点击事件。 这里是在Canvas上添加点击事件的监听,然后判断点击的点是否在一个图片大小范围内,判断点击是否有效。有效,则调用微信相关的API取修改好友的互动数据。
还有一个注意的一些点:
1.小游戏目录下,新建jsserver目录
2.project.config.json中添加 "jsserverRoot": "jsserver/"
3.game.json中添加 交互模板
完成以上的步骤,在主域中,获取自己的互动数据wx.getUserInteractiveStorage,此处需要解密从微信回传的加密数据。需要云函数调用或者通过服务端处理。
在完成开放数据域代码后,直接该工程目录下,新建build-templates文件夹,并且将开放数据域代码open-data拷贝一份到build-templates/wechatgame下,如图 然后构建即可。
完整代码,尽在https://gitee.com/zzhcodes/WxOpenDataProject
参考链接:
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。