新着：HeliusがLight Protocolを買収
Solanaのトークンゲーティング - Solana Mobileチュートリアル
ブログ/開発

Solanaのトークンゲーティング - Solana Mobileチュートリアル

インテグレーションエンジニアXの0xSolanaGirl
読了時間：8分
目次

はじめに

2023年初頭、Solana Mobileはブロックチェーン対応のスマートフォンを発表しました。現在15,000台以上がアクティベートされているSolana Sagaは、ウォレット体験に統合されたチップレベルのシード保管庫により、オンチェーンのセキュリティを強化するカスタムAndroidデバイスです。ただし、モバイルウォレット体験はSagaだけのものではありません。同じモバイルウォレットアダプターにより、クロスプラットフォームでリリースする開発者の複雑さを軽減する標準フローが提供されます。では、Sagaの特徴は何でしょうか？

Saga所有者になるための通過儀礼として、ユーザーはソウルバウンドNFTであるSaga Genesis Tokenをミントします。このトークンコレクションは、Solana Sagaユーザーの主要アドレスを正確に一覧化し、コミュニティを中心とした施策を可能にします。Saga Genesis Tokenにより、コミュニティへのエアドロップはかつてないほど簡単になりました。しかし、ユーザーのウォレットがリサイクルショップのように急速にアイテムで埋まるなか、Saga保有者コミュニティと関わるための専用ソリューションを検討する時期かもしれません。その選択肢の1つが、ユーザーにカスタマイズされた限定体験を提供する、トークンゲート型dAppの開発です。 

トークンゲーティングとは、接続されたウォレットのトークン所有状況に基づいて、クライアント側に情報を表示する仕組みです。個人が情報にアクセスできるかどうかを制御し、Saga DAOのようなコミュニティへの限定アクセスを提供するために利用できます。このチュートリアルでは、Saga Genesis Tokenをゲーティング対象コレクションの例として、HeliusのDAS APIとReact Nativeを使用したSolanaトークンゲート型dAppの構築方法を解説します。トークンアドレスと条件を変更すれば、任意のトークングループを対象にこのチュートリアルとデモを応用できます。GitHubリポジトリはこちらです：@helius_labs/saga-token-gating-tutorial。

環境設定

このチュートリアルでは、USBCケーブルでSolana Sagaに接続したPCを使用します。Sagaがない場合は、AndroidエミュレーターまたはAndroidデバイスでも問題ありません。開発者モードを有効にしたSagaでテストし、PCにAndroid SDKツールと最新バージョンのNodeJSがインストールされている場合は、以下の手順を省略できます。

モバイル開発向けにSagaを設定するには、設定画面を開き、ビルド番号を検索します。「デベロッパーになりました！」というポップアップが表示されるまで、この項目を7回タップします。開発者向けオプションを検索して有効にし、同じドロップダウンでUSBデバッグを有効にします。

コンピューターにNodeJSがインストールされ、v20.9.0にアップグレードされていることを確認します。Android SDKツールをインストールし、ANDROID_HOME変数を設定します。

Git Bashを使用して、HeliusのGitHubからデモリポジトリをクローンし、コードエディターで開きます。Git Bashのコマンドプロンプトでappフォルダーにcdし、yarnを実行してアプリをインストールします。デバイスを接続するかAndroidエミュレーターを起動した状態で、次のコマンドを入力してアプリを実行します。

コード
yarn react-native run-android

Solana Sagaのトークンゲーティング

トークンゲーティングのワークフローの概要は次のとおりです。

  1. ユーザーがウォレットでセッションを承認し、公開鍵をdAppに提供します。
  2. dAppがsearchAssets DAS APIエンドポイントからデータを取得します。
  3. レスポンスのJSONを分割代入して結果にアクセスします。
  4. 結果を検証し、トークンの所有状況を判定します。
  5. 検証状態を設定し、それに応じてクライアントをレンダリングします。

それでは、コードを詳しく見ていきます。まず、ユーザーとそのSolana Genesis Tokenの所有状況に関する情報を取得するため、Helius DAS APIへのリクエストを構築します。

Saga Genesis Tokenに関する情報を取得するため、SagaGenesisToken変数にコレクションのトークンアドレスを設定します。他のコレクションにトークンゲーティングを適用する場合は、この変数を別のトークンアドレスに置き換えます。

リクエストにはHelius APIキーが必要ですが、このチュートリアルでは意図的に空欄にしています。キーを安全に扱う最適な方法は、プロキシサーバーを使用してリクエストを転送することです。@helius_labs/helius_rpc_proxyリポジトリには、ワンクリックでデプロイできるCloudflare Workerが含まれており、APIキーを隠したままRPC URLとして使用できます。

コード
import { PublicKey } from "@solana/web3.js";

export default async function findSagaGenesisToken(address: PublicKey) {
  // Replace this with the token address you want to gate for
  const SagaGenesisToken = '46pcSL5gmjBrPqGKFaLbbCmR6iVuLJbnQy13hAe7s6CC';

  // Populate your Helius API key
  const HELIUS_APIKEY = '';
  const url = `https://mainnet.helius-rpc.com/?api-key=${HELIUS_APIKEY}`

  const response = await fetch(url, {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      jsonrpc: '2.0',
      id: 'my-id',
      method: 'searchAssets',
      params: {
        ownerAddress: address.toString(),
        grouping: ["collection", SagaGenesisToken],
        page: 1,
        limit: 10
      },
    }),
  });

  const { result } = await response.json();
  return (result.items)
};

findSagaGenesisToken関数はユーザーのウォレットアドレスを引数として受け取り、Helius RPC URLに送信するPOSTリクエストのパラメーターで使用します。

このリクエストでは、searchAssetsメソッドを使用し、ownerAddressが所有し、特定のcollectionでグループ化されたアセットを検索します。その後、APIレスポンスをJSON形式にし、分割代入して結果にアクセスします。

以下は、Saga Genesis Tokenの所有を示すレスポンスです。

コード
{
   "items":[
      {
         "authorities":[Array],
         "burnt":false,
         "compression":[Object],
         "content":[Object],
         "creators":[Array],
         "grouping":[Array],
         "id":[Token_Address],
         "interface":"V1_NFT",
         "mutable":true,
         "ownership":[Object],
         "royalty":[Object],
         "supply":[Object]
      }
   ],
   "limit":10,
   "page":1,
   "total":1
}

以下は、Saga Genesis Tokenを所有していないウォレットのレスポンスです。

コード
{
   "items":[],
   "limit":10,
   "page":1,
   "total":0
}

この関数を使用するには、screensフォルダーに移動してMainScreen.tsxを見つけます。アプリはこの関数コンポーネントをメイン画面としてレンダリングします。ここでは、関数などの追加コンポーネントをインポートし、ユーザーインターフェースで使用できます。

トークンゲーティング関数を呼び出すには、findSagaGenesisToken関数をインポートし、コールバック関数内に配置します。ここでは、ユーザーが接続ボタンを押したときにコールバック関数が呼び出されるため、この関数をhandleConnectPress()と命名しています。

コード
// Checks if the user's wallet has a Saga Genesis Token
const handleConnectPress = useCallback(async () => {
  return await transact(async (wallet: Web3MobileWallet) => {
    const authorizationResult = await authorizeSession(wallet);

    const message = "Confirm that you own this wallet.";
    const messageBuffer = new Uint8Array(
      message.split("").map((c) => c.charCodeAt(0))
    );

    const signedMessages = await wallet.signMessages({
      addresses: [authorizationResult.address],
      payloads: [messageBuffer],
    });

    const verified = sign.detached.verify(
      messageBuffer,
      signedMessages[0],
      authorizationResult.publicKey.toBytes()
    );

    if (verified) {
      const result = await findSagaGenesisToken(authorizationResult.publicKey);

      // Checks that user has exactly 1 Saga Genesis Token
      if (result.length === 1) {
        setVerified(true);
      } else {
        setVerified(false);
      }
    } else {
      setVerified(false);
    }
  });
}, [authorizeSession]);

非同期コールバック関数内で、@solana-mobile/mobile-wallet-adapterのtransact関数を呼び出し、セッションの承認に使用できるWeb3MobileWalletオブジェクトを公開します。

このプロトコルは利用可能なウォレット（デフォルトではPhantom）に移動してセッションを開始します。ユーザーはアプリに戻る前に、ウォレットのインターフェースでアプリケーションを承認する必要があります。ウォレットの所有権を検証するため、ユーザーはメッセージに署名する必要があります。

このチュートリアルでは、検証をサーバー側で行います。ただし、本番アプリではアカウント所有権の正当性を確保するため、APIを通じてバックエンドでメッセージを検証する必要があります。

ユーザーのウォレットが承認されると、承認結果を分割代入して公開鍵を取得できます。取得したpublicKeyを使用して、Saga Genesis Tokenの所有状況を検索できます。

ユーザーの公開鍵を指定してfindSagaGenesisTokenを呼び出すと、DAS APIにリクエストが送信され、見つかったトークンの結果が配列で返されます。ユーザーがSaga Genesis Tokenをちょうど1つ所有している場合は、検証状態をtrueに設定します。それ以外の場合は、検証状態をfalseに設定します。 

検証状態に基づいて、画面とコンポーネントを条件付きでレンダリングします。このチュートリアルで使用する状態は、接続待機中、検証済み、未検証です。

Mainscreen.tsxには、検証状態に基づいて情報を表示する方法を簡略化した条件付きレンダリングロジックがあります。GitHubリポジトリを変更したり参照したりして、さらにカスタマイズできます。実装例として、トークンゲーティングをReact Native Navigationに接続し、条件に応じて画面間を移動する方法があります。

トークンゲーティングの用途

トークンゲーティングはWeb3で登場した新しい概念で、アセットの所有によってコンテンツへのアクセス権が付与されます。このロジックは、セキュリティ、消費財、出版、流通などの分野に応用できます。

Discordのセキュリティツールでは、コミュニティ向けのトークンゲーティングを使用し、所有しているトークンの種類や数量に基づいてアクセスを制限します。

消費財やサービスの分野では、トークンゲーティングに基づいて、事業者がコミュニティにクーポン、割引、販売機会を提供できます。

これにより、アセット所有の有用性が高まり、デジタルアセットを現実世界の用途に活用する、より具体的な方法が生まれます。

アセット所有を収益化し、カスタマイズされた体験を提供することで、メディアやコンテンツ分野の可能性が広がります。

トークンゲーティングで構築できるものの例をいくつか紹介します。

  • 限定紹介コードとクーポン
  • Substack形式のブログ
  • エアドロップの請求 
  • 非公開ダッシュボード 
  • ゲーム要素を取り入れたストーリーテリングdApp
  • 秘密のグループチャット 
  • オンチェーンアンケート
  • カスタマイズされたゲーム特典やイベント

DAS APIを使ったトークンゲーティングの優れた点は、どのトークンでも使用できることです。NFTグループチャットでメンバーに最低保有数の確認を求めるのと同様に、DeFiアプリではアクセス条件として一定量以上のSolana保有をユーザーに求められます。同じDAS APIのロジックを使用して、SPLトークン、NFT、SFT、SBT、cNFTを対象にdAppをゲーティングできます。

まとめ

このチュートリアルでは、DAS APIを使用してReact Native製dAppにトークンゲーティングを実装する方法を簡潔に紹介しました。このロジックは任意のコレクションやトークンに適用でき、特定のユースケースに合わせて調整できます。トークンゲーティング体験はコミュニティに限定性と価値をもたらします。Saga Genesis Tokenは強力なコミュニティへのエアドロップを可能にし、クリエイターとユーザーの双方に多くの機会を生み出します。Web3では、デジタル商品の自己管理型所有が可能になります。これにより、アセット所有によって結び付いたコミュニティが生まれます。Solana Sagaが物理技術とデジタル技術を融合し、Solanaネイティブの体験を提供するなか、その体験を強化し、報いるアプリケーションを構築する必要があります。利益の追求にとどまらず、トークンゲーティングは新しいインターネット時代におけるデジタルアセット所有の活用を促進します。

Saga向けモバイルdApp開発について、さらに詳しく知りたいですか？15,000人以上のSaga所有者が集まるSaga DAOに参加し、最新のdAppリリース、特典、報酬に関する情報をいち早く入手しましょう。このトークンゲーティングのチュートリアルから実装のヒントを得た方は、Helius Discordで開発者コミュニティと交流し、Heliusブログで最新情報を確認してください。Heliusとともに、最も高性能なテクノロジー上で構築し、ブロックチェーンの普及を加速させましょう。

その他のリソース

関連記事

Heliusを購読

Solana開発の最新情報や新しい記事の公開通知を受け取れます

拡大画像