集成 CrazyGames SDK

Wonderland Engine 是构建高性能 3D 网页游戏的绝佳选择，因为它经过优化，加载速度快，甚至在 iOS Safari 上也能运行良好。本教程将介绍如何集成 CrazyGames 平台服务。

Wonderland Engine 是构建高性能 3D 网页游戏的绝佳选择，因为它经过优化，加载速度快，甚至在 iOS Safari 上也能运行良好。

本教程将介绍如何集成 CrazyGames 平台服务（查看他们的文档）：

前提条件

通过 npm 安装我们的 Universal Platform SDK (UPSDK)，以及 CrazyGames 提供者和本地存储提供者，作为用户未登录时游戏存档的备用：

npm i --save @wonderlandengine/upsdk \
    @wonderlandengine/upsdk-provider-crazygames \
    @wonderlandengine/upsdk-provider-localstorage

在开发者门户上创建一个 CrazyGames 开发者账户。

设置

为了确保提供者已配置，您需要在 app.js 文件（应用程序捆绑包的入口点）中尽早注册它们：

import {
    extra,
    ads,
    user,
    saveGame,
    analytics,
    leaderboards,
} from '@wonderlandengine/upsdk';

import {CrazyGamesProvider} from '@wonderlandengine/upsdk-provider-crazygames';
import {LocalStorageProvider} from '@wonderlandengine/upsdk-provider-localstorage';

/* 为您想要使用的所有服务注册 CrazyGames 提供者 */
const cg = new CrazyGamesProvider();
ads.registerProvider(cg);
analytics.registerProvider(cg);
saveGame.registerProvider(cg);
extra.registerProvider(cg);
user.registerProvider(cg);
extra.registerProvider(cg);
cg.onReady.then(() => analytics.trackLoadingStart());

/* 注册本地存储游戏存档作为游戏存档的备用提供者，
 * 当 CrazyGames 无法提供游戏存档服务时（例如用户未登录）。*/
saveGame.registerProvider(new LocalStorageProvider());

/* wle:auto-constants:start */
// ...

无需额外配置，因为一旦发布在 CrazyGames 网站上，环境就会自动提供给 SDK。

使用服务

CrazyGames 提供基础分析、游戏存档、炫酷的“庆祝”效果、奖励广告和中插广告、用户名和头像。

在发布到 CrazyGames 上之前，您至少需要实现加载和游戏时间分析。

分析

在 app.js 中，跟踪主场景的加载。

 try {
     await engine.loadMainScene(`${Constants.ProjectName}.bin`);
+    analytics.trackLoadingStop();
 } catch (e) {
     console.error(e);
+    analytics.trackLoadingStop();
     window.GameAnalytics.addErrorEvent(
         ErrorSeverity.Critical,
         `Failed to load ${Constants.ProjectName}.bin: ${e.message}\n${e.stack || ''}`
     );
     window.alert(`Failed to load ${Constants.ProjectName}.bin:`, e);
 }

注意：加载开始已在我们为设置添加的代码段中跟踪。

import {ads} from `@wonderlandengine/upsdk`;

const cursorTarget = this.object.getComponent(CursorTarget);
cursorTarget.onClick.add((object, cursor, event) => {
    ads.showRewardedAd(event).then(() => {
        /* 获得奖励时 */
    }).catch(e => {
        switch (e.status) {
            case 'unfilled':
            case 'ads-unavailable':
            case 'network-error':
            case 'no-zoneid':
            case 'ad-maximum':
            case 'ad-blocker':
            case 'ad-violation':
            case 'cors-error':
                console.error(e.status);
            default:
                console.log('用户取消观看广告');
        }
    })
});

如需展示中插广告，请使用 ads.showMidgameAd(event)。

事件由 Cursor 和 CursorTarget 系统转发，wonderland-react-ui 和 HTML 元素的原生 DOM 事件。

使用 QA 工具进行测试

访问 CrazyGames 开发者门户并注册。

开始提交您的游戏：

设置游戏名称
选择 Externally hosted (iframe) 作为您的“游戏引擎”。
使用 http://localhost:<port>，与 Wonderland 编辑器相同的 URL。
如果您使用 CrazyGamesProvider 提供游戏存档服务，请选择“是，使用 CrazyGames SDK 的数据模块”。
如果您计划支持移动设备，请选择“游戏支持移动设备”。

现在点击 Preview，这将显示包含所有 CrazyGames 服务的嵌入版本。本地测试您的广告是否触发以及所有其他服务是否正常工作。

发布

您可以将您的游戏以 iframe 或 web 文件 zip 的形式提交。我们建议您提前通过我们的 Discord 社区联系我们，因为我们可能会在您的上线过程中为您提供支持。