> For the complete documentation index, see [llms.txt](https://docs.chiliz.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.chiliz.com/jp/kaihatsu/joukyu/fan-token-tenso-tsuiseki.md).

# Fan Token の転送を追跡する

Chiliz Chain 上での Fan Token の動きを追跡することは、お気に入りの token のアクティビティを監視する優れた方法です。これを潜在的なダッシュボードの構成要素として利用することで、データを整理し、何が人気で何がそうでないかについてのインサイトを提供できます。

Fan Token™ の動きを追跡する際、すぐにある課題に直面します。ブロックチェーンから直接データを読み取ることは、現在の状態（「*ウォレット X の残高はいくらか？*」）には効率的ですが、履歴データ（「*過去 1 年間にウォレット X が関与したすべての転送を表示する*」）には非効率です。

これを解決するために、subgraph を使用できます。

## subgraph について

Subgraph は、ブロックチェーンからデータを抽出し、処理し、簡単にクエリできるように保存するカスタム API です。\
データが必要になるたびにブロックチェーンに数百万のブロックをスキャンさせる代わりに、subgraph は特定のイベントが発生するたびにインデックス化し、データベースに保存します。

Chiliz Chain は業界標準のインデックス化プロトコルをサポートしています。プロジェクトのニーズに最適なプロバイダーを選択できます。

* [The Graph](https://thegraph.com/): 分散型インデックス化の業界標準。subgraph をインデクサーの分散型ネットワークに deploy できます。
* [Goldsky](https://goldsky.com/): 高性能なホスト型インデックス化サービス。The Graph のコードと完全に互換性があり（多くの場合まったく同じコードを使用できます）、より高速なインデックス化速度とリアルタイムデータストリーミング機能を提供します。

どちらのツールも同じ開発フレームワークを使用しているため、このページのほとんどの手順は両方に適用できます。

例として、PSG Fan Token の転送を追跡する方法を見てみましょう...

## 0. ツールを選ぶ

**The Graph**（分散型ネットワーク）または **Goldsky**（ホスト型インデクサー）を使用して、Chiliz Chain 上に subgraph を deploy できます。コード構造は同一で、deploy コマンドのみが異なります。

もちろん、それぞれのドキュメントを参照できます。

{% embed url="<https://thegraph.com/docs/en/subgraphs/quick-start/>" %}

{% embed url="<https://docs.goldsky.com/subgraphs/deploying-subgraphs>" %}

## 1. subgraph プロジェクトを初期化する

The Graph と Goldsky はどちらも、graph を作成するための CLI ベースの方法を提供しています。

{% hint style="info" %}
The Graph には [Subgraph Studio](https://thegraph.com/studio/) があり、Web3 を使用して接続し、インターフェースを通じて subgraph を作成できます。

Goldsky では、アカウントを作成すると[ダッシュボード](https://app.goldsky.com/)が提供され、そこから subgraph を作成できます。
{% endhint %}

### Graph CLI をインストールする⁠

ローカルマシンで以下を実行します。

```bash
npm install -g @graphprotocol/graph-cli
```

{% hint style="info" %}
The Graph の CLI ツールを使用して、The Graph の分散型 subgraph、または Goldsky のホスト型 subgraph のいずれかの subgraph を作成できます。

Goldsky には独自の CLI ツールがあり、Goldsky 上に deploy したい場合はこれが必要になります（以下を参照）。
{% endhint %}

### subgraph を初期化する⁠

これを subgraph ページから直接コピーして、特定の subgraph slug を含めることができます。

```bash
graph init --studio <SUBGRAPH_SLUG>
```

`--studio` タグは省略可能です。

PSG Fan Token の例では、以下を使用できます。

```bash
graph init chiliz-psg-fantoken-followup
```

次のように、subgraph に関するいくつかの情報を提供するよう求められます。

<figure><img src="/files/8ba80cvxELTZHYjp7QMW" alt=""><figcaption></figcaption></figure>

contract を block explorer で verify しておく必要があり、CLI が自動的に ABI を取得して subgraph をセットアップします。デフォルト設定では、各イベントに対してエンティティが生成されます。

{% hint style="warning" %}
注意:

* PSG Fan Token のように contract が proxy を使用している場合は、代わりに implementation contract のアドレスを使用してください。これは contract の block explorer ページの「Read/write contract」タブで確認できます。たとえば、[Chiliz Block Explorer 上の PSG Fan token contract についてはこちらを参照してください](https://scan.chiliz.com/token/0xc2661815C69c2B3924D3dd0c2C1358A1E38A3105?tab=read_write_contract)。
  * proxy の implementation contract アドレスを入力する必要があった場合は、プロジェクトのセットアップ後、manifest ファイル（`subgraph.yaml`）に移動し、contract アドレスを proxy のアドレスに変更してください。
* Start Block が自動的に取得されない場合は、contract が作成されたブロック番号を手動で入力できます。これは block explorer から取得できます。
  {% endhint %}

{% hint style="info" %}
subgraph に変更を加える際、主に 3 つのファイルを操作します。

* Manifest（`subgraph.yaml`）: subgraph がどのデータソースをインデックス化するかを定義します。
* Schema（`schema.graphql`）: subgraph から取得したいデータを定義します。
* AssemblyScript Mappings（`mapping.ts`）: データソースから schema で定義されたエンティティへデータを変換します。
  {% endhint %}

`subgraph.yaml` を開き、manifest ファイルが正しいネットワークを指していることを確認します。

```yaml
dataSources:
  - kind: ethereum
    name: FanToken
    network: chiliz  # Use 'chiliz' for Mainnet, chiliz-testnet for Spicy
    source:
      address: "0x..." 
      abi: FanToken
```

### subgraph をコンパイルする

最後に、エラーがないことを確認するために subgraph をコンパイルします。

```bash
graph codegen && graph build
```

## 2. Deploy と Publish

subgraph がビルドされたら、それを deploy するプロバイダーを選択します。

{% columns %}
{% column %}
**The Graph**

1. [Subgraph Studio](https://thegraph.com/studio/) に接続し、subgraph を作成して deploy キーをコピーします。
2. CLI を通じて認証します:\
   `graph auth --studio <DEPLOY_KEY>`
3. subgraph を Subgraph Studio に deploy します:\
   `graph deploy --studio <SUBGRAPH_SLUG>`
4. Studio に移動し、subgraph を開いて「Publish」をクリックし、subgraph を分散型ネットワークにミントします。\
   これにより、ウォレットを通じてトランザクションがトリガーされ、subgraph が NFT として Arbitrum One ネットワーク上に publish されます。
   {% endcolumn %}

{% column %}
**Goldsky**

1. [Goldsky](https://app.goldsky.com/) に移動し、「Project Settings」で API キーを作成し、CLI 経由でログインします。
2. `goldsky` コマンドをインストールします:\
   `curl https://goldsky.com | sh`\
   次に、CLI を通じて認証します:\
   `goldsky login`
3. subgraph を Goldsky にアップロードします:\
   `goldsky subgraph deploy / --path`

Goldsky の subgraph は deploy 後すぐに稼働します。追加の publish 手順は不要です。
{% endcolumn %}
{% endcolumns %}

{% hint style="info" %}
バージョンラベルの入力を求められます。`v0.0.1` のような値を入力できますが、形式は自由に選択できます。完了すると、Studio ページで subgraph の同期が開始されるのが確認できます。
{% endhint %}

{% hint style="info" %}
subgraph が Chiliz Chain からデータをインデックス化している場合でも、The Graph の smart contract はすべて [Arbitrum One](https://arbitrum.io/arbitrum-101) 上にあります。
{% endhint %}

## 3. subgraph にクエリする

おめでとうございます！選択したサービスのダッシュボードで見つけられる subgraph のクエリ URL に GraphQL クエリを渡すことで、クエリを開始できます。

例:

{% columns %}
{% column %}
**The Graph**

`https://gateway-arbitrum.network.thegraph.com/api/[APIKEY]/subgraphs/id/[ID]`
{% endcolumn %}

{% column %}
**Goldsky**

`https://api.goldsky.com/api/public/project_[KEY]/subgraphs/[SLUG]/1.0.0/gn`
{% endcolumn %}
{% endcolumns %}

これで、詳細を入力するだけで、このエンドポイントへの GraphQL クエリの送信を開始できます。

## 付録

### サンプルクエリ

このクエリは、PSG Fan Token のすべてのトランザクションを表示します。

```typescript
const axios = require('axios');

// The GraphQL query (Identical for both providers)
const graphqlQuery = `{
  transfers {
    from
    to
    value
    transactionHash
  }
}`;

// Choose the right URL format depending on the provider:
// const queryUrl = 'https://gateway-arbitrum.network.thegraph.com/api/[api-key]/subgraphs/id/[id]'
// const queryUrl = 'https://api.goldsky.com/api/public/project_[key]/subgraphs/[slug]/1.0.0/gn';

const graphQLRequest = {
  method: 'post',
  url: queryUrl,
  data: {
    query: graphqlQuery,
  },
};

// Send the GraphQL query
axios(graphQLRequest)
  .then((response) => {
    // Handle the response here
    const data = response.data.data
    console.log(data)

  })
  .catch((error) => {
    // Handle any errors
    console.error(error);
  });
```

### サンプルコード

```json
{
  "data": {
    "transfers": [
      {
        "from": "0x26a3e78fa4d2cbebf6b59b2f84b8fb7c61b52d28",
        "to": "0xdca23d02923d01779fb22959bd2575d64eab4535",
        "value": "1500",
        "transactionHash": "0x000309e9cd3f550e8965381bbd83a35c5cee18f26c33a357f9dbb57450d594ea"
      },
//      ...
  }
}
```

これをクエリ URL に渡すと、次の結果が返されます。

```json
{
  transfers {
    from
    to
    value
    transactionHash
  }
}
```

## 追加リソース

GraphQL を使用して subgraph からデータをクエリする方法の詳細については:

{% embed url="<https://thegraph.com/docs/en/subgraphs/querying/best-practices/>" %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.chiliz.com/jp/kaihatsu/joukyu/fan-token-tenso-tsuiseki.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.