Metaframeをセットアップしてウェブアプリケーションに追加する
アドミンページでMetaframeを設定する
Metaframeの基本的な設定を行います：
- アドミンページでプロジェクトを開きます。
- サイドメニューで、「Metaframe」をクリックします。
- 「Metaframeを作成する」をクリックします。
注意
「Metaframeを作成する」ボタンは、ライセンス契約への署名 を行った後でのみ使用できます。
- 「Metaframeを有効にする」トグルをクリックします。
- 「ログインプロジェクト」フィールドで、前の手順で設定したログインプロジェクトを選択します。
高度なMetaframe機能のセットアップの詳細については、以下を参照してください：
Metaframeをウェブアプリケーションに統合する
Metaframeをアプリに追加するには：
- アドミンページでプロジェクトを開きます。
- サイドメニューで、「Metaframe」をクリックします。
- 「スクリプトコードをコピー」をクリックします。
- 次のいずれかの方法でスクリプトをコードに追加します：
- 下の例に示すように、アプリケーションを初期化する前にHTMLファイルの先頭または本文にスクリプトを挿入します。
Copy
- html
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Integration example</title>
</head>
<body>
<script src="https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js"></script>
<script>
window.metaframe.create({
loginProjectId: '00000000-0000-0000-0000-000000000000',
merchantId: 000001,
projectId: 000001,
orbsApiHostId: '00000000-0000-0000-0000-000000000000',
isMobile: false,
});
</script>
<script src="YOUR_APPLICATION_HERE.js"></script>
</body>
</html>
- 下記の例のように、アプリケーションのJSコード内にスクリプト要素を作成し、スクリプトを読み込んだ後に、
window.metaframe.createメソッドを呼び出します。これにより、Metaframeスクリプトを動的に読み込むことができます。
- 下記の例のように、アプリケーションのJSコード内にスクリプト要素を作成し、スクリプトを読み込んだ後に、
Copy
- javascript
const metaframeScript = document.createElement("script");
metaframeScript.src = "https://cdn.xsolla.net/metaframe-web-wallet-widget-prod/container/v1/metaframe.js";
metaframeScript.onload = () => {
window.metaframe.create(
{
loginProjectId: '00000000-0000-0000-0000-000000000000',
merchantId: 000001,
projectId: 000001,
orbsApiHostId: '00000000-0000-0000-0000-000000000000',
isMobile: false,
}
);
};
document.body.appendChild(metaframeScript);
この記事は役に立ちましたか？
ご意見ありがとうございました！
あなたのメッセージを確認し、体験を向上させるために利用させていただきます。誤字脱字などのテキストエラーを見つけましたか？ テキストを選択し、Ctrl+Enterを押します。
