[[397787]]

本文轉載自微信公眾號「區塊鏈研究實驗室」，作者鏈三豐。轉載本文請聯系區塊鏈研究實驗室公眾號。

過去，開發人員通過構建自己的集中式索引服務器從區塊鏈中提取數據，將數據存儲在數據庫中，并通過API進行公開。這需要大量的工程和硬件資源，并且破壞了分散化所需的重要安全性。

本文將向大家介紹如何在去中心化Web基礎架構-區塊鏈數據上輕松部署API。

分散Web基礎架構

分布式互聯網的構想和發展方向通常稱為Web3，Web3通過以下附加功能增強了我們今天所知道的互聯網：

• 去中心化
• 可驗證的
• 不信任
• 自我管理

為了實現分散化，協議定義了網絡，這些網絡提供了一系列數字服務，例如計算，存儲，帶寬，身份以及其他沒有中介的Web基礎結構。這些協議通常分布在多個節點(服務器)上，使大部分希望成為網絡并提供服務的任何人都能參與。

在圖上建立

在本文中，我們還將研究一種這樣的協議Graph，以及如何使用以太坊區塊鏈中存儲的數據來構建和部署我們自己的GraphQL API。

Graph是一個索引協議，用于查詢以太坊等區塊鏈和IPFS等網絡，任何人都可以構建和發布稱為子圖的開放API，從而使數據易于訪問。

子圖定義了您希望通過GraphQL API提供的數據，數據源和數據訪問模式。作為一個開發人員可以選擇使用一個子已經部署的其他開發人員，或者定義和部署自己的子圖，并使用它。

子圖由幾個主要部分組成：

1. GraphQL模式

GraphQL模式定義您要保存和查詢的數據類型/實體，您還可以在架構中定義諸如關系和全文搜索功能之類的配置。

2.子圖清單(yaml配置)

清單定義了子圖索引的智能合約，它們的ABI，這些合約中要注意的事件以及如何將事件數據映射到Graph Node存儲并允許查詢的實體。

3. AssemblyScript映射

AssemblyScript映射使您可以保存要使用架構中定義的實體類型建立索引的數據;該圖表CLI還使用子圖的模式的組合與智能合約的ABI一起產生AssemblyScript類型。

開始建造

現在我們對Graph及其工作原理有了很好的了解，讓我們開始編寫一些代碼。

在本教程中，我們將構建一個子圖，用于從Zora智能合約查詢NTF數據，實現用于獲取NFT及其所有者的查詢，并在它們之間建立關系。

先決條件：

為了在本教程中取得成功，您應該在計算機上安裝Node.js，我建議您使用NVM或FNM管理Node.js的版本。

在圖資源管理器中創建圖項目

首先，打開Graph Explorer，然后登錄或創建一個新帳戶。接下來，轉到儀表板，然后單擊“添加子圖”以創建一個新的子圖。

使用以下屬性配置子圖：

1. 子圖名稱-Zoranft子圖
2. 字幕-用于查詢NFT的子圖
3. 可選-填寫說明和GITHUB URL屬性

使用Graph CLI初始化新的子圖

接下來，安裝Graph CLI：

$ npm install -g @graphprotocol/graph-cli 
# or 
$ yarn global add @graphprotocol/graph-cli 

安裝Graph CLI后，您可以使用Graph CLIinit命令初始化一個新的子圖。

兩種方法：

1 從示例子圖中

$ graph init --from-example <GITHUB_USERNAME>/<SUBGRAPH_NAME> [<DIRECTORY>] 

2 來自現有的智能合約

如果您已經將智能合約部署到以太坊主網或測試網之一，則從該合約初始化新的子圖是啟動和運行的簡便方法。

$ graph init --from-contract <CONTRACT_ADDRESS> \ 
  [--network <ETHEREUM_NETWORK>] \ 
  [--abi <FILE>] \ 
  <GITHUB_USER>/<SUBGRAPH_NAME> [<DIRECTORY>] 

在我們的例子中，我們將使用Zora令牌合約，因此我們可以通過使用--from-contract標志傳遞合約地址來從該合約地址進行初始化：

$ graph init --from-contract 0xabEFBc9fD2F806065b4f3C237d4b59D9A97Bcac7 --network mainnet  \ 
--contract-name Token --index-events 
? Subgraph name › your-username/Zoranftsubgraph 
? Directory to create the subgraph in › Zoranftsubgraph 
? Ethereum network › Mainnet 
? Contract address › 0xabEFBc9fD2F806065b4f3C237d4b59D9A97Bcac7 
? Contract Name · Token 

此命令將根據作為參數傳入的合同地址生成一個基本子圖--from-contract。通過使用此合同地址，CLI將在項目中初始化一些內容以幫助您入門。

子圖的主要配置和定義位于subgraph.yaml文件中，子圖代碼庫由幾個文件組成：

• subgraph.yaml：包含子圖清單的YAML文件。
• schema.graphql：一個GraphQL架構，用于定義為子圖存儲的數據以及如何通過GraphQL查詢數據。
• AssemblyScript映射：從以太坊中的事件數據轉換為架構中定義的實體的AssemblyScript代碼。

我們將使用的subgraph.yaml中的條目是：

• description(可選)：子圖是什么的可讀描述，子圖部署到Hosted Service時，圖資源管理器將顯示此描述。
• repository(可選)：可在其中找到子圖清單的存儲庫的URL。
• dataSources.source：子圖來源的智能合約的地址，以及要使用的智能合約的abi。
• dataSources.source.startBlock(可選)：數據源從其開始索引的塊的編號。
• dataSources.mapping.entities：數據源寫入存儲的實體，每個實體的架構都在schema.graphql文件中定義。
• dataSources.mapping.abis：一個或多個命名ABI文件，用于源合同以及您在映射中與之交互的任何其他智能合同。
• dataSources.mapping.eventHandlers：列出該子圖所響應的智能合約事件以及映射中的處理程序(示例中為./src/mapping.ts)，這些處理程序將這些事件轉換為商店中的實體。

定義實體

使用The Graph，您可以在schema.graphql中定義實體類型，并且Graph Node將生成用于查詢該實體類型的單個實例和集合的頂級字段。每種應為實體的類型都必須使用@entity指令進行注釋。

我們將要建立索引的實體/數據是Token和User。這樣，我們可以索引用戶以及用戶自己創建的令牌。

為此，請使用以下代碼更新schema.graphql：

type Token @entity { 
  id: ID! 
  tokenID: BigInt! 
  contentURI: String! 
  metadataURI: String! 
  creator: User! 
  owner: User! 
} 
type User @entity { 
  id: ID! 
  tokens: [Token!]! @derivedFrom(field: "owner") 
  created: [Token!]! @derivedFrom(field: "creator") 
} 

通過@derivedFrom(來自文檔)通過“關系”

可以通過@derivedFrom字段在實體上定義反向查找。這會在實體上創建一個虛擬字段，可以查詢該虛擬字段，但無法通過映射API手動設置。

相反，它是從另一個實體上定義的關系派生的。對于此類關系，存儲關系的兩邊幾乎沒有意義，并且僅存儲一側而派生另一側時，索引和查詢性能都將更好。

現在，我們已經為我們的應用程序創建了GraphQL模式，我們可以在本地生成實體，以開始在mappingsCLI所創建的實體中使用：

graph codegen 

為了使工作中的智能合約，事件和實體變得容易且類型安全，Graph CLI從子圖的GraphQL模式和數據源中包含的合約ABI的組合中生成AssemblyScript類型。

使用實體和映射更新子圖

現在，我們可以配置subgraph.yaml以使用我們剛剛創建的實體并配置它們的映射。

為此，請先dataSources.mapping.entities使用User和Token實體更新字段：

entities: 
  - Token 
  - User 

接下來，更新，dataSources.mapping.eventHandlers使其僅包括以下兩個事件處理程序：

eventHandlers: 
  - event: TokenURIUpdated(indexed uint256,address,string) 
    handler: handleTokenURIUpdated 
  - event: Transfer(indexed address,indexed address,indexed uint256) 
    handler: handleTransfer 

最后，更新配置以添加startBlock：

source: 
  address: "0xabEFBc9fD2F806065b4f3C237d4b59D9A97Bcac7" 
  abi: Token 
  startBlock: 11565020 

Assemblyscript映射

接下來，打開src / mappings.ts來編寫我們在子圖subgraph中定義的映射eventHandlers。

使用以下代碼更新文件：

import { 
  TokenURIUpdated as TokenURIUpdatedEvent, 
  Transfer as TransferEvent, 
  Token as TokenContract 
} from "../generated/Token/Token" 
import { 
  Token, User 
} from '../generated/schema' 
export function handleTokenURIUpdated(event: TokenURIUpdatedEvent): void { 
  let token = Token.load(event.params._tokenId.toString()); 
  token.contentURI = event.params._uri; 
  token.save(); 
} 
export function handleTransfer(event: TransferEvent): void { 
  let token = Token.load(event.params.tokenId.toString()); 
  if (!token) { 
    token = new Token(event.params.tokenId.toString()); 
    token.creator = event.params.to.toHexString(); 
    token.tokenID = event.params.tokenId; 
    let tokenContract = TokenContract.bind(event.address); 
    token.contentURI = tokenContract.tokenURI(event.params.tokenId); 
    token.metadataURI = tokenContract.tokenMetadataURI(event.params.tokenId); 
  } 
  token.owner = event.params.to.toHexString(); 
  token.save(); 
  let user = User.load(event.params.to.toHexString()); 
  if (!user) { 
    user = new User(event.params.to.toHexString()); 
    user.save(); 
  } 
} 

這些映射將處理創建，傳輸或更新新令牌的事件。當這些事件觸發時，映射會將數據保存到子圖中。

運行構建

接下來，讓我們運行一個構建以確保正確配置了所有內容。為此，請運行以下build命令：

$ graph build 

如果構建成功，則應該在根目錄中看到一個新的構建文件夾。

部署子圖

要進行部署，我們可以deploy使用Graph CLI運行該命令。要進行部署，您首先需要為在Graph Explorer中創建的子圖復制Access令牌：

接下來，運行以下命令：

$ graph auth https://api.thegraph.com/deploy/ <ACCESS_TOKEN> 
$ yarn deploy 

部署子圖后，您應該看到它顯示在您的儀表板中：

當您單擊子圖時，它應該打開Graph資源管理器：

查詢數據

現在我們位于儀表板中，我們應該能夠開始查詢數據了。運行以下查詢以獲取令牌及其元數據的列表：

{ 
  tokens { 
    id 
    tokenID 
    contentURI 
    metadataURI 
  } 
} 

我們還可以配置訂單方向：

{ 
  tokens( 
    orderBy:id, 
    orderDirection: desc 
  ) { 
    id 
    tokenID 
    contentURI 
    metadataURI 
  } 
} 

或選擇跳過某些結果以實現一些基本分頁：

{ 
  tokens( 
    skip: 100, 
    orderBy:id, 
    orderDirection: desc 
  ) { 
    id 
    tokenID 
    contentURI 
    metadataURI 
  } 
} 

或查詢用戶及其相關內容：

{ 
  users { 
    id 
    tokens { 
      id 
      contentURI 
    } 
  } 
} 

更新子圖

如果我們想要對子圖進行一些更改然后重新部署，我們應該怎么辦?假設我們要向子圖添加新功能，假設我們除了現有的查詢功能外，還想添加該功能以按創建NFT的時間戳進行排序。

為此，我們需要先向實體添加一個新createdAtTimestamp字段Token：

type Token @entity { 
  id: ID! 
  tokenID: BigInt! 
  contentURI: String! 
  metadataURI: String! 
  creator: User! 
  owner: User! 
  "Add new createdAtTimesamp field" 
  createdAtTimestamp: BigInt! 
} 

現在，我們可以重新運行代碼生成：

graph codegen 

接下來，我們需要更新映射以保存此新字段：

// update the handleTransfer function to add the createdAtTimestamp to the token object 
export function handleTransfer(event: TransferEvent): void { 
  let token = Token.load(event.params.tokenId.toString()); 
  if (!token) { 
    token = new Token(event.params.tokenId.toString()); 
    token.creator = event.params.to.toHexString(); 
    token.tokenID = event.params.tokenId; 
    // Add the createdAtTimestamp to the token object 
    token.createdAtTimestamp = event.block.timestamp; 
    let tokenContract = TokenContract.bind(event.address); 
    token.contentURI = tokenContract.tokenURI(event.params.tokenId); 
    token.metadataURI = tokenContract.tokenMetadataURI(event.params.tokenId); 
  } 
  token.owner = event.params.to.toHexString(); 
  token.save(); 
  let user = User.load(event.params.to.toHexString()); 
  if (!user) { 
    user = new User(event.params.to.toHexString()); 
    user.save(); 
  } 
} 

現在我們可以重新部署子圖：

$ yarn deploy 

子圖重新部署后，我們現在可以按時間戳查詢以查看最近創建的NFTS：

{ 
  tokens( 
    orderBy:createdAtTimestamp, 
    orderDirection: desc 
  ) { 
    id 
    tokenID 
    contentURI 
    metadataURI 
  } 
}} 

 【編輯推薦】