微信小游戏排行榜：主域和子域

前言：微信小游戏为了保护其社交关系链数据，增加了子域的概念，子域又叫开放数据域，是一个单独的游戏执行环境。子域中的资源、引擎、程序，都和主游戏完全隔离，开发者只有在子域中才能访问微信提供的 wx.getFriendCloudStorage() 和 wx.getGroupCloudStorage() 等API，用于实现一些例如排行榜的功能。

准备：
由于开放数据域是一个封闭、独立的 JavaScript 作用域，所以开发者需要创建两个项目：

主域项目工程（正常的游戏项目）
子域项目工程（通过微信 API 获取用户数据来做排行榜等功能）

点击下载demo代码

发布步骤

主域项目：构建 -> 选择 Wechat Game 平台 -> 填入 [子域代码目录]（建议在项目工程的发布包目录下）
子域项目：构建 -> 选择 Wechat Game 平台 -> 渲染模式选择 Canvas 模式 -> 发布路径填入的 [子域代码目录] 相同路径
注意：游戏名称必须和主域项目中设置的 [子域代码目录] 名称一致，以下是参考图。

核心代码

1.主域工程：

Test.js


cc.Class({extends: cc.Component,properties: {display: cc.Sprite,},start () {this.tex = new cc.Texture2D();},onClick () {//1.发消息给子域wx.postMessage({ message: 'hello 我是你爸' });//2.托管用户数据到微信// var kvDataList = new Array();// kvDataList.push({key:"nick",value:"laixiao"});// kvDataList.push({key:"avatar",value:"https://wx.qlogo.cn/mmopen/vi_32/78vDM2vOOAhAicj5YIPYKucDIx2VMdHGibLqZLSbBR9icgncZ3iaOibxEiaXEicq9Jmla0oGQfPY1lOTCOOU4PDXDUaog/0"});// kvDataList.push({key:"score",value:"520"});// wx.setUserCloudStorage({//     KVDataList: kvDataList,//     success(res){//         console.log(res)//     },//     fail(){//         console.log(res)//     }// })},update () {//3.渲染子域this._updaetSubDomainCanvas();},_updaetSubDomainCanvas () {if (!this.tex) {return;}this.tex.initWithElement(sharedCanvas);this.tex.handleLoadedTexture();this.display.spriteFrame = new cc.SpriteFrame(this.tex);},});

2.子域工程：

Test.js


cc.Class({extends: cc.Component,properties: {},start () {//1.监听主域发送的消息wx.onMessage(data => {console.log(data)});//=======测试：调用主域不能调用的微信api=======//2.从微信获取当前用户托管数据//wx.getUserCloudStorage({//    keyList: ["nick","avatar"],//    success(res){//        console.log(res)//    },//    fail(){//        console.log(res)//    }//})},//.子域中加载图片createImage(sprite,url){let image = wx.createImage();image.onload = function () {let texture = new cc.Texture2D();texture.initWithElement(image);texture.handleLoadedTexture();sprite.spriteFrame = new cc.SpriteFrame(texture);};image.src = url;}});

参考链接

1.开发工具：http://forum.cocos.com/t/cocos-creator-v1-9-1-4-10-rc-1/58529

2.发布小游戏：http://docs.cocos.com/creator/manual/zh/publish/publish-wechatgame.html

3.接入微信小游戏的子域：http://docs.cocos.com/creator/manual/zh/publish/publish-wechatgame-sub-domain.html

4.子域中加载图片：http://forum.cocos.com/t/topic/58785

5.点击下载排行榜ScrollView单机版demo

子域模糊处理：

主域：

if (window.sharedCanvas) {window.sharedCanvas.width = cc.game.canvas.width * 2;window.sharedCanvas.height = cc.game.canvas.height * 2;
}

子域：

cc.view._convertPointWithScale=function(point) {var viewport = this._viewPortRect;point.x = (point.x - viewport.x) / (this._scaleX / 2);point.y = (point.y - viewport.y) / (this._scaleY / 2);
};
cc.view._convertTouchesWithScale=function(touches) {var viewport = this._viewPortRect, scaleX = this._scaleX / 2, scaleY = this._scaleY / 2, selTouch, selPoint, selPrePoint;for (var i = 0; i < touches.length; i++) {selTouch = touches[i];selPoint = selTouch._point;selPrePoint = selTouch._prevPoint;selPoint.x = (selPoint.x - viewport.x) / scaleX;selPoint.y = (selPoint.y - viewport.y) / scaleY;selPrePoint.x = (selPrePoint.x - viewport.x) / scaleX;selPrePoint.y = (selPrePoint.y - viewport.y) / scaleY;}
};

微信小游戏排行榜：主域和子域相关推荐

微信小游戏：主域子域
主域通常我们所有的功能在主域中就可以完成,主域中有游戏开发所需的所有接口.但是当我们想要做需要访问用户好友数据信息的时候,就需要用到开放数据域中的接口,开放数据域中的接口只能在子域中访问,这也就是我 ...
pixijs微信小游戏排行榜开放域开发
关于微信小游戏开放域的基本概念本文不作介绍请去微信官文文档阅读: 主域: 在这你有几件事要作,第一准备好给离屏canvas用的容器:第二作好离屏canvas事件交互,比如切换菜单/关闭窗口:第三循环里 ...
微信小游戏排行榜：Cocos Creator
上一篇文章介绍了主域和子域的概念,微信小游戏:主域子域,这一篇介绍一下怎样在微信小游戏中制作好友排行榜创建工程由于开放数据域是一个封闭.独立的 JavaScript 作用域,所以开发者需要创建两个 ...
CocosCreator微信小游戏排行榜及开放数据域的理解与使用
微信小游戏开放数据域及排行榜的使用好久没有写博客了,距离上一次博客,已经有了近半年之久,这段时间发生了太多的事,当然,这些不是今天的主题,接下来我们主要讲一讲微信小游戏开放数据域的使用,以及如果制作 ...
CocosCreator | 微信小游戏排行榜微信开放域
更多笔记和源码请关注:[微信公众号] CocosCreator笔记演示技术摘要主域工程微信授权创建子域节点向子域发送消息子域工程读写用户云托管数据接收主域发送的消息构建运行实现 ...
CocosCreator微信小游戏排行榜开发
CocosCreator微信小游戏排行榜开发开发前言步骤1 开发前言第一次接触微信小游戏开发的小伙伴,可以看看排行榜的开发和注意事项: 一.开发微信排行榜的话,用户的信息需要从微信提供的API获 ...
基于Laya游戏引擎实现微信小游戏排行榜
我们都知道,微信小游戏和小程序目前风头十足,很多公司都逐渐增加了相关业务线来迅速推广自己的产品和抢占用户群.说到微信小游戏,就不得不提到排行榜这个功能,就目前游戏行业,似乎都离不开排行榜这个重要功能, ...
LayaAir 绘制微信小游戏开放数据域画面
LayaAir 绘制微信小游戏开放数据域画面请大家关注我的微博:@NormanLin_BadPixel坏像素之前写过用cocosCreator绘制微信小游戏子域的教程,保持整体思路不变,现在再写一 ...
LayaAirIDE实现微信小游戏排行榜绘制（开放数据域）
看这篇文章的前提是你 1.已经在微信Web开发者平台里使用wx.setUserCloudStorage接口把自己的数据存储到微信提供的服务器上, 2.并且已经通过wx.getFriendCloudSt ...
微信小游戏|开放数据域的写与读
本文来自Cocos官方论坛,感谢「达闻西」的分享! 1. 引言本来是自己写的笔记,想想还是发出来把,能让不少新手少走弯路,毕竟自己也是摸索了好久!以图片的形式,让大家更直观点! 微信小游戏API官方 ...

微信小游戏排行榜：主域和子域

核心代码

子域模糊处理：

微信小游戏排行榜：主域和子域相关推荐

最新文章

热门文章