第 3 部分 - 如何使用插件
我们开始启用游戏网络货币化插件,看看有哪些功能可用。
我们开始之前,您应该已经向 Coil 和像 Uphold 等数字钱包服务提供商注册。如果您未注册,请返回第 2 部分进行注册, 因为从这一步开始,每个步骤都以注册为基础。
登录Coil 网站,然后进入设置寻找付款,然后就看到您的支付指示器:
下载插件
下载或浏览游戏网络货币化 GitHub repo。如果您习惯使用 git,就可以通过以下网址浏览:
https://github.com/photonstorm/gamewebmonetization.git
或者 ssh:
git@github.com:photonstorm/gamewebmonetization.git
如果您愿意,您可以下载整个 repo 的 zip 文件。
一旦文件下载到您的计算机,就可以在 plugin/dist/
文件夹找到该插件,其名为 GameWebMonetization.js
。
创建测试页面
为了检查该插件是否正常工作,我们创建一个简单的测试页面。打开您喜欢的代码编辑器,创建新文件夹,并在其中保存空 index.html
和 main.js
文件。
我们首先编辑 index.html
,通过调用 main.js
并将其定义为一个模块,创建其基本结构。将以下内容粘贴到索引文件中:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>游戏网络货币化</title>
</head>
<body>
<script src="./main.js" type="module"></script>
</body>
</html>
从 plugin/dist/GameWebMonetization.js
复制插件,因此,它将和您已经获取的索引和主文件在一起:
此版本的插件显示为 ESM(ES 模块),所以我们可以直接将其加载到 main.js
。在本教程中,我们使用导入和现代 JavaScript。不过,如果您需要 ES5 和 TypeScript 版本,也可以在 plugin
文件夹中找到它们。但是,在本教程其余部分,我们使用 ESM。
编辑 main.js
,导入您的插件:
import { GameWebMonetization } from './GameWebMonetization.js';
导入模块后,我们可以实例化插件。构造函数需要含 paymentPointer
的配置对象。这就是为何您必须从钱包服务中获得配置对象的原因。
将以下内容添加到 main.js
,切记用您自己的以下内容,替换 paymentPointer
值:
const gameWebMonetization = new GameWebMonetization({ paymentPointer: '$ilp.uphold.com/zdXzL8aWJ4ii' });
我们所做的是导入模块,创建插件的实例,并为其分配一个支付指示器。现在,我们只需要启动支付指示器。
在浏览器中打开 index.html
。在本教程中,我们使用的是 Visual Studio Code 和 Live Server 扩展程序,但您可以使用任何方法,只要文件是提供给您的浏览器,而不是直接打开的。
打开后,它仍然会显示该网站未货币化。这是因为我们已经准备好插件,但尚未_开始_货币化:
我们返回并编辑 main.js
,启动货币化流程。可以通过start()
方法进行此操作:
import { GameWebMonetization } from './GameWebMonetization.js';
const gameWebMonetization = new GameWebMonetization({ paymentPointer: '$ilp.uphold.com/zdXzL8aWJ4ii' });
gameWebMonetization.start();
现在,如果我们返回浏览器并刷新,我们会看到我们的网站开始货币化:
恭喜!本页面正通过 Interledger 协议将少量的货币流入到您的数字钱包。
如果出错,记得检查:
- 您是否有 Coil 订阅账户。
- 您已经充分验证您的 Uphold(或其他钱包)服务
- 支付指示器 URL 已经在代码中更改为您自己的指示器 URL。
- 您在服务测试页面,而不是在浏览器中直接打开它。
仅使用此配置,您就已经成功将此页面货币化。但是,至少给游戏玩家一些奖励,这点很重要。若要做到这一点,您可以利用插件提供的方法和属性。下面我们来深入探讨这些问题。