ArcBlock — docs

AFS

ARC 裡 AFS 的路徑、provider、能力和查詢契約的開發者文件。

Author a provider

Start a provider from the current JSON provider and its conformance suite, then declare only enforceable capabilities.

Core contract

Use the AFS path operations through the capabilities declared by the provider that owns each path.

Browse AFS with the Explorer

Use the AFS Explorer blocklet to browse, inspect, and preview any mounted AFS path from a browser, with URLs that map 1:1 onto AFS paths.

Get started with AFS

Inspect the installed AFS command surface before choosing a provider, mount, or path.

Inspect a local AFS surface

Run a verified, mostly read-only inspection of mounts and paths on a named arc version without inventing storage myths.

AFS

Use AFS to address provider-backed resources through paths, capabilities, and explicit operations in ARC.

Provider catalog

Use tiered admission so only evidence-backed providers appear as public integrations—not the full repository package list.

Providers

Understand AFS providers as capability-owning modules that expose resources through paths.

AFS recipes

Repeatable AFS tasks verified on a named arc version, with explicit environment and mutation boundaries.

AFS reference

Terminology index and stable pointers to AFS operations, capabilities, errors, and related boards.

Runtime boundaries

Separate mounts, permissions, instance state, local validation, and formal publish so inspection never rewrites a user's environment by accident.

Search and query

Choose list, typed collection query, or provider-defined free-text search by their different contracts.

Agent Access

How an external agent discovers, connects to, authenticates against, and uses a blocklet running on ARC.

Access tiers

A request passes four independent gates: the method allowlist, the credential, the path policy, and the provider's capabilities. A credential clears one of them, not all four.

AFS over HTTP

A JSON-RPC endpoint that exposes the same AFS operations as the MCP tools, for clients that do not speak MCP.

Authorize a client

Follow the challenge from a rejected call to the authorization server, register the client, obtain a credential, and use it, plus what the credential leaves closed.

Connect your tool

Add a blocklet to Claude Code or Codex CLI, and sign in when you need more than public reads.

Connect a client

Point an MCP client at a blocklet host over streamable HTTP, then confirm the connection with an anonymous tools/list that needs no handshake.

Declare what agents see

A blocklet declares its content collections once. The declaration decides which agent-facing surfaces each collection reaches, and whether an anonymous caller can read it.

Credentials without a browser

Use the device grant when the client has no browser to redirect to: request, have someone approve, poll, and receive a blocklet- access key.

Discovery surfaces

Four documents under /.well-known/ describe the MCP endpoint, its authentication requirement, and its authorization server. All four are anonymous GETs.

Endpoints

Every path an agent uses, the method it takes, whether it needs a credential, and which component serves it.

Errors

Every failure an agent can hit, what caused it, and what to do, separated into transport failures and in-call failures, because they mean different things.

llms.txt

A short pointer document that names the agent surfaces on a host, plus per-collection shards for the collections that declared an llms face.

Agent access

Every blocklet running on ARC exposes an MCP endpoint and a set of discovery documents, so an external agent can find it, connect, and read what the blocklet has declared.

Tools

Eight generic AFS tools are always present. Three content tools appear only when the blocklet declares collections, and their schemas name those collections.

Understand agent access

The model behind the endpoints: what decides whether a call succeeds, what a blocklet chooses to expose, and which surface to use for which client.

AIGNE CLI

AIGNE Framework 的官方命令列工具，用來簡化 agent 的建立、執行和除錯。

內建應用程式

AIGNE CLI 附帶預先封裝的應用程式，提供專門、開箱即用的功能。這些應用程式是完整的 AIGNE 專案，您可以直接執行，無需先初始化本地專案。

命令參考

AIGNE 命令列介面 (CLI) 是您建立、管理和部署 AIGNE agent 的主要工具。本節為所有可用指令及其選項提供了詳盡的參考，並加以整理以便快速查詢。

aigne create

aigne create 命令會從範本搭建一個新的 AIGNE 專案。它會設定必要的目錄結構和設定檔，讓您能立即開始開發您的 agent。

aigne deploy

aigne deploy 指令會將您的 AIGNE 應用程式打包並部署為 Blocklet，發佈到指定的 Blocklet Server 端點。這是將您的 Agent 發佈以供生產環境使用的標準方法，使其能作為一個獨立、可執行的服務來存取。

aigne hub

aigne hub 指令是您管理 AIGNE Hub 連線的中央工具。Hub 提供對受管理的大型語言模型的存取、處理 API 金鑰管理，並追蹤您的點數使用情況。正確設定您的 Hub 連線對於執行使用 Hub 所提供模型的 Agent 至關重要。

aigne observe

aigne observe 指令會啟動一個本地 Web 伺服器，用於監控和分析 Agent 執行資料。它提供了一個使用者友善的介面，讓您能檢視追蹤記錄、查看詳細的呼叫資訊，並理解您的 Agent 在執行期間的行為。這個工具對於除錯、效能調校以及深入了解您的 Agent 如何處理資訊並與各種工具和模型

aigne run

aigne run 指令是執行 AIGNE agent 的主要方式。它可以從本機專案目錄或直接從遠端 URL 執行 agent。它提供了一套靈活的選項，用於提供輸入、設定 AI 模型和處理輸出，包括用於對話式 agent 的互動式聊天模式。

aigne serve-mcp

將 AIGNE 專案中的 Agent 作為模型情境協定（MCP）伺服器來提供服務。此命令透過可串流的 HTTP 端點公開您的 Agent，從而實現與支援 MCP 標準的外部系統和應用程式的無縫整合。

aigne test

aigne test 指令為您的 agents 和技能執行自動化測試。它提供了一個內建的單元和整合測試機制，以確保您的 agents 及其所依賴的工具在部署前能正常運作。

貢獻

我們很高興您有興趣為 @aigne/cli 做出貢獻！您的幫助對於改善所有人的 AIGNE 開發體驗至關重要。無論是修復錯誤、提出新功能，還是改進文件，我們都歡迎您的貢獻。

Agents 與技能

在 AIGNE 生態系統中，Agents 和技能是為您的 AI 應用程式注入生命力的基本建構模組。它們協同運作，以建立由工具增強的複雜 AI 系統。您可以將 Agent 想像成負責推理和對話的大腦，而將技能視為其用來執行動作並與外部世界互動的工具。

核心概念

一個 AIGNE 專案提供了一個用於開發、測試和部署 AI agent 的結構化環境。專案的核心是一個目錄，其中包含定義您的 agent、它們可以使用的技能以及它們所連接的語言模型的設定檔。本節將詳細介紹這些基本組成部分。

專案設定 (aigne.yaml)

aigne.yaml 檔案是您 AIGNE 專案的核心。它作為中央清單，定義了專案的元資料、語言模型設定，以及其核心組件（如 agents 和技能）之間的關係。一個結構良好的 aigne.yaml 是建立一個強大且有組織的 agent 的第一步。

入門指南

本指南將引導您完成安裝 AIGNE CLI、建立新專案以及執行您的第一個 AI agent 的基本步驟。完成後，您將擁有一個在本機運行的 agent。

指南

歡迎來到 AIGNE CLI 指南。本節提供實用的逐步教學，旨在幫助您掌握常見的開發工作流程。無論您是正在建立您的第一個自訂 Agent、從遠端儲存庫執行程式碼，還是為生產環境準備您的應用程式，這些指南都將為您提供必要的說明。

建立自訂 Agent

本指南提供逐步教學，說明如何建立新的 JavaScript Agent，並將其作為技能整合至您的 AIGNE 專案中。Agent 是核心的可執行元件，賦予您的應用程式獨特的功能。透過建立自訂 Agent，您可以擴充 AI 的功能，以執行專門任務、與外部 API 互動或操作本機資料。

部署 Agent

部署您的 AIGNE 專案會將其從本地開發設定轉變為一個稱為 Blocklet 的獨立、可分發的應用程式。這讓您的 Agent 能夠在生產環境中運行、與他人分享，並無縫整合到更廣泛的 Blocklet 生態系統中。aigne deploy 指令會自動化整個打包和部署過程。

執行遠端 Agent

AIGNE CLI 不僅限於執行本地檔案系統中的專案。它還提供了一項強大的功能，可以直接從遠端 URL 執行 Agent。這對於測試、分享和執行 Agent 非常有用，無需克隆儲存庫或手動下載檔案。

總覽

您的 Agent 開發指令中心@aigne/cli 是 AIGNE Framework 的官方命令列工具，旨在簡化 Agent 開發的整個生命週期。它提供了一套全面的指令，可簡化專案建立、本機執行、測試和部署，讓您能輕鬆建置、執行和管理 AIGNE 應用程式。主要功能@aigne/cli 充滿了各種

AIGNE Framework

面向真實 LLM 應用的 agent 框架：函數式、可組合、TypeScript 優先。

Agent 函式庫

Agent 函式庫提供一系列預先建置、可重複使用的 Agent，旨在加速複雜 AI 應用程式的開發。透過整合這些現成的元件，您可以輕鬆協調複雜的工作流程、管理並行任務，並自動化多步驟流程，而無需從頭開始建構一切。

Bash

本文件詳細介紹 Bash Agent，它允許在 Agent 工作流程中安全地執行 shell 腳本和命令列工具。您將學習如何設定其沙箱環境、管理命令權限，以及將其整合到您的應用程式中以進行系統級操作。

Orchestrator

Orchestrator Agent 提供一個結構化且可靠的解決方案，用於管理複雜的多步驟 AI 工作流程。它將高階目標分解為一系列可管理的任務，按順序執行它們，並將結果綜合成一個最終、連貫的回應，從而實現自主的任務規劃和執行。

進階主題

在您掌握核心概念並建構了基礎應用程式後，就可以開始探索 AIGNE 框架更精密的功能。本節專為尋求建構複雜、穩健且高度客製化 AI 應用程式的開發者而設計。在此，我們將深入探討進階模式與工具，讓您能更好地控制 Agent 的定義、提示工程、執行生命週期以及資料處理。

使用 YAML 定義 Agent

AIGNE 框架支援使用 YAML 設定檔來定義 Agent 的聲明式方法。此方法將 Agent 的定義（其屬性、指令和技能）與應用程式的業務邏輯分開，從而促進了更好的組織性、可重用性，並使複雜的 Agent 系統更易於管理。

鉤子

鉤子提供了一種強大的機制，用於觀察、攔截和注入自訂邏輯到 agent 的執行生命週期中。它們讓您可以在不更改 agent 核心實作的情況下，新增日誌記錄、監控、輸入/輸出轉換和自訂錯誤處理等功能。

提示詞

與 AI 模型進行有效溝通，取決於所提供提示詞的品質與結構。AIGNE 框架透過其 PromptBuilder 類別和整合的 Nunjucks 範本引擎，提供了一個強大的系統，用於建立動態、可重複使用且結構化的提示詞。本指南將系統性地解釋這些元件。

串流

AIGNE 框架為處理來自 Agent 的串流回應提供了強大的支援。這對於需要即時資料處理的應用程式特別有用，例如聊天機器人、即時資料摘要或任何能從即時、漸進式更新中受益的使用者介面。透過在資料可用時立即處理，您可以創造更具響應性和互動性的使用者體驗。

Agent 類型

AIGNE 框架提供了一套專門的 Agent 類型，每種類型都設計用於執行特定功能。雖然所有 Agent 都繼承自基礎的 Agent 類別，但這些專門的實作提供了預先建構的功能，可用於常見任務，從與 AI 模型互動到協調複雜的工作流程。了解這些類型是建構穩健且高效應用程式的關鍵。

AI Agent

AIAgent 是與大型語言模型 (LLM) 互動的主要元件。它作為 ChatModel 的直接介面，可實現複雜的對話式 AI、函數呼叫 (工具使用) 和結構化資料提取。此 Agent 負責處理提示建構、模型叫用、回應解析和工具執行迴圈的複雜性。

Function Agent

FunctionAgent 提供了一種直接的方法來封裝現有的 TypeScript 或 JavaScript 函式，從而將它們提升為 AIGNE 框架內的一級 Agent。這使得自訂的商業邏輯、外部 API 互動或任何任意程式碼能夠無縫整合到 Agent 工作流程中，無需大量樣板程式碼。

Image Agent

ImageAgent 是一個專門負責生成圖片的 Agent。它作為 ImageModel 的介面，處理輸入資料以形成提示，然後請求圖片生成服務來創建圖片。

MCP Agent

MCPAgent 是一個專門設計用於與遵循模型情境協定 (Model Context Protocol, MCP) 的外部系統互動的 Agent。它扮演著橋樑的角色，讓您的 AIGNE 應用程式能夠連接到遠端的 MCP 伺服器，並利用其功能——例如工具、提示和資源——就像它們是框架的原生元件一樣。這

Team Agent

TeamAgent 是一種專門的 Agent，它負責協調一組其他的 Agent（稱為「技能」）來執行複雜的任務。它扮演著管理者的角色，根據定義好的策略來引導資訊流並協調其技能的執行。這使得我們可以創建複雜的工作流程，讓多個專業的 Agent 協同合作，以達成單一 Agent 無法獨力完成的目標。

Transform Agent

TransformAgent 是一種專門的 agent，提供了一種使用 JSONata 表達式來宣告式轉換結構化資料的方法。它非常適合需要將資料從一種格式對應、重組或轉換為另一種格式，而無需複雜命令式邏輯的場景。

核心概念

若要有效使用 AIGNE 框架建置應用程式，必須先了解其基本的架構元件。本節將對主要建構區塊及其互動提供一個高層次的概覽。清楚地掌握這些概念將有助於更直觀的開發流程。

Agents

在 AIGNE 框架中，Agent 是工作的基本單位。它是一個抽象類別，為所有專門的 Agent 類型建立了一個標準契約。一個 Agent 可以被概念化為一個能夠執行特定任務、處理資訊以及與系統中其他 Agent 互動的獨立工作者。每一個專門的 Agent，無論是設計用於與 AI 模型互動、轉換資料

AIGNE

AIGNE 類別是框架的核心執行引擎。它協調多個 Agent 來建構複雜的 AI 應用程式，作為 Agent 互動、訊息傳遞和整體執行流程的主要協調點。

記憶體

MemoryAgent 為 Agent 提供了一種機制，使其能夠在多次互動中維持狀態並記住資訊。它作為一個特化的協調器，不直接處理訊息，而是透過兩個關鍵元件來管理記憶體操作：用於儲存資訊的 Recorder 和用於回憶資訊的 Retriever。這種關注點分離的設計，實現了彈性且可插拔的記憶體儲存解

模型

模型是特化的 Agent，作為一個關鍵的抽象層，為與外部 AI 服務 (例如大型語言模型 (LLM) 和圖像生成平台) 的互動提供了一個標準化介面。它們封裝了 API 通訊的複雜性，讓開發者能透過一個一致且統一的合約來與各種 AI 供應商合作。

快速入門

本指南提供設定開發環境並使用 AIGNE 框架執行您的第一個 AI agent 所需的步驟。整個過程設計在 30 分鐘內完成，為您提供一個實用、動手的入門體驗，以了解該框架的基本工作流程。

範例

探索一系列實用的範例，展示 AIGNE 框架的各種功能和工作流程模式。本節提供可動手執行的演示，幫助您理解智慧對話、MCP 協議整合、記憶體機制以及複雜的 Agentic 工作流程。

AFS Local FS

本指南將示範如何建置一個能與您本機檔案系統互動的聊天機器人。透過利用 AIGNE 檔案系統 (AFS) 和 SystemFS 模組，您可以賦予 AI agent 搜尋、讀取和管理您電腦上檔案的能力，使其成為一個強大的本機資料專家。

聊天機器人

本指南全面介紹了基於 Agent 的聊天機器人範例。您將學習如何在不同模式下執行聊天機器人、將其連接到各種 AI 模型提供商，並使用 AIGNE 可觀測性工具來偵錯其執行過程。本範例旨在開箱即用，讓您無需任何本地安裝即可開始使用。

MCP Blocklet

本文件說明如何利用 AIGNE 框架和模型情境協定（Model Context Protocol, MCP）與託管在 Blocklet 平台上的應用程式進行互動。此範例支援一次性執行、互動式聊天模式，以及模型和 I/O 管線的自訂設定。

MCP DID Spaces

本文件提供了一份透過模型情境協定（Model Context Protocol, MCP）將聊天機器人與 DID Spaces 整合的綜合指南。遵循這些說明，您將能夠建立一個 AI Agent，該 Agent 可以安全地存取和管理去中心化儲存環境中的檔案，並利用 AIGNE 框架的功能。

MCP GitHub

本文件為一份綜合指南，介紹一個範例，示範如何使用 AIGNE 框架和 GitHub MCP (Model Context Protocol) 伺服器與 GitHub 存放庫互動。您將學習如何設定和執行此範例，讓 AI agent 能夠執行各種 GitHub 操作，例如搜尋存放庫和管理檔案。

MCP Puppeteer

本指南逐步示範如何將 AIGNE 框架與 Puppeteer MCP 伺服器結合使用，以實現自動化網頁抓取。透過此範例，您將學習如何建構並執行一個能夠瀏覽網站並擷取其內容的 AI Agent。

MCP Server

本指南說明如何將 AIGNE 框架 Agent 作為模型上下文協議 (Model Context Protocol, MCP) 伺服器執行。讀完本文件後，您將能夠啟動伺服器，將其連接到 AI 模型，並使用像 Claude Code 這樣與 MCP 相容的用戶端與您的 Agent 互動。

MCP SQLite

本指南全面介紹如何使用由 AIGNE 框架驅動的 AI agent 與 SQLite 資料庫進行互動。透過遵循這些步驟，您將學會如何設定必要的元件、執行範例應用程式，並使用 agent 執行建立資料表和查詢資料等資料庫操作。

記憶體

本指南將示範如何建構一個能夠跨會話保留對話歷史的具狀態聊天機器人。透過利用 FSMemory 外掛程式，Agent 可以將會話資料持久化到本地檔案系統，使其能夠回憶先前的互動。

DID Spaces 記憶體

本指南將示範如何使用 DID Spaces 建構具備永久記憶體的聊天機器人。透過利用 AIGNE 框架中的 DIDSpacesMemory 外掛程式，您的 agent 能夠以去中心化且安全的方式，在多個會話之間保留對話歷史記錄。

Nano Banana

本指南將示範如何建構並執行一個能夠生成圖片的聊天機器人。透過遵循這些步驟，您將學習如何執行一個預先建置的 AIGNE 範例、將其連接到 AI 模型，並使用框架的可觀測性工具來檢視其行為。

工作流程程式碼執行

執行由 AI 模型動態產生的程式碼會帶來重大的安全性和可靠性挑戰。本指南提供了一個結構化的逐步流程，說明如何使用 AIGNE 框架建立安全的程式碼執行工作流程。您將學習如何編排一個產生程式碼的 Coder Agent，以及一個在隔離環境中執行程式碼的 Sandbox Agent。

工作流程並行性

並行執行任務可以顯著提高複雜工作流程的效率。本指南將示範如何使用 AIGNE 框架建立一個並行工作流程，其中多個 Agent 同時處理相同的輸入，並將其輸出進行匯總。您將學習如何設定並執行一個實際範例，該範例會同時從不同角度分析一個產品。

工作流程群組聊天

本指南將示範如何使用 AIGNE 框架建構並執行多 Agent 群組聊天工作流程。您將學習如何協調多個 Agent（包括一位管理者）協同完成一項任務，模擬一個團隊環境，讓他們共享訊息並共同合作以達成共同目標。

工作流程交接

本指南將示範如何建立一個工作流程，讓一個 Agent 可以無縫地將控制權交接給另一個專門的 Agent。讀完本指南後，您將了解如何建立多 Agent 系統，該系統能根據使用者輸入來委派任務，從而實現更複雜和動態的問題解決方案。

工作流程編排

本指南將示範如何建構並執行一個精密的工作流程，該流程可協調多個專業的 AI Agent。您將學習如何協調 finder（尋找者）、writer（寫作者）和 proofreader（校對者）等 Agent，讓它們共同合作完成一項複雜的任務，從初步研究到最終報告的產出。

工作流反思

您是否曾需要 AI 不僅能生成內容，還能批判並改進自己的工作成果？本指南將示範如何建立一個自我修正的工作流，其中一個 Agent 的輸出會由另一個 Agent 審查和完善。透過遵循這些步驟，您將學會如何使用 AIGNE 框架實現這個強大的迭代模式。

工作流路由器

您是否曾經需要根據使用者查詢的內容，將其導向不同的專門處理程式？本指南提供了一個完整、逐步的教學，教您如何建立一個能夠智慧路由請求的工作流。您將學習如何建立一個「分流」Agent，該 Agent 會分析輸入並將其轉發給正確的專門 Agent，例如產品支援或意見回饋收集。

循序工作流程

本指南將示範如何使用 AIGNE 框架建構並執行循序工作流程。您將學習如何將多個 Agent 串聯在一起，其中一個 Agent 的輸出會成為下一個 Agent 的輸入，從而建立一個逐步處理的管線。此模式非常適合需要一系列明確、有序操作的任務。

模型

AIGNE 框架設計為模型無關 (model-agnostic)，讓您可以連接各種第三方 AI 模型供應商。這種靈活性是透過一個模型適配器系統實現的，其中每個適配器都為特定服務（如 OpenAI、Anthropic 或 Google Gemini）提供標準化介面。

AIGNE Hub

AIGNE Hub 提供一個統一的代理層，用於存取來自多個供應商的各種大型語言模型（LLM）、圖像和影片生成服務。透過使用 @aigne/aigne-hub 套件，您可以無縫切換不同的 AI 模型，而無需更改您的用戶端應用程式邏輯，將所有請求導向一個單一、一致的 API 端點。

Anthropic

本指南提供透過 @aigne/anthropic 套件在 AIGNE 框架內設定和使用 Anthropic 的 Claude 模型的說明。內容涵蓋 API 金鑰設定、模型實例化，以及呼叫模型以獲得標準和串流回應。

AWS Bedrock

@aigne/bedrock 套件提供了 AIGNE 框架與 Amazon Web Services (AWS) Bedrock 之間直接且穩固的整合。這讓開發人員能夠在其 AIGNE 應用程式中，利用 AWS Bedrock 提供的各種基礎模型，既能享受 AWS 可擴展且安全的基礎設施，又能維持一

模型設定

若要在 AIGNE 框架中整合並利用各種 AI 模型，您必須先設定必要的憑證，主要透過環境變數來完成。這能確保與各自的第三方服務進行安全且適當的驗證。本指南提供了每個支援的模型供應商所需的特定環境變數。

DeepSeek

本指南說明如何透過 @aigne/deepseek 套件在 AIGNE 框架中設定和使用 DeepSeek 模型。內容涵蓋 API 金鑰設定、模型實例化，以及標準和串流回應的範例。

Doubao

@aigne/doubao 套件提供了 AIGNE 框架與豆包強大的語言和圖像生成模型之間的無縫整合。本指南為在您的 AIGNE 應用程式中設定和使用豆包模型提供了完整的參考。

Google Gemini

本指南提供透過 @aigne/gemini 套件在 AIGNE 框架中設定和使用 Google Gemini 模型的說明。內容涵蓋 API 金鑰設定、模型選擇，以及可用於聊天、圖片和影片生成的特定功能。

Ideogram

本文件為開發者提供了一份全面的指南，說明如何在 AIGNE 框架內整合並使用 Ideogram 的圖片生成功能。@aigne/ideogram 套件為 Ideogram 的 API 提供了一個無縫介面，能夠從文字提示生成高品質的圖片。

LMStudio

@aigne/lmstudio 套件提供了一個模型適配器，用於將 AIGNE 與透過 LM Studio 在本地託管的大型語言模型 (LLM) 整合。這讓開發者能夠在 AIGNE 框架內利用本地模型的強大功能，提供更佳的隱私性、控制權和成本效益。

Ollama

@aigne/ollama 套件在 AIGNE 框架與透過 Ollama 本地託管的 AI 模型之間提供了無縫整合。這讓開發者能夠利用在自有硬體上運行的各種開源語言模型，確保隱私和對 AI 功能的離線存取。

OpenRouter

OpenRouter 作為一個統一的閘道，可以存取來自各種供應商（包括 OpenAI、Anthropic 和 Google）的多樣化 AI 模型。@aigne/open-router 套件提供了一個標準化介面，可將這些模型整合到 AIGNE 框架中。這使得開發者能夠以最少的程式碼變更在不同模型之間切

OpenAI

@aigne/openai 套件提供了與 OpenAI 模型套件的無縫整合，讓開發者可以直接在 AIGNE 框架內利用 GPT 等服務進行聊天完成、DALL-E 進行圖片生成，以及 Sora 進行影片創作。本文件提供了安裝、設定和使用這些模型的全面指南。

總覽

AIGNE 框架的設計與模型無關，讓開發者可以整合來自不同供應商的各種大型語言模型 (LLM) 和圖像生成模型。這是透過一個標準化的適配器系統來實現的，該系統將每個供應商獨特的 API 抽象化為一個一致的介面。

Poe

使用者想要修正 D2 圖表的語法錯誤。錯誤訊息 invalid style keyword: "font-family" 指出 font-family 在 D2 中不是一個有效的樣式屬性。我需要在 D2 程式碼中移除或修正此行。

xAI

本指南提供在 AIGNE 框架內設定和使用 xAI 語言模型（特別是 Grok）的說明。內容涵蓋了必要套件的安裝、API 金鑰的設定、模型的實例化，以及標準和串流調用的範例。

總覽

AIGNE 框架是一個功能性 AI 應用程式開發框架，旨在簡化並加速建構可擴展、Agent 式 AI 應用程式的過程。它結合了函式程式設計概念、強大的人工智慧功能和模組化設計，為開發者提供一個結構化的環境。

使用者指南

歡迎閱讀 AIGNE 使用者指南。本指南專為非技術背景的讀者設計，包括企業領導者、管理人員以及任何對於如何利用 AI 自動化複雜任務、簡化業務流程感興趣的人。您無需具備任何程式設計知識即可輕鬆閱讀。

常見工作流程

在 AIGNE 框架中，單一 Agent 可以執行特定任務。然而，當多個 Agent 協作解決更複雜的問題時，才能真正發揮系統的強大威力。就像團隊成員一樣，Agent 可以被組織起來以結構化的方式協同工作。這些協作模式被稱為「工作流程」。

決策制定

說明一個「管理員」Agent 分析請求，並決定哪個專業 Agent 最適合處理該任務的情境。

並行任務

在某些情況下，您需要同時執行多個獨立的任務以提高效率。並行任務工作流程就是為此目的而設計的。它允許多個 AI Agent 同時處理相同的初始資訊，並在最後收集和合併它們各自的結果。

循序任務

循序任務工作流程會按照特定、預定的順序處理一系列任務。其運作方式如同數位裝配線，前一個步驟的輸出會成為下一個步驟的輸入。這種模式非常適合多階段流程，其中每個步驟都建立在前一個步驟的基礎之上。

瞭解 Agent

在 AIGNE 框架中，「agent」是完成工作的基本建構模組。您可以將 agent 想像成一位專業的數位工作者，受僱來執行特定任務。每個 agent 都有明確的角色和一套技能。就像在現實世界的團隊中，您可以將單一任務指派給一個 agent，或組建一個 agent 團隊來處理更複雜的專案。

Agent 團隊

雖然單一、專業的 Agent 對於特定任務很有用，但有些問題對於單一 Agent 來說過於龐大或複雜，無法獨自處理。就像在人類組織中一樣，當一項任務需要多個步驟或多樣化的技能時，您會組建一個團隊。在 AIGNE 中，Agent 團隊是一群被組織起來協作解決更大目標的 Agent。

基礎 Agent

您可以將基礎 Agent 想像成一個專業的數位助理，就像一個樂於助人的聊天機器人或一個專注的資料輸入員。每個 Agent 都被設計用來執行一種特定類型的任務並將其完美完成。它根據一組明確的指令運作，接收特定的輸入進行處理，並產生結果。

什麼是 AIGNE？

AIGNE（發音為 [ˈei dʒən]，類似 "agent" 去掉 "t" 的音）是一個用於開發 AI 應用程式的函式化框架。它旨在透過結合函式化程式設計、模組化設計和強大的人工智慧功能，來簡化和加速建構可擴展的現代應用程式的過程。

AIGNE Hub

多家 LLM 供應商的統一適配層，同時管理所有 Blocklet 的 API key 用量。

API 參考

本文件提供了 AIGNE Hub RESTful API 的技術規格。遵循本指南，您將了解如何進行身份驗證並與聊天完成、圖片生成和嵌入等核心端點進行互動，從而實現與您的應用程式的穩健後端整合。

API 驗證

對 AIGNE Hub API 的請求進行安全驗證，是程式化存取與整合的關鍵步驟。本指南提供一個清晰、逐步的流程，說明如何使用 API 金鑰來授權您的應用程式，確保所有互動都是安全且能被正確識別的。

聊天補全

本文件提供聊天補全 API 端點的詳細規格。遵循本指南，您將學習如何生成對話式 AI 回應、管理串流以及利用模型特定參數來建構穩健的應用程式。此端點是建立互動式、基於文字體驗的核心。

嵌入 (Embeddings)

本文件提供了 AIGNE Hub Embeddings API 端點的詳細規格。遵循本指南，您將學會如何將文字轉換為數值向量表示，這是語義搜尋、文字分群和相似度分析等任務的基礎步驟。

圖片生成

本文件提供了圖片生成端點的技術規格。透過本指南，您將能夠透過建構請求、指定模型和參數以及處理生成的圖片資料，將由 AI 驅動的圖片創建功能整合到您的應用程式中。

部署情境

選擇正確的部署模型對於使 AIGNE Hub 符合您的特定營運和業務目標至關重要。本文件概述了兩種主要的部署情境，提供清晰的比較以指導您的架構決策。每種模式都旨在解決從內部企業使用到面向公眾的商業服務等不同用例。

企業自架託管

在您自己的基礎架構內部署 AIGNE Hub，能讓您的組織完全掌控 AI 模型存取、資料隱私和營運成本。本指南提供一個結構化的方法，說明如何設定和管理一個自架託管的 AIGNE Hub 實例，以供安全的企業內部使用。

服務提供者模式

準備好提供您自己的多租戶 AI 服務了嗎？本指南詳細介紹如何在 AIGNE Hub 中啟用服務提供者模式。您將學習如何啟用基於點數的計費系統、整合 Payment Kit，並定義自訂定價，為您的使用者建立一個可營利的 AI 閘道。

核心功能

本節將深入技術探討 AIGNE Hub 的關鍵功能。閱讀完畢後，您將瞭解該平台的主要能力，從統一的 AI 模型互動和供應商管理，到強大的安全性和詳細的分析，為利用該系統奠定堅實的基礎。

用量與成本分析

了解 AI 模型的使用情況對於管理成本、監控效能和確保資源公平分配至關重要。本文件詳細介紹了如何查詢用量統計、追蹤成本，以及解讀 AIGNE Hub 用於分析和報告的資料模型。

供應商管理

有效管理上游 AI 供應商對於維持可靠且具成本效益的 AI 閘道至關重要。AIGNE Hub 將此流程集中化，提供統一的介面來連接、設定和管理各種 AI 服務的憑證。本節詳細說明處理供應商設定、憑證和模型費率的程序。

安全性與存取控制

一個安全且管理良好的系統對於任何企業級部署都至關重要。本節詳細介紹 AIGNE Hub 健全的安全架構，涵蓋身份驗證、憑證管理、存取控制和日誌記錄，以確保您 AI 營運的完整性和機密性。

入門指南

本指南提供一個直接、以任務為導向的路徑，來部署和操作 AIGNE Hub。遵循這些步驟，即可在 30 分鐘內配置一個功能齊全的實例，從而能夠立即與上游 AI 供應商和下游應用程式整合。

總覽

您是否正在為管理日益增多的 API 金鑰、計費系統以及不同 AI 供應商的整合而苦惱？本文件將全面介紹 AIGNE Hub，這是一個統一的 AI 閘道，旨在簡化這種複雜性。您將了解其核心功能、主要優勢和系統架構，從而清楚地認識其在基礎設施管理方面的價值。

版本發行說明

本文件詳細記錄了 AIGNE Hub 的所有重要變更、新功能和錯誤修復。DevOps 和 SRE 團隊可利用此資訊追蹤平台的演進，了解每次更新的影響，並據此安排升級計畫。

AIGNE Studio

用視覺化方式搭建 LLM 工作流和 AI agent，不需要寫程式。

Introduce

Overview

Guide

Overview

Start AI Studio

Before you start, you need to install the DID wallet, you can refer to https://support.didwallet.io/howToDownload to complete the wallet download and

AIGNE WebSmith

建在 AIGNE Framework 上的網站生成工具，由 AI 驅動。

進階功能

當您掌握了生成和更新網站的基礎知識後，您可以探索 AIGNE WebSmith 的進階功能，以獲得更細緻的控制，並添加獨特、強大的視覺元素。本節將介紹如何管理您的元件庫，並利用特殊元件來打造更具動態和吸引力的頁面。

使用自訂元件庫

由 AIGNE WebSmith 產生的網站是由一系列預先設計的視覺元素（稱為元件）所構成。雖然 WebSmith 包含一套標準元件，但您可以使用 Pages Kit 專案來定義和管理一個自訂元件庫。這讓您可以根據自身需求量身打造設計和功能。本節將說明如何使用 component pull 指令，將

使用特殊元件

AIGNE WebSmith 包含一個特殊元件庫，旨在以最少的設定為您的網站添加強大的視覺和互動元素。這些預先建構的元件處理複雜的功能，讓您能高效地創造引人入勝的使用者體驗。

終端機播放器

終端機播放器 (Terminal Player) 是一個特殊元件，用於在您的網站上顯示互動式的預錄終端機操作過程。此元件是一個有效的工具，能以清晰且可重播的格式，展示命令列指令、軟體安裝過程，或引導使用者完成技術流程。

入門指南

本指南將引導您以最快的方式建立一個可運作的網站：安裝 AIGNE CLI、收集來源資料、執行 aigne web generate、批准計畫，並檢視產生的頁面——所有操作一氣呵成。

指南

需要管理您網站的日常營運嗎？本節提供常見操作的逐步指南，例如建立網站、發佈更新、管理翻譯以及自訂外觀與風格。請遵循這些教學，讓您的網站順利運行。

清理工作區

本指南將引導您安全地執行 aigne web clear，無論您是想清除生成的頁面、重置快取資料，還是在交付專案前移除授權權杖。

建立網站

本指南將引導您使用單一指令，將您的原始資料轉換為一個可上線的網站。您將檢視可用的 aigne web generate 旗標，核准 AI 產生的網站地圖，並了解完成的頁面在磁碟上的存放位置。

自訂佈景主題

一致的顏色、排版和間距能讓您的網站看起來更專業。本指南將引導您完成使用 AI 輔助產生新的 WebSmith 佈景主題，並將其套用至您線上網站的確切指令。

互動模式（Beta）

注意：互動模式目前處於 Beta 階段。雖然功能齊全，但您可能會遇到非預期的行為。在我們持續改善此體驗的過程中，感謝您的回饋。使用本指南啟動 aigne web chat，以自然語言與 WebSmith 對話，並讓助理代表您觸發生成／更新／發布操作。chat 指令提供了一個互動式、對話式的介面，用

本地化網站

使用本指南執行 aigne web translate，選擇您想要的頁面和語言，並儲存已本地化的版本，以便與您的主要網站一同發佈。

管理偏好設定

本指南將說明如何設定 aigne web prefs，包含如何列出已儲存的規則、啟用或停用它們，以及移除不再需要的項目。

Publish Website

網站產生後，最後一步就是讓它在線上可供存取。本指南涵蓋了使用 AIGNE WebSmith 發佈您網站的各種方法，確保您可以選擇最符合您技術和預算需求的選項。

發佈至現有網站

使用本指南來設定 aigne web publish，使其部署至您已在營運的 ArcBlock 驅動網站，包括 URL 輸入和服務授權。

發布至新的專用網站

本指南將引導您完成付費的 aigne web publish 路徑，此路徑會佈建一個全新的託管網站，涵蓋付款流程，並可接續任何進行中的部署作業。

發布至 WebSmith Cloud

本指南將引導您使用 aigne web publish 指令，將網站發布至免費的 WebSmith Cloud 託管選項，內容涵蓋從指令調用到首次授權及驗證線上 URL 的完整流程。

新增頁面

使用 AIGNE WebSmith 擴展您的網站非常簡單。本指南將說明如何使用 aigne web add-page 命令將新頁面無縫整合到您的網站結構中，並自動更新內容和內部連結。

更新網站

使用本指南選擇正確的更新工作流程，然後深入了解有關結構或頁面級別變更的詳細子指南。

管理更新歷史記錄

本指南將引導您稽核 WebSmith 所做的所有變更。aigne web history 命令會記錄每一次的產生或更新操作，讓您始終清楚知道變更了什麼、何時發生，以及為何套用該回饋。

移除頁面

需要清理您的網站結構嗎？本指南將說明如何使用 aigne web remove-page 指令來安全地刪除頁面、自動尋找因此產生的任何損壞連結，並重新生成受影響的內容以維護網站的完整性。

更新頁面

當您需要對單一頁面執行 aigne web update 指令時，請使用本指南。這包括重寫區塊、插入新模組、重新排序區塊或刪除過時內容，而不會更改網站的其餘部分。

更新結構

當您想使用 aigne web generate 重塑網站地圖時，例如在批准計畫前新增或移除頁面，請遵循本指南。

總覽

本文件旨在對 AIGNE WebSmith 提供高層次的介紹。閱讀完畢後，您將理解其核心目的、關鍵功能，以及它用來自動化建立專業網站的基本工作流程，從初期規劃到最終發布。

參考資料

本節提供 AIGNE WebSmith 的詳細技術資料，專為尋求有關指令、配置選項、素材準備和授權的具體、深入資訊的使用者而設計。若需實用的逐步指南，請參閱入門或指南章節。

命令參考

本參考列出了 AIGNE WebSmith CLI 的所有可用命令，包括別名、參數和使用範例。

Config 參考

config.yaml 檔案是您網站生成的核心控制面板。了解其設定可讓您自訂 AI 輸出的各個方面，從頁面結構到內容語氣。本指南提供了完整、逐欄位的參考，以協助您精確地修改您的網站。

準備材料

在您執行 aigne web generate 之前，一個出色的網站就已經開始了。本指南為您提供了一份具體的清單，用於收集簡報、來源文件和證明，以便 WebSmith 能夠建立反映您需求、引用正確證據並減少修改次數的頁面。

問題排查

本指南協助你診斷和修復使用 AIGNE WebSmith 時的常見問題。如果在生成、發布或設定過程中遇到問題，請查看以下場景的解決方案。

發佈日誌

本文件記錄了 AIGNE WebSmith 的所有版本更新，包含新功能、錯誤修復和其他變更，並按版本以降序時間排列。

ARC CLI

ARC 的命令列：在終端機裡宣告、建構、部署和檢查一個站點或一個 Blocklet。

arc afs

arc afs 是 AFS 檔案系統操作的命令組：列目錄、讀寫檔案、刪除、搜尋，執行 action，以及管理掛載。

arc attach

arc attach 把本地目錄反向掛載進一個遠端 arc daemon，當成一個 provider 暴露出去，讓一臺你沒有 shell 權限的機器能通過 AFS 讀到你本地的檔案。

arc blocklet

arc blocklet 覆蓋 blocklet 包和例項的整個生命週期：腳手架、構建、檢查、列表、單個部署，或者整隊部署。

arc collections

arc collections 是 blocklet.yaml 裡 collections: 宣告的編寫工具——目前能做的是掃描 content/ 幫你生成這段片段。

arc completion

arc completion 把 bash / zsh / fish 的補全指令碼打到 stdout——它自己從不寫檔案，落地成檔案是你自己控制的一步。

arc deploy

arc deploy 註冊或釋出一個 blocklet：本地跟 daemon 註冊用於開發，或者釋出到 DID Space（本地或遠端）用於真正的分發。

arc did

arc did 管理身份與信任：生成 DID 身份、簽發和驗證可驗證憑證，以及管理你信任哪些簽發方。

arc drain

arc drain 是一個常駐處理程序，盯著工作臺帳（work ledger），把就緒的工作派給一個空閒 peer，直到就緒集合清空為止。

arc dsl

arc dsl 校驗、檢查、格式化、生成、檢視 AUP DSL 相關的產物，pages/layout.aup 這類檔案用的就是這套語言。

arc mcp

arc mcp 把 stdio 橋接到執行中 AFS daemon 的 MCP endpoint，讓 Claude Desktop 或任何 stdio MCP 客戶端能跟 AFS 對話。daemon 沒跑的話會自動啟動。

arc network

arc network doctor 從這臺機器上探測代理發現、DNS、HTTPS 和 WebSocket 連通性，每一項檢查單獨成行報告。

arc provider

arc provider 處理 provider 包相關的操作，目前是把一個 provider 的 AUP 資源樹釋出到 Cloudflare Pages，讓它能通過 URL 被引用。

arc serve

arc serve 通過 HTTP 或 MCP 啟動一個 AFS 服務，讓 CLI 之外的東西（瀏覽器、agent、MCP 客戶端）能通過網路和你的 AFS 例項對話。

arc service

arc service 管理具名 AFS 後臺例項：list、start、stop、restart、status、delete、gc、url、logs。

arc skill

ARC 內建 how-to booklet：list、按名 show、裝進宿主 .agents/.claude skills。尚不是 gh skill 式包管理，也不盤點 AFS /.skills。

arc space

arc space 管理本地 DID Space 資料：檢視存了什麼、用一條 sync 命令在兩棵子樹之間搬資料，以及對 folder-backed 的 space 做 claim、檢查和修復。

arc upgrade

arc upgrade 把 arc 本身升級到最新發布的版本，或者升級/降級到指定的固定版本。

arc vault

arc vault 是加密金鑰儲存：先 init 一個 vault，然後按 group/name 組織，get/set/list/delete 金鑰。

退出碼

每條 arc 命令都用退出碼報告結果——0 表示成功，另有七個各不相同的非零值（其中一個已預留但還沒有產出）——指令碼不用讀報錯文本就知道遇到的是哪一類失敗。

安裝

用官方安裝器裝上 arc，再讀一遍它列印出來的版本行。

概覽

arc 是操作 ARC 執行時例項的命令列工具：AFS 檔案系統、身份與信任、金鑰、部署、AUP DSL，都通過它來管理。

ArcBlock 徵才

ArcBlock 的職位資訊。

ArcBlock 媒體資源

ArcBlock 的媒體素材說明。

AIGNE Logos

All image resources

ArcSphere Logos

All Brand Assets zip

DID Logos

All image resources

ArcBlock Logos

All image resources

Payment Kit 指南

Payment Kit 的使用說明：核心功能一覽。

How to Configure Additional Payment Methods

This guide explains how to configure additional payment options for EVM-compatible chains. 1. Add a Payment Method (EVM Chain) Navigate toayments → Se

Development Guide

Overview

How to activate the donation feature?

@blocklet/payment-react offers a robust tipping and donation feature. Using the CheckoutDonate component and the optional DonateProvider, developers

Enable SubGuard™ for subscriptions?

Enabling SubGuard™ for your application in Launcher ensures uninterrupted subscription services, even in cases of payment failures. This guide will wa

Payment Kit Event Listening Mechanism

Payment Kit provides two ways to listen for events, enabling you to respond to system events in a timely manner.

Custom Notification Processing Guide

Payment Kit allows applications to handle notifications directly, offering two configuration options.

Welcome to Payment Kit.

Payment Kit is ArcBlock's powerful payment solution designed to help developers quickly and easily integrate diverse payment functionalities into thei

Security

- How to configure and enable the Vault Wallet

User Guides

- Enable SubGuard™ for subscriptions?

How to configure and enable the Vault Wallet

1. Key Features of the Vault Wallet

AI Application Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io Job responsibilities 💡 Depending on individual abilities and interests, you can c

Android Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io

Full-Stack JS Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io Job Responsibilities 💡 You can choose to participate in any of the following jobs

iOS Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io Job Responsibilities Design and implement user-oriented product features, deliver

Join Us

Why join ArcBlock?

JS backend engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io Job Responsibilities Design and implement user-oriented product features, deliver

What is our recruitment process?

What are the steps to successfully join ArcBlock? How should one prepare? You can take a look at two articles written by CEO.

Site Reliability Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io Job Responsibilities Organize and implement comprehensive and automated online ser

UI/UX designer (Filled)

Main responsibilities

WEB Front-end Engineer (Filled)

Please send your resume to apply for this position: hr@arcblock.io

ArcBridge Node

無需信任第三方的跨鏈元件，用於資產跨鏈轉移。

How to add stake for your node?

Login to your ArcBridge Node, and open "Stake" page Click "Add Stake" on the Stake page Input stake amount in the stake dialog: Complete the stake wit

Join ArcBridge

You can join ArcBridge by just run the following blocklet:

ARC 架構

ARC 架構的開發者文件：AFS、AFS UI、AUP、Web Device、Blocklet、身分、資料空間，以及產品沿革的邊界。

AFS UI

Understand AFS UI as the projection of AFS data and capabilities into interactive and site UI, not as a third authoring board equal to AUP or Web Device.

ARC and AFS

Treat AFS as the path and capability layer, and ARC as the runtime shell that hosts mounts, Blocklets, and CLI entry points.

Contracts and evidence

Classify ARC documentation claims as current contract, architecture, experimental, or lineage, and know what evidence each status requires.

Mental model

Use one short vocabulary map for ARC architecture, then open the board that owns each task.

ARC Architecture

Place AFS, AFS UI, AUP, Web Device, Blocklets, identity, and data-space concepts before choosing a task-specific guide.

Product layers

Choose the AFS, AFS UI, AUP, Web Device, Blocklet, or identity layer that owns a task, and keep their contracts separate.

Product lineage and boundaries

Map older ArcBlock product names to current ARC homes without promising full feature equivalence.

Reference

Index of architecture terms and links into AFS, AUP, Web Device, Blocklets, Identity, and ARC CLI boards.

AUP

ARC 裡 AUP 的撰寫、驗證和執行期行為的開發者文件。

Author with DSL

Treat DSL as AUP’s source-first authoring layer and make the JSON-compatibility boundary explicit.

Caller identity and safety

A UI tree can express intent, but identity, path scope, write permission, and embedded trust remain separate server-side decisions.

AUP capability tour

Walk web slideshow as AUP host: 18 primitives + widgets (readonly shells where needed), Markdown surface, and deck media host demos. Hard excludes: rtc and camera-preview only.

CLI diagnostics

Choose the diagnostic that answers the question; no single green command is browser or device acceptance.

Core concepts

Understand AUP from semantic trees, events, sessions, and capabilities instead of inferring the protocol from one renderer.

Custom primitives and Web widgets

Distinguish portable primitives from Web widgets, and acceptance of a custom name from implementation on every target.

Device capabilities and degradation

Let a device report actual primitive capability, then use AUP's explicit degradation chains on limited targets.

App, page, and shell

Declare a compact app manifest, then keep shell, page discovery, and named navigation within one inspectable source boundary.

Components, loops, and i18n

Use compile-time components and loops for source structure; use runtime lists and locale contracts for data and language.

Events, navigation, and visibility

Use current DSL sugar for clicks, named-page navigation, and local updates while keeping visible version-bounded.

Generate, lint, and migrate

Keep DSL source readable, validate its meaning, and materialize JSON only when a compatibility consumer needs it.

DSL language reference

Navigate the DSL by authoring layer, then use the compiler and validation for the exact target-version grammar.

Nodes, values, and sugar

Use readable node sugar for author intent, while knowing the semantic AUP node it compiles into.

DSL source model

Separate editable DSL sources, generated artifacts, and compatibility consumers that still use them.

Events, state, and bindings

Separate reads, writes, server-managed prop bindings, UI state, and user events.

Example: AFS data binding

Use the DSL Showcase list-template source to distinguish a runtime AFS list from a compile-time loop, then verify scope on the actual target.

Example: interaction flow

Use the DSL Showcase overlay source to reason about a multi-step interaction, while keeping source evidence separate from target acceptance.

Example: local state and events

Read the current DSL Showcase `set-sugar` source as a source-level state/event example, not a deployed behavior guarantee.

Example: minimal app

Use the verified `minimal-app` recipe as a bounded end-to-end path, not as a claim of a pure protocol-only scaffold.

Example: Web layout

Use the verified Web Device first site as a static Web layout example, without turning it into a generic interactive-renderer claim.

Examples and evidence

Choose Showcase and recipe examples through registered routes, source, and explicit evidence boundaries.

Build a first AUP app

Use the minimal-app recipe for a verified ARC AUP starting path.

Frames, bridges, and embedded surfaces

Use frames, bridges, and surfaces only with explicit trust, origin, and runtime boundaries.

Get started

Start with a minimal complete app: create, check, run, and inspect AUP.

Live examples: scope and contract

Keep documentation read-only while placing source, runtime output, and the exact acceptance boundary in one reference page.

Nodes, events, and messages

Use a small semantic node contract; keep authoring semantics distinct from renderer transport details.

AUP on Web Device

Separate AUP static-HTML tree rendering, page-layout composition, and Web Device site responsibilities.

AUP

Describe an interface with AUP, author its source with DSL, and run it through ARC on a target device.

Patches, scenes, and capabilities

Understand render-first updates, target-reported capabilities, and the deliberately narrow degradation contract.

Primitive taxonomy and evidence

Separate 18 cross-device primitives, 42 Web-only widgets, and the capabilities an actual target reports.

AUP primitives

Open one page per cross-device AUP primitive: contract, document capability, fallback, and sample boundary.

`action` primitive

Declare a button or navigation action without promising exec on the document target.

`afs-list` primitive

afs-list lists AFS-backed entries; document can render empty or static children, but live path data is not a closed docs contract yet.

`calendar` primitive

Calendar is a structured date surface; document is unsupported and may degrade to table or text.

`canvas` primitive

Canvas is drawing-surface intent; document is unsupported and degrades toward media or text.

`chart` primitive

Chart is a cross-device primitive on full web; static documents must not claim a live chart.

`chat` primitive

Chat is a session-oriented primitive; document has no chat capability chain.

`editor` primitive

Editor can render on document as a local textarea; do not promise a writable IDE or AFS write-back.

`explorer` primitive

Explorer is a composition pattern over list/stat/preview surfaces, not a document widget.

`input` primitive

Author an unbound form control on document; keep bind and write paths off docs pages.

`map` primitive

Map is portable intent for geo surfaces; document is unsupported and degrades toward media or text.

`media` primitive

Bind image, video, audio, or avatar media as a portable media primitive with a docs-safe live image sample.

`overlay` primitive

Reserve overlay for interactive sessions; document reports unsupported and degrades toward text.

`rtc` primitive

RTC is media-permission sensitive; the shared chain ends at unsupported.

`surface` primitive

Surface is a cross-device mount intent; do not confuse it with Web Device layout surfaces.

`table` primitive

Present columnar data as a table primitive; distinguish GFM tables and chart fallback tables.

`text` primitive

Express readable copy, headings, and admonitions as a portable text primitive.

`time` primitive

Show time values with partial document support; do not promise a live clock in static docs.

`view` primitive

Use the portable container primitive for structure, tabs, and steps — not for layout.aup site sections.

Product layers and scope

Decide whether a task belongs to AUP semantics, DSL authoring, a renderer, or a Web Device site.

Reference

Look up AUP nodes, patches, support matrix, DSL, and artifact boundaries by current version.

Release compatibility

Keep CLI/runtime, source checkout, generated artifacts, and Showcase material as separate compatibility evidence.

Renderers, sessions, and support

Separate a loadable source, a target-renderable tree, and an interaction that has actually been accepted.

Run in ARC

Explain how AUP enters renderers, sessions, and concrete device surfaces.

Semantic tree

Describe interface intent with stable ids, types, props, bindings, and children rather than pixels for one device.

Sessions, patches, and scenes

Keep interactive full-tree rendering, incremental patches, and device context separate.

Sources, artifacts, and JSON compatibility

Separate the source ARC reads from generated compatibility artifacts without turning either into a second UI model.

Validate, run, and inspect

Format, check, and directly run minimal-app, then accept its AUP result in a browser.

AUP Web-only widgets

Navigation hub for all 42 AUP_WIDGETS entries — one page per widget; not a multi-widget reference body.

afs-dropzone

AUP Web-only widget `afs-dropzone`: purpose, boundaries, surfaces, fallback, and evidence.

afs-preview

AUP Web-only widget `afs-preview`: purpose, boundaries, surfaces, fallback, and evidence.

afs-stat

AUP Web-only widget `afs-stat`: purpose, boundaries, surfaces, fallback, and evidence.

agent

AUP Web-only widget `agent`: purpose, boundaries, surfaces, fallback, and evidence.

app-footer

AUP Web-only widget `app-footer`: purpose, boundaries, surfaces, fallback, and evidence.

app-header

AUP Web-only widget `app-header`: purpose, boundaries, surfaces, fallback, and evidence.

auto-fire

AUP Web-only widget `auto-fire`: purpose, boundaries, surfaces, fallback, and evidence.

auto-surface

AUP Web-only widget `auto-surface`: purpose, boundaries, surfaces, fallback, and evidence.

block-revealer

AUP Web-only widget `block-revealer`: purpose, boundaries, surfaces, fallback, and evidence.

blocklet-embed

AUP Web-only widget `blocklet-embed`: purpose, boundaries, surfaces, fallback, and evidence.

breadcrumb

AUP Web-only widget `breadcrumb`: purpose, boundaries, surfaces, fallback, and evidence.

broadcast

AUP Web-only widget `broadcast`: purpose, boundaries, surfaces, fallback, and evidence.

camera-preview

AUP Web-only widget `camera-preview`: purpose, boundaries, surfaces, fallback, and evidence.

chip

AUP Web-only widget `chip`: purpose, boundaries, surfaces, fallback, and evidence.

comments-surface

AUP Web-only widget `comments-surface`: purpose, boundaries, surfaces, fallback, and evidence.

deck

AUP Web-only widget `deck`: purpose, boundaries, surfaces, fallback, and evidence.

entity-overview

AUP Web-only widget `entity-overview`: purpose, boundaries, surfaces, fallback, and evidence.

finance-chart

AUP Web-only widget `finance-chart`: purpose, boundaries, surfaces, fallback, and evidence.

frame

AUP Web-only widget `frame`: purpose, boundaries, surfaces, fallback, and evidence.

globe

AUP Web-only widget `globe`: purpose, boundaries, surfaces, fallback, and evidence.

hero-widget

AUP Web-only widget `hero-widget`: purpose, boundaries, surfaces, fallback, and evidence.

key-value-list

AUP Web-only widget `key-value-list`: purpose, boundaries, surfaces, fallback, and evidence.

moonphase

AUP Web-only widget `moonphase`: purpose, boundaries, surfaces, fallback, and evidence.

natal-chart

AUP Web-only widget `natal-chart`: purpose, boundaries, surfaces, fallback, and evidence.

pagination

AUP Web-only widget `pagination`: purpose, boundaries, surfaces, fallback, and evidence.

photo-story

AUP Web-only widget `photo-story`: purpose, boundaries, surfaces, fallback, and evidence.

post-editor

AUP Web-only widget `post-editor`: purpose, boundaries, surfaces, fallback, and evidence.

progress-bar-3d

AUP Web-only widget `progress-bar-3d`: purpose, boundaries, surfaces, fallback, and evidence.

scroll-explainer

AUP Web-only widget `scroll-explainer`: purpose, boundaries, surfaces, fallback, and evidence.

searchable-dropdown

AUP Web-only widget `searchable-dropdown`: purpose, boundaries, surfaces, fallback, and evidence.

skills

AUP Web-only widget `skills`: purpose, boundaries, surfaces, fallback, and evidence.

terminal

AUP Web-only widget `terminal`: purpose, boundaries, surfaces, fallback, and evidence.

text-highlight

AUP Web-only widget `text-highlight`: purpose, boundaries, surfaces, fallback, and evidence.

text-image-expand

AUP Web-only widget `text-image-expand`: purpose, boundaries, surfaces, fallback, and evidence.

ticker

AUP Web-only widget `ticker`: purpose, boundaries, surfaces, fallback, and evidence.

tooltip

AUP Web-only widget `tooltip`: purpose, boundaries, surfaces, fallback, and evidence.

type-block

AUP Web-only widget `type-block`: purpose, boundaries, surfaces, fallback, and evidence.

url-default

AUP Web-only widget `url-default`: purpose, boundaries, surfaces, fallback, and evidence.

webgl-hero

AUP Web-only widget `webgl-hero`: purpose, boundaries, surfaces, fallback, and evidence.

wm

AUP Web-only widget `wm`: purpose, boundaries, surfaces, fallback, and evidence.

wm-surface

AUP Web-only widget `wm-surface`: purpose, boundaries, surfaces, fallback, and evidence.

xeyes

AUP Web-only widget `xeyes`: purpose, boundaries, surfaces, fallback, and evidence.

區塊鏈指南

ArcBlock 區塊鏈的使用說明：功能與說明。

區塊鏈 SDK（Node.js）

@ocap/client 是把應用連到 OCAP Chain 的客戶端函式庫，可用於 Node.js 和瀏覽器。

API 參考

歡迎來到 OCAP Client API 參考文件。本節為所有可用的類別、方法和資料類型，提供了一份全面且可搜尋的參考資料。無論您是在尋找 GraphQL 方法的具體細節、交易輔助工具的參數，還是回應物件的結構，都可以在這裡找到您需要的詳細資訊。

輔助方法

GraphQLClient 類別是與由 OCAP 驅動的區塊鏈互動的主要介面。它提供了一套全面的方法，用於查詢鏈上狀態、發送交易以及訂閱即時事件。此類別的設計旨在能於 Node.js 和瀏覽器環境中無縫運作。

資料類型

本節為整個 OCAP Client API 中使用的所有自訂資料結構、輸入參數和回應物件提供了全面的參考。理解這些類型對於有效與 OCAP 區塊鏈互動至關重要。

低階 API

低階 API 提供了對整個交易生命週期的細粒度控制。與抽象化細節的高階 API不同，這些方法允許您手動建構、編碼、簽署和傳送交易。這對於進階情境非常理想，例如多重簽署工作流程，其中不同方需要在交易廣播前簽署交易。

查詢與變動方法

OCAP 客戶端透過 GraphQL 與區塊鏈互動。方法分為兩大類：

高階 API

交易輔助函式是內建於 OCAP Client 的高階函式，它抽象化了建立和簽署常見交易的複雜性。您可以使用這些便利的方法來處理建立資產、轉移代幣、質押和執行原子交換等工作流程，而無需手動建構交易物件。這些輔助函式確保了交易結構的正確性，並顯著簡化了開發過程。

核心概念

本節深入探討塑造 OCAP Client 程式庫的基本原則與架構決策。了解這些核心概念將有助於您充分發揮程式庫的全部潛力、編寫更有效率的程式碼，並更有效地解決問題。

用戶端架構

OCAP 用戶端採用模組化架構設計，以滿足不同 JavaScript 環境和特定使用情境的需求。它並非提供一個一體適用的函式庫，而是提供多個用戶端實作，每個實作都針對特定情境進行了最佳化，例如 Node.js 後端或對套件大小敏感的網頁應用程式。這種方法讓您可以根據需求選擇最高效的用戶端，從而在必要

事件訂閱

OCAP Client 提供一個功能強大、即時的事件訂閱系統，讓您的應用程式能夠即時監聽鏈上活動。此功能基於 WebSockets 建立，提供與區塊鏈節點的持久連線，無需透過持續輪詢來檢查更新。

Gas 支付

在大多數區塊鏈系統中，每筆交易都需要由發起人支付一筆費用，通常稱為「Gas」。對於可能沒有原生貨幣來支付這些費用的新使用者來說，這可能是一個重大的障礙。OCAP Client 引入了 Gas 支付功能，允許應用程式開發者贊助這些費用，為其使用者創造無縫的「免 Gas」體驗。

交易生命週期

凡是會修改區塊鏈狀態的每個操作，例如轉移代幣或創建資產，都是透過交易來執行的。了解交易的生命週期是使用 OCAP 用戶端建構應用程式的基礎。此過程涉及四個主要階段：準備、編碼、簽署和發送。

快速入門

歡迎！本指南將引導您在 30 分鐘內設定並執行 OCAP Client。您將學習如何安裝用戶端、將您的應用程式連接到與 OCAP 相容的區塊鏈，並進行您的第一次 API 呼叫以驗證您的設定。

基本用法

本指南將引導您完成開始使用 OCAP Client 的基本步驟。您將學習如何初始化客戶端、連接到 ArcBlock Beta 鏈，並執行基本查詢以確保一切設定正確。

安裝

OCAP Client 是一套 JavaScript 函式庫，可將您的應用程式連接到 OCAP 區塊鏈。它同時適用於 Node.js 和瀏覽器環境。本指南將引導您使用套件管理器安裝此用戶端。

操作指南

本節提供實用、逐步的說明，協助您使用 OCAP Client 完成常見任務。每份指南都設計成一份獨立的操作說明，旨在幫助您達成特定目標，從管理帳戶到執行複雜的原子交換。

委派權限

委派權限是一項強大的功能，它允許一個帳戶（委派人）授權另一個帳戶（受派人）代表其發送特定類型的交易。這對於需要為使用者執行操作，但又不想直接存取使用者主私鑰的應用程式特別有用。例如，您可以將權限委派給特定於應用程式的金鑰，以轉移某些資產或與智慧合約互動，透過限制金鑰的權限範圍來增強安全性。

管理帳號

在由 OCAP 驅動的區塊鏈上，帳號本質上是與一個地址相關聯的狀態，由一對加密金鑰（公鑰和私鑰）控制。一個需要理解的關鍵概念是，帳號是隱式創建的。一旦帳號收到第一筆傳入的交易，例如代幣或資產轉移，它就在鏈上正式存在。沒有明確的 createAccount 交易。

管理資產 (NFT)

本指南將全面介紹如何使用 OCAP Client 管理非同質化代幣 (NFT) 的整個生命週期，NFT 也稱為資產。您將學習如何從頭開始建立新資產、更新其屬性、建立資產工廠以進行標準化鑄造，以及從該工廠獲取新資產。

管理代幣

本指南提供了使用 OCAP 用戶端管理同質化代幣的逐步說明。您將學習如何設定一個代幣工廠，它作為您代幣的藍圖，然後用它來鑄造（創建新代幣）和銷毀（摧毀現有代幣）。這些操作是在您的應用程式中創建和管理自訂經濟體系的基礎。

質押代幣與資產

「質押」是將代幣或資產 (NFT) 鎖定給特定接收者的過程，通常是為了保護網路、參與治理或賺取獎勵。本指南將逐步引導您使用 OCAP Client 完成整個質押生命週期，包括建立質押、撤銷質押、取回資產以及因懲罰性原因而削減質押。

轉移代幣和 NFT

本指南將逐步引導您如何使用 OCAP Client 在帳戶之間轉移可替代代幣（包括原生代幣和自訂代幣）以及非同質化代幣（NFT 或資產）。所有轉移操作的主要方法是 client.transfer()。

概覽

OCAP Client 是一個功能強大且多功能的 JavaScript 函式庫，旨在將您的應用程式連接到由 OCAP 驅動的區塊鏈。它提供了一個簡潔、對開發者友好的介面，用於讀寫資料、管理數位資產以及監聽鏈上事件。此客戶端可用於任何 Node.js 或基於瀏覽器的環境，為後端服務和前端應用程式提供單

區塊鏈工具庫

處理錢包、大數和 DID 的工具庫。

@arcblock/did

此套件提供了一個 JavaScript 函式庫，用於處理 ArcBlock 的去中心化身分（DID）協定。它允許您建立、管理和驗證 DID，這些是建構 OCAP 平台應用程式的基礎。本節涵蓋了該函式庫的基本功能。

API 參考文件

本節為 @arcblock/did 函式庫中所有公開函式和型別提供了全面的 API 參考。它包含了可用於建立、驗證和檢視去中心化身分（DID）等常見任務的實用、可直接複製貼上的程式碼片段。

核心概念

本節說明 ArcBlock 去中心化身分（DID）背後的基本概念。在 ArcBlock 生態系中，DID 不僅僅是一個識別碼；它是一個獨立、自描述的實體，內嵌了自身的密碼學屬性。這種設計實現了一個多功能且可互通的身分系統。

入門指南

本指南提供快速、逐步的教學，協助您開始使用 ocap-libs。在短短幾分鐘內，您將能安裝必要的套件、建立您的第一個去中心化身分（DID）、產生一個相容的加密錢包，並學會使用一些實用的工具程式。

總覽

歡迎來到 OCAP Libraries 的官方文件，這是一套用於建構具有去中心化身分應用的綜合套件。本指南提供了將強大的自主權身分功能整合到您的應用中所需的一切。其核心是三個主要套件：@arcblock/did、@ocap/wallet 和 @ocap/util。它們共同提供了一套完整的工具集，用於

@ocap/util

@ocap/util 套件是一個基礎函式庫，提供了一系列跨多個 OCAP JS 函式庫共享的必要輔助函式。其同構設計使其能在 Node.js 和瀏覽器環境中無縫運作。此模組簡化了資料類型轉換、編碼/解碼、大數運算和聯合曲線計算等常見任務，確保您應用程式的一致性和可靠性。

API 參考

這是 @ocap/util 套件中所有可用工具函式的綜合參考。它提供了資料轉換、大數運算、UUID 生成和 bonding curve 計算的實用範例。

@ocap/wallet

此套件提供工具函數，用於建立和使用與 OCAP 相容的加密錢包。產生的錢包也與 ArcBlock 的去中心化身分（DID）系統相容，讓您能無縫地管理加密金鑰、簽署訊息及驗證簽章。

API 參考

本節提供 Wallet 物件及其工廠函數的詳細文件。您將找到每個函數的說明、其參數、返回值，以及用於建立錢包、簽署訊息和驗證簽章等常見操作的實用程式碼範例。

核心概念

本節介紹 @ocap/wallet 套件背後的基本概念。您將學習什麼是 Wallet 物件、其結構、建立它的不同方式，以及它與去中心化身分（DID）的關鍵關係。

Conceptual Guides

- Understanding DIDs

Frequently Asked Questions

How the documentation is organized?

Getting Started

If you are an intermediate or advanced javascript developer, you can start from Send first transaction.

How-to Guides

- Create Account

Reference Guides

- Working with DIDs

Setup Node.js

About why Node.js is required and how to install Node.js please refer to Blocklet Developer Guide

Create Account

An account is a data entry that's stored in the chain ledger, on-chain accounts are controlled by off-chain wallets, see understanding accounts and w

Create Token

此文档描述如何从 ArcSwap 界面上创建 Token。

Query Accounts

Query account by address

Query NFT

Query NFT State

Query Transactions

The listTransactions query allows you to fetch a list of transactions on the blockchain based on various criteria. This can be useful for monitoring s

Send first transaction

In this tutorial you will learn how to connect to a running chain and send your first transaction.

Migration Guides

- Upgrade from 1.18.x to 1.19.x

Transaction Types

Account Related

Understanding DIDs

What is DID?

Understanding NFTs

We use the term NFT and Asset interchangeably throughout this documentation because they mean the same thing on the ArcBlock chain. What is NFT? NFTs

Understanding Tokens

What is token?

Understanding Transactions

A transaction must be encoded and signed by the sender's wallet, once sent to the chain, it's decoded and verified, and then executed and appended to

Understanding Verifiable Credentials

Learn the basic concept, mental model, use cases and benefits of verified credentials, understand it's difference between NFTs

Understanding Wallets and Accounts

What is Wallet?

Upgrade from 1.18.x to 1.19.x

ArcBlock's blockchain, as of v1.19.x, includes native support for Passkeys, allowing them to have corresponding accounts on the blockchain and to sign

Welcome

ArcBlock blockchain is an open, secure, and extensible billing layer for the ArcBlock ecosystem, the blockchain has native DID support, and it's wide

Work with Verifiable Credentials

@arcblock/vc includes several utility functions to issue and verify verifiable credentials and their presentations.

Working with DIDs

Utility functions to create/inspect did, and do did-based auth, an implementation of abt-did-protocol

Blocklet CLI

@blocklet/cli 的開發者指南，涵蓋安裝和各項功能。

進階主題

歡迎來到進階主題部分。核心工作流程涵蓋了日常開發和伺服器管理，而本部分則深入探討用於微調和維護 blocklet 的更專業指令。這些工具可協助您管理 blocklet 的去中心化身份並執行特定的清理任務。

清理 Blocklet

blocklet cleanup 命令是一個公用程式，用於對安裝在您的 Blocklet Server 上的特定 blocklet 執行維護任務。它允許您清除 blocklet 的專用快取或停用其自動備份設定。

DID 文件管理

每個 blocklet 都由一個去中心化識別碼（DID）進行識別，此識別碼與一個 DID 文件相關聯。該文件包含關鍵的元資料，例如公鑰和服務端點，讓其他服務能夠安全地發現您的 blocklet 並與之互動。雖然 Blocklet Server 通常會自動管理此文件，但在某些情況下，手動更新是必要的。

Blocklet 工作流程

Blocklet CLI 提供了一套全面的指令，支援 Blocklet 從初始專案建立到最終分發的整個生命週期。這些工作流程旨在簡化開發，確保建立、測試和部署應用程式的過程順暢高效。

元件管理

Blocklet 可由其他 blocklet 組成，這些被稱為元件。這個強大的功能讓您可以透過組合更小、可重複使用的部分來建構複雜的應用程式。Blocklet CLI 提供了一組指令，幫助您管理專案 blocklet.yml 檔案中的這些元件相依性。

新增元件

blocklet add 命令會將一個新元件作為相依性新增到您的 blocklet 中。它會自動使用必要的配置更新您 blocklet.yml 檔案中的 components 部分。

移除元件

blocklet remove 命令提供了一種直接的方式，可以從您的 blocklet 的 blocklet.yml 中繼資料檔案中移除元件相依性。此操作會更新您的專案設定，以反映該元件不再是相依項。

Component Studio CLI

blocklet component 指令是一個方便的代理，用於執行 @blocklet/component-studio-cli 套件中的指令。這讓您無需全域安裝該套件或手動管理其版本，即可直接從終端機與 Component Studio 互動。

發行

一旦您的 blocklet 開發並打包完成，下一步就是讓其他人可以安裝和使用。Blocklet CLI 提供了兩種主要的發行方式：直接部署到 Blocklet Server，或上傳到 Blocklet Store 以供公開搜尋。

連線至商店

在您能將 blocklet 上傳至 Blocklet Store 之前，您需要先將本地 CLI 與其連線。blocklet connect 指令可協助您進行一次性的設定流程，將您的機器與特定的商店進行驗證，並在本地儲存必要的憑證，以供 blocklet upload 等未來指令使用。

部署 Blocklet

blocklet deploy 命令是您將 blocklet 從本地開發環境推送到正在運行的 Blocklet Server 實例的直接途徑。這對於在預備環境中測試或直接部署到生產環境至關重要。該命令一步完成捆綁、版本控制和上傳您的專案。

上傳至商店

成功捆綁您的 blocklet 後，分發的下一步是將其上傳到 Blocklet 商店。blocklet upload 指令會將您的 blocklet 捆綁包發送到指定的商店，使其可供他人發現和安裝。這是公開分發的主要方法。

本機開發

在本機開發和測試您的 blocklet 是工作流程中至關重要的一環。Blocklet CLI 提供了一套強大的工具，讓您可以在連接到本機 Blocklet Server 的即時重新載入環境中執行 blocklet、執行一次性腳本，並輕鬆地對應用程式進行偵錯。本節將涵蓋您在本機開發週期中所需的基本指令

對 Blocklet 進行偵錯

blocklet debug 命令是一個開發者工具，用於在執行中的 Blocklet 上設定環境變數，主要目的是啟用詳細的日誌記錄和其他偵錯功能，而無需重新建置或重新部署。

開發模式

blocklet dev 指令是本地開發的關鍵工具。它會在即時重載的開發模式下執行您的 blocklet，並將其連接到一個正在執行的 Blocklet Server 實例。這會自動處理您的 blocklet 作為臨時元件的安裝、啟動和日誌串流，從而實現快速迭代。

執行腳本

blocklet exec 命令是一個強大的工具，用於在已安裝的 Blocklet 的即時上下文中執行腳本。這對於資料庫遷移、資料填充或任何需要存取您 Blocklet 執行階段環境變數的一次性腳本來說，都是非常有價值的。

封裝與版本管理

一旦您完成了 blocklet 的開發和測試，下一步就是準備發行。這包括兩個關鍵過程：版本管理，為您的發行版分配一個唯一的識別符；以及打包，將您所有的程式碼和資產打包成一個單一、可部署的成品。Blocklet CLI 提供了專門的指令來簡化這個工作流程。

封裝 Blocklet

blocklet bundle 指令是開發生命週期中的關鍵步驟。它會將您的 blocklet 的原始碼、資產和元數據打包到一個標準化的 .blocklet 目錄中，使其準備好進行部署或分發。

管理版本

blocklet version 指令是一個方便的工具，用於更新您 blocklet 在 blocklet.yml 檔案中的版本號。它遵循語意化版本 (semver) 的規則，以確保版本號的增長一致且可預測。在您打包和分發 blocklet 的新版本之前，這是一個關鍵的步驟。

專案設定

要啟動一個新的 blocklet 專案非常簡單。Blocklet CLI 提供了兩個主要指令來引導您的開發環境，這取決於您是從頭開始還是轉換現有專案。這些指令可以幫助您產生必要的元資料檔案，例如 blocklet.yml，並設定標準的專案結構。

建立專案

blocklet create 命令是啟動新 Blocklet 專案最快的方式。它使用 create-blocklet，這是一個互動式鷹架工具，可讓您從各種官方入門模板中進行選擇。此命令是引導新應用程式的建議方法。

初始化專案

blocklet init 指令是一個互動式工具，可協助您在現有目錄中建立新 blocklet 的基本結構。它會產生核心的 blocklet.yml 元資料檔案和其他必要的樣板檔案，將您目前的資料夾轉變為一個功能性的 blocklet 專案。

指令參考

Blocklet CLI 提供了一套全面的指令，用於管理您的 Blocklet Server 實例和單獨的 blocklet 專案。本參考分為兩大類，幫助您快速找到特定任務所需的指令。

blocklet

blocklet 命令是管理 Blocklet 專案整個生命週期的主要介面。它提供了一套完整的子命令，用於初始化、開發、打包、部署和管理 blocklet 及其元件。

blocklet server

blocklet server 指令是管理您的 Blocklet Server 執行個體生命週期和設定的主要工具。它可讓您初始化、啟動、停止和監控伺服器及其上執行的所有 blocklet。對於自行託管 Blocklet Server 的伺服器管理員和開發人員來說，這些指令至關重要。

設定

無論是執行 Blocklet Server 實例，還是使用 Blocklet CLI 與其及其他服務互動，正確的設定都至關重要。本指南著重於您作為開發者將用來連接 Blocklet 商店和管理開發環境的本地 CLI 設定。這些設定使用 blocklet config 指令進行管理。

環境變數

環境變數提供了一種強大的方式來設定 Blocklet Server 及其運行的 blocklet。它們會覆寫設定檔中的預設設定和值，使其成為在開發、預備和生產等不同環境中客製化設定的理想選擇。

入門指南

本指南將引導您完成讓第一個 Blocklet Server 執行個體啟動並執行的基本步驟。只需幾分鐘，您就能從安裝到擁有一個功能齊全的伺服器。

總覽

Blocklet CLI 是您管理 Blocklet Server 和開發 blocklet 的主要工具。它提供了一套全面的指令，可處理從本地開發、測試到打包和部署應用程式的所有事務。

伺服器管理

blocklet server 指令是您管理 Blocklet Server 實例生命週期的主要工具。它讓您可以初始化設定、啟動和停止伺服器守護程序、檢查其狀態以及執行各種維護任務。這套指令確保您可以直接從命令列完全控制您的伺服器環境。

清理伺服器

The blocklet server cleanup 命令是一個公用程式工具，用於執行各種伺服器層級的維護任務。它能幫助您透過清理快取、重設狀態或管理網路配置來解決問題，而無需停止整個伺服器。

取得伺服器資訊

blocklet server info 命令是一個重要的診斷工具，旨在收集並顯示您的 Blocklet Server 環境的全面摘要。它收集了從硬體和作業系統詳細資訊到軟體版本和伺服器設定的所有內容，使其在偵錯或提供系統資訊以尋求支援時非常寶貴。

初始化伺服器

blocklet server init 命令會透過在目前工作目錄中建立一個專用的設定目錄 .blocklet-server 來初始化一個新的 Blocklet Server 執行個體。此目錄包含 config.yml 檔案以及執行伺服器所需的其他資產。此過程可以透過引導式設定以互動方式執行，或使用

查看日誌

blocklet server logs 指令是一個用於故障排除和監控的重要工具。它不會直接顯示日誌內容，而是提供與 Blocklet Server 守護進程及任何已安裝的 Blocklet 相關的所有日誌的確切檔案路徑。這讓您可以使用標準的命令列工具，如 cat、tail 或 less，輕鬆地定位

遷移資料庫

blocklet server migrate 指令是一個用於擴展 Blocklet Server 實例的關鍵工具。它能協助您將伺服器的底層資料庫從預設的 SQLite（非常適合開發和簡單設定）遷移到像 PostgreSQL 這樣更穩健、更具擴展性的系統，以用於生產環境。

啟動伺服器

blocklet server start 命令是啟動您的 Blocklet Server 執行個體的主要方法。它會將所有必要的元件初始化並作為背景守護程序執行，使您的伺服器及其 blocklet 可供存取。

檢查狀態

blocklet server status 命令是監控 Blocklet Server 實例及其內部運行的所有 blocklet 健康狀況的重要工具。它提供了從核心伺服器進程到單個 blocklet 狀態的整個系統的快速、全面的快照。

停止伺服器

blocklet server stop 指令會優雅地關閉執行中的 Blocklet Server 實例。此過程包括停止所有執行中的 blocklet、路由引擎、核心伺服器進程以及任何相關的 Docker 容器。

升級伺服器

本文件提供將 Blocklet Server 命令列介面 (CLI) 升級至最新可用版本的說明。

Blocklet 平台

理解 Blocklet 平台並在它上面開發的指南。

Request Entity too Large

Blocklet Server limits file size on uploading within a certain range for efficiency considerations, since larger file uploads will consume more resour

Manage Blocklet Versions

This documentation provides guidelines on managing the versioning of Blocklets, ensuring consistency and clarity across releases.

Blocklet SDK (Browser)

The Blocklet JS SDK is the official frontend library provided to assist in the development of blocklets.

Test a Blocklet

After creating the application, we can directly install the Blocklet locally to test if it meets expectations.

Adding a component

This document explains how to install Blocklets on your website and details the characteristics, use cases, and important considerations for each inst

Access Control

Blocklet Service 为 Blocklet 提供的访问控制基于 RBAC(Role-based access control)

Access Key

What Are Access Keys?

Application vs Blocklet

Before we start developing Blocklets, let’s first understand what an application is and what a Blocklet is.

How to bind a domain to Blocklet and generate SSL/TLS certificate

Overview

Blocklet GitHub Actions

If you are using GitHub Actions to manage the process of packaging, publishing, and deploying Blocklet applications, then you will more efficient Bloc

Blocklet CLI

Blocklet CLI provides blocklet command-line tool for controlling and administering Blocklets. Use the following syntax to run blocklet commands from y

Blocklet Composition

Imagine you're playing with Lego bricks. Each brick is unique, with its own color, shape, and function. Now, picture being able to snap these bricks t

Blocklet Lifecycle

This doc is a draft and needs to be updated

Blocklet SDK (Node.js)

Blocklet SDK for blocklet developer

Blocklet Server Architecture

[!NOTE] this page is a draft and need to be updated

Blocklet Server CLI

Blocklet Server CLI provides blocklet server command-line tool for controlling and administering Blocklet Server in local machine. Use the following s

Blocklet Server Routing

TBD: Blocklet server routing pipeline

Blocklet Server Troubleshooting Checklist for Self-inspection

Introduction

Blocklet Service

Blocklet Service provides some out-of-the-box services for Blocklets.

Blocklet Storage

Using local database

Blocklet Studio

What is Blocklet Studio?

Create a Blocklet

Before Create a Blocklet, you need to become a developer of the Blocklet Store. Please refer to:

Delete a Blocklet

In the Blocklet Studio list, you can click the delete button of a specific Blocklet to remove it:

Upload static resources

If you have a project with static resources, you can directly use Blocklet Studio to create a Blocklet.

Blocklet UI

Blocklet UI 是一个用于快速构建 Blocklet 的前端组件库。区别于一般的 UI 组件库，Blocklet UI 提供的组件通常需要工作在 Blocklet 环境中，在页面渲染时，Blocklet UI 会读取 Blocklet 运行时信息 (称为 Blocklet Meta), 比如 Blocklet Logo，应用名称，导航菜单等信息，然后基于这些信息来渲染用户界面。

blocklet.js

What is blocklet.js?

blocklet.yml

DID

Build blocklet for profit [deprecated]

设置价格

Bundle your blocklet

Introduction

Communicate with DID Wallet

Establish connection with DID Wallet

Conceptual Guides

- Platform Overview

Developer Best Practices.

- Developing Blocklet in Docker

Create Blocklet

Before proceeding, please ensure you have followed the steps outlined here: Create Blocklet from Scratch If you want to start a new blocklet from sc

Compose Blocklets

What is Blocklet Composition?

Create a Blocklet of type Docker

Before you begin:

Create your first blocklet

There are usually two ways to create a Blocklet application: Create Blocklet and the blocklet create command. The latter is a command provided by @b

How to add custom well-known URI

In some cases you may want to add custom well-known URI on your website, such as:

Customize user profile page

As Blocklet development progresses, a demand for personalized profile page is highly likely to emerge. Because of the Blocklet platform's composabilit

Defend against CSRF attacks

Overview

Deploy your blocklet

If you are a blocklet developer, or you have a blocklet release bundle, you can deploy the blocklet directly to your Blocklet Server

Develop Blocklet

Start development

Developing Blocklet in Docker

When you are unable or unwilling to directly install @blocklet/cli on the computer for some reason, it can be difficult to develop Blocklet because @b

Developing with GitHub Codespaces

Setting Up the Blocklet Server

Enable Web Application Firewall

This page need to be updated Blocklet Server has opt-in support for Web Application Firewall with following open-source projects: https://github.com/o

Event Bus Service (Beta)

Event Bus service is a powerful communication system that helps your blocklet's components work together seamlessly. Imagine it as a smart messaging c

Frequently Asked Questions

How the documentation is organized?

Getting Started

If you are an intermediate or advanced developer, and you already have a basic understanding of how blocklet works, you can start from Create first bl

How to configure security rules

Overview of Security Rules

How to Guides

- Application vs Blocklet

How to install local Blocklet as an application into the local Server?

问：如何将本地的 Blocklet 作为应用（而不是作为组件）直接安装到本地运行的 Server 中。答： 1. 在浏览器中访问 Server - Blocklet 列表页，点击 “安装应用” - “从 URL 安装“ 2. 将 blocklet 打包后，复制 blocklet bundle 目录

How to install a resource by URL after creating it

Step 1: After creating the resource, click "Install" and copy the link

Install Blocklet CLI

目前只能在 Linux(Ubuntu) 或 macOS 上安装和运行 Blocklet Server，Windows 平台下的用户请使用 Docker 来运行。The Blocklet CLI is a command-line tool for managing both Blocklets an

Integrate Blocklet Studio

Developers of ArcBlocklet should all be familiar with this diagram, which shows how AIGNE utilizes Blocklet Studio and Blocklet Store to form a flywhe

Known Issues or Limitations

- Can not access server/blocklet with DID Domain?

Claude

Preconditions

Cline

Preconditions

Cursor

Preconditions

Roo Cline

Preconditions

MCP Servers

Blocklet offers an official Model Context Protocol (MCP) server, enabling access to Blocklet data within MCP-compatible AI applications.

Windsurf

Preconditions

Witsy

Preconditions

Not using 80/443 ports?

Sometimes after you initialize and start a blocklet server and find that the server is not using 80/443 ports, this may happen for several reasons:

DID Connect

Developer Guide

OAuth Server

This is work in progress, will introduce more about how OAuth work in Blocklet Server Overview Blocklet Service can function as an OAuth server, suppo

Operation your blocklet

How to customize Blocklet Logo

Setup with AWS EC2

Running in AWS

Performance

Performance Modes in Blocklet Server

Permission Issues on Linux

Usually, it's recommended to run blocklet server as a non-root user for security reasons, and you should always use the same user that created the ser

Platform Overview

Publishing a Blocklet

Prerequisites

Publish your blocklet to the world

Publish to Blocklet Store

Read/Write blockchain in blocklet

- ArcBlock chain: @ocap/client - Ethereum chain: web3.js, ethers.js - Standard chain info for DID Connect: blocklet sdk and development

Reference Guides

- DID Connect

Resource-based Blocklet

If a Blocklet is only associated with resources and not linked to any components, it is defined as a Resource-based Blocklet. A Resource-based Blockle

Migration Guide

- 1.17.x 升级与迁移指南

Blocklet Manager

- Adding a component

Security

- blocklet security: sk, config, data backup - server security: sk, ssh, data-disk - access-key: passport - integrations

1.17.x Upgrade and Migration Guide

Overview

Add PWA Integration to Blocklet

PWA integration is currently in its early stages, and we will continue to improve the experience.Make sure the version of @blocklet-cli is greater tha

Setup Blocklet Server

Blocklet Server can run in various environments:

Setup DID Wallet

Why do I need DID Wallet?

Setup Node.js

You can safely skip this step if you have already Node.js v20+ installed on your development environment.Why Node.js? Most of the components in the Bl

Setup on Ubuntu + FNM

Ubuntu is a popular Linux distribution loved by the developer community, Blocklet Server can run on it with the following steps.

Setup on Ubuntu + Nodesource

For how to get your server up and running on ubuntu with nodesource, please checkout the recording here: https://asciinema.org/a/629699

The meaning of each input item in the release resource form

The source drawing contains no extractable text; preserve its exported image when regenerating this page.

Theming

This comprehensive guide covers all aspects of the Theming functionality, from basic usage to advanced features and technical details.

How to transfer a Blocklet

If you need to change the owner of a Blocklet, you need to transfer the Blocklet to achieve this. This article will introduce how to transfer a Blockl

Configure OAuth Server using Grafana.

Requirements

Understanding Blocklet

The core concepts in the Blocklet ecosystem and the relationships between the concepts are shown in the following diagram.

Understanding Blocklet Payment

this page is a draft and need to be updated

User and Passport

Blocklet Auth Service provides DID-based authentication and Passport-based access control for Blocklets.

Using Blocklet Logger

You can use @blocklet/logger to manage logs at your blocklet runtime, here are the steps:

Using Blocklet Preferences

What are Blocklet Preferences?

Run Blocklet using Docker container

Blocklet Server enables Blocklets to run in Docker containers, thereby providing better isolation for each.

Can not access server/blocklet with DID Domain?

If you can not access your blocklet or server with DID Domain (in the following screenshot)

WebHooks

What are Webhooks?

Welcome

Welcome to Blocklet the Web 3.0 Application Platform

When stuck in maintenance mode?

Blocklet server supports several maintenance operations directly from the server dashboard:

When stuck on a blank screen?

If your website shows a blank screen and refreshing and clearing cache does not help, please consider the following steps to recover:

Why can't see the uploaded Blocklet on the Blocklet Store?

When a user successfully uploads a feature to the Store (as shown below), we need to publish the Blocklet in the Store in order to see our Blocklet on

Setup with Docker

Starting a server with Docker

How to mange static asset cache?

The Blocklet Server is designed to cache specific assets within its routing engine to enhance performance. These assets include the Blocklet Logo, JS/

Setup with ArcBlock Launcher

Launching a server via ArcBlock Launcher

Blocklet SDK（瀏覽器）

@blocklet/js-sdk 是 Blocklet 的瀏覽器端 JavaScript SDK。

SDK 用戶端

SDK 用戶端提供了與 @blocklet/js-sdk 互動的主要入口點。它提供了一個主要的 BlockletSDK 類別，該類別捆綁了所有可用的服務，以及幾個工廠函數（getBlockletSDK、createAxios、createFetch），以便於存取和實例化。

API 參考

歡迎來到 @blocklet/js-sdk 的 API 參考文件。本節為 SDK 提供的所有類別、方法、函式和型別提供詳細的技術文件。它旨在幫助需要精確理解 SDK 元件及其功能的開發人員。

AuthService

AuthService 提供了一個全面的 API，用於管理使用者帳戶的各個方面。它處理使用者個人資料、隱私和通知設定、追蹤其他使用者等社交互動，以及登出和刪除帳戶等關鍵的身份驗證操作。您可以透過 SDK 實例中的 sdk.auth 來存取它。

BlockletService

BlockletService 提供了存取 blocklet 元資料的方法。此元資料由 Blocklet 物件表示，包含應用程式名稱、URL 前綴、版本和元件掛載點等基本資訊。

ComponentService

ComponentService 提供了一個方便的 API，用於與掛載在主應用程式中的元件 blocklet 進行互動。它允許您擷取這些元件的中繼資料，並建構指向其頁面或 API 端點的絕對 URL。

服務

@blocklet/js-sdk 由數個服務類別組成，每個類別負責特定的功能領域。這些服務作為不同 Blocklet API 端點的專用客戶端，提供了一種結構化且直觀的方式來與平台功能互動。

FederatedService

FederatedService 提供了一個用於與統一登入站點群設定互動的 API。它允許您檢索有關控制登入會話的「主」應用程式和使用者正在互動的「目前」應用程式的資訊。這對於建立像統一應用程式切換器這樣的功能，或了解使用者在相互連接的 Blocklet 群組中的會話上下文至關重要。

TokenService

TokenService 提供了一個低階 API，用於直接與工作階段權杖和重新整理權杖進行互動。它處理從各自的瀏覽器儲存位置（工作階段權杖儲存在 cookies，重新整理權杖儲存在 localStorage）儲存和檢索這些權杖的邏輯。

UserSessionService

UserSessionService 提供了一個 API，用於獲取和管理使用者在不同裝置和應用程式中的登入會話。此服務對於建構允許使用者查看其活動登入位置、查看哪些裝置存取了其帳戶以及管理這些會話的功能至關重要。

類型

本節為 @blocklet/js-sdk 匯出的核心 TypeScript 類型和介面提供了詳細的參考。在您的專案中使用這些類型，可以幫助您利用 TypeScript 的靜態分析和自動完成功能，以獲得更好的開發體驗。

入門指南

本指南將引導您完成安裝 @blocklet/js-sdk 並進行首次 API 呼叫的基本步驟。我們的目標是讓您在幾分鐘內就能上手。

驗證

@blocklet/js-sdk 旨在透過自動處理基於權杖的安全性的複雜性，使驗證過程無縫接軌。它在背景管理會話權杖和刷新權杖，讓您可以專注於建構應用程式的功能。

指南

歡迎來到 @blocklet/js-sdk 的實用指南。本節旨在幫助您快速上手並執行常見任務。每個指南都提供了逐步說明和程式碼範例，以幫助您在 Blocklet 應用程式中整合關鍵功能，例如進行安全的 API 呼叫、處理使用者身份驗證和管理會話。

發送 API 請求

@blocklet/js-sdk 提供了強大、預先配置的輔助工具，用於向您的 Blocklet 服務發送 API 請求。這些輔助工具，createAxios 和 createFetch，旨在自動處理身份驗證和會話管理的複雜性，讓您可以專注於建構應用程式的功能。

管理使用者會話

@blocklet/js-sdk 提供了一個 UserSessionService，可協助您擷取和管理不同裝置上的使用者登入會話。這對於建立「安全性」或「裝置」等功能特別有用，使用者可以在這些頁面查看所有活動中的會話，並了解其帳號的使用情況。

總覽

「@blocklet/js-sdk」是一個全面的 JavaScript 函式庫，旨在簡化與 Blocklet 服務的互動。無論您是建構前端應用程式還是後端服務，此 SDK 都提供了一套強大的工具來處理身份驗證、會話管理和 API 通訊，讓您能專注於建構功能，而無需處理底層細節。

Blocklet SDK（Node.js）

@blocklet/sdk 用於在 Node.js 裡開發應用並接入系統能力。

API 參考

歡迎來到 Blocklet SDK API 參考。本節詳細介紹了 SDK 匯出的所有模組、類別、函式和工具程式。無論您是要管理使用者、發送通知，還是保護您的應用程式，都可以在這裡找到必要的詳細資訊。

型別定義

Blocklet SDK 是強型別的，可幫助您編寫更健壯且易於維護的程式碼。本節提供了在處理使用者會話、通知、事件和 blocklet 設定時會遇到的最常見 TypeScript 型別和介面的參考。了解這些型別將有助於確保型別安全，並有效地利用您 IDE 的自動完成功能。

授權中介軟體

auth 中介軟體是一個功能強大的工具，可為您的 blocklet 路由增加一層授權。它與 session 中介軟體配合使用，透過驗證使用者的角色、特定權限、KYC (實名認證) 狀態以及所使用的驗證方法來保護端點。這確保只有經過授權的使用者才能存取敏感或受限的資源。

身份驗證

在現代 Web 應用程式中，強大的身份驗證和授權對於安全性和使用者管理至關重要。Blocklet SDK 提供了一套全面的工具，可無縫地實現這些功能，並利用去中心化身份（DID）來提供安全且以使用者為中心的體驗。

DID Connect

Blocklet SDK 提供了一種簡化的方式，使用 DID Connect 將去中心化身份整合到您的應用程式中。這讓使用者可以使用 DID 錢包安全地登入並管理他們的資料，提供了一種無密碼且以使用者為中心的驗證體驗。此功能的核心元件是 WalletAuthenticator 和 WalletHan

Session 中介軟體

session 中介軟體是 Blocklet SDK 驗證系統的核心元件。它充當您 Express.js 路由的守門員，驗證請求者的身份，並在成功驗證後，將一個 SessionUser 物件附加到 req.user 屬性上。這讓後續的中介軟體和路由處理程式可以輕鬆存取已驗證的使用者資訊。

核心概念

Blocklet SDK 建立在幾個基本概念之上，這些概念構成了您建構的任何應用程式的骨幹。理解這些核心支柱——設定、錢包管理和安全性——對於充分利用 SDK 的強大功能來建立穩健、安全且可擴展的 Blocklet 至關重要。

設定與環境

Blocklet SDK 提供了一種強大而統一的方式來管理您應用程式的設定和環境變數。它將來自多個來源的設定匯總到一個單一、易於使用的介面中，確保您的 blocklet 能夠存取所有必要的資訊，從應用程式元資料到元件特定的設定。

安全實用工具

Blocklet SDK 包含一套健全的安全實用工具，旨在保護您應用程式的資料和通訊。這些工具有助於您處理敏感資訊、確保 API 呼叫的完整性，並預防常見的 Web 漏洞，如跨站請求偽造 (CSRF)。

錢包管理

在 Blocklet SDK 中，錢包是一個基本的密碼學物件，代表您的應用程式的身份。它對於簽署資料、驗證請求以及與區塊鏈網路互動至關重要。SDK 提供了一個強大且方便的工具程式 getWallet，可以直接從您應用程式的環境變數中建立和管理錢包實例。

入門指南

本指南將引導您完成安裝 Blocklet SDK 的基本步驟，並讓一個最精簡的應用程式啟動並運行。我們的目標是幫助您在幾分鐘內從零開始，建立一個可運作的範例。

指南

歡迎來到 Blocklet SDK 指南。本節提供實用的逐步教學，幫助您解決常見挑戰並在您的網頁應用程式中實現關鍵功能。

元件間通訊

在一個由多個元件組成的 Blocklet 應用程式中，讓它們能夠安全可靠地相互通訊至關重要。Blocklet SDK 提供了一個高階實用工具 component.call，專為此目的設計。此方法透過處理服務發現、請求簽署和自動重試，簡化了元件間的 API 呼叫。

使用 Web Server 中介軟體

Blocklet SDK 隨附一套功能強大、立即可用的 Express.js 中介軟體。這些工具旨在處理常見的 Web 開發挑戰，如安全性、SEO 和單頁應用程式（SPA）路由，讓您可以用更少的樣板程式碼建構更穩健、功能更豐富的 blocklet。

總覽

Blocklet SDK (@blocklet/sdk) 是在 ArcBlock 平台上建構應用程式的必要工具包。它透過提供一套全面的實用工具、服務和中介軟體來處理 Blocklet 的核心功能，從而簡化了開發過程，讓您可以專注於應用程式的獨特功能。

Blocklet 服務

BlockletService 是一個功能強大的客戶端，作為您的 blocklet 與底層 ABT Node 服務互動的主要介面。它將複雜的 GraphQL 查詢和 HTTP 請求包裝成一個簡潔、基於 promise 的 JavaScript API，從而簡化了使用者管理、工作階段處理、基於角色的存

服務

Blocklet SDK 透過提供一套功能強大的服務用戶端，簡化了直接 API 呼叫的複雜性。這些用戶端提供了一個乾淨、程式化的介面，用於與核心 Blocklet 功能互動，例如使用者管理、即時通知和元件間事件處理。透過使用這些服務，您可以用更少的程式碼建構更穩健、功能更豐富的應用程式。

事件匯流排

事件匯流排提供了一個強大的發布-訂閱機制，允許您的 blocklet 內部，甚至跨不同 blocklet（在同一個 ABT Node 實例內）的元件以解耦的方式相互通訊。這非常適合用於廣播全系統的狀態變更或事件，而不需要元件之間有直接的依賴關係。

通知服務

通知服務是 Blocklet SDK 的核心元件，讓您的應用程式能夠傳送各種類型的通知給使用者，並訂閱即時事件。此服務作為底層 ABT Node 通知功能的介面，處理從簡單的使用者訊息到傳送到 DID 錢包、電子郵件和其他管道的豐富互動式通知等所有事務。

Blocklet Server SDK（Node.js）

@blocklet/server-js 是把 Web 應用連到 Blocklet Server 的官方 JS 函式庫。

進階用法

本節涵蓋了需要超越標準客戶端方法或解決問題的開發人員的高級主題。在這裡，您將學習如何直接對 Blocklet Server API 執行原始 GraphQL 查詢，以及如何啟用偵錯來檢查底層的請求和回應。

偵錯

使用 @blocklet/server-js 建構應用程式時，您可能會遇到 API 請求、身份驗證或資料擷取等問題。為了幫助您排查這些問題，客戶端提供了詳細的偵錯日誌。這讓您可以檢查正在傳送的原始 GraphQL 查詢、收到的回應以及其他內部操作。

原始查詢與訂閱

雖然 @blocklet/server-js 函式庫為大多數常見的 GraphQL 操作提供了便利的輔助方法，但在某些情況下，您可能需要更大的靈活性或存取 SDK 尚未公開的功能。對於這些進階使用案例，該函式庫允許您直接執行原始的 GraphQL 查詢和訂閱。

API 參考

歡迎來到 @blocklet/server-js 的完整 API 參考。本節提供透過 Blocklet Server Client 可用的每個 GraphQL 查詢、變更和類型的詳細文件。無論您需要擷取資料、修改伺服器狀態，還是理解您正在使用的資料結構，這都是您的綜合指南。

異動

異動是 GraphQL 的操作，用於在 Blocklet Server 上建立、更新或刪除資料。@blocklet/server-js 函式庫提供了一組方便的方法來封裝這些異動，讓您能輕鬆地從您的應用程式執行寫入操作。

資料與操作

本節詳細介紹了 Blocklet Server 中用於資料管理和操作任務的 mutation，主要側重於建立和管理備份，以及遷移資料結構。這些操作對於資料完整性、更新和災難復原至關重要。

網路與服務

本節詳細介紹了可用於管理 Blocklet Server 上網路和服務的 mutations。您可以執行設定路由規則、管理 SSL/TLS 憑證、設定 Webhook 以及處理通知等操作。有關檢索網路和服務資料的方法，請參閱網路與服務查詢部分。

節點與 Blocklet 管理

本節提供與管理 Blocklet Server 節點及其上執行的 Blocklet 的生命週期和組態相關的變更的詳細參考。這些操作允許您以程式化方式安裝、啟動、停止、設定和升級單個 Blocklet 和節點本身。

發布與專案

本節詳細介紹了可用於管理 Blocklet 專案整個生命週期的突變，從建立和發布管理到與 Blocklet 商店連接以及發布您的工作。這些突變可以對您的專案如何開發、版本控制和分發進行程式化控制。

使用者與存取權管理

本節提供管理 Blocklet 中使用者、角色、權限、邀請和存取金鑰的 mutations 詳細參考。這些操作對於控制應用程式中的存取和管理身份至關重要。

查詢

查詢用於從 Blocklet Server 獲取資料。@blocklet/server-js 函式庫提供了一組與可用 GraphQL 查詢對應的方法，讓您無需編寫原始 GraphQL 即可輕鬆檢索資訊。

資料與操作

本節提供用於從您的 Blocklet Server 擷取操作資料的 GraphQL 查詢的詳細參考。這些查詢對於監控系統健康狀況、管理備份、稽核活動以及深入了解流量模式至關重要。有關資料和操作的變更，請參閱資料與操作變更部分。

網路與服務

本節提供 Blocklet Server 上所有與網路和服務相關的 GraphQL 查詢的詳細參考資料。這些方法可讓您擷取路由、網域、憑證、webhook 和通知的資料與設定。若需修改這些設定的操作，請參閱網路與服務 Mutations 章節。

節點與 Blocklet 管理

本節為用於管理和擷取 Blocklet Server 節點及其執行的 blocklet 相關資訊的 GraphQL 查詢提供了詳細參考。這些查詢可讓您監控狀態、擷取設定和存取生命週期資訊。

發布與專案

本節提供了用於管理發布專案、發行版本及相關資源的 GraphQL 查詢的詳細參考。這些查詢可讓您擷取有關 blocklet 發布生命週期的資訊。對於修改此類資料的操作，例如建立或更新專案和發行版本，請參閱發布與專案突變文件。

使用者與存取管理

本節提供在 Blocklet Server 中管理使用者、角色、權限、工作階段和存取金鑰的相關查詢的詳細參考。這些查詢可讓您檢索有關應用程式使用者及其存取級別的資訊。

類型

Blocklet Server Client API 利用多種 GraphQL 類型來建構查詢和變異的資料。本節為整個 API 中使用的所有資料類型、輸入物件、列舉和純量提供了全面的參考。了解這些類型對於建構有效的請求和解釋來自 Blocklet Server 的回應至關重要。

驗證

@blocklet/server-js 函式庫提供兩種主要方法來驗證 API 請求：驗證權杖 (Auth Token) 和存取金鑰 (Access Key)。應根據應用程式的環境和安全需求選擇合適的方法。驗證權杖通常用於面向使用者的應用程式 (如瀏覽器)，而存取金鑰則設計用於安全的伺服器對伺服器通訊

入門指南

本指南提供逐步教學，引導您快速上手並執行 @blocklet/server-js 函式庫。您將學習如何安裝客戶端、連接到 Blocklet Server，並進行您的第一次 API 呼叫。

總覽

@blocklet/server-js 函式庫是官方的 JavaScript 客戶端，用於與 Blocklet Server GraphQL API 互動。它為 Node.js 和瀏覽器應用程式提供了一個方便且強大的介面，用於與 Blocklet Server 實例通訊，簡化了管理 blocklet

Blocklet Service

給 Blocklet 用的一組開箱即用服務，包括認證、通知等。

Developer Guide

Welcome to the Developer Guide for Blocklet Service. This guide provides comprehensive information for developers who want to programmatically integra

Authentication Service

The Authentication Service provides a comprehensive solution for managing user identity, authentication, and session control within your blocklet. It

Discovery & SEO Services

Effective Search Engine Optimization (SEO) and content discoverability are critical for any web application's success. They ensure that your blocklet

Open Graph

Overview

OpenEmbed

This is a placeholder for a diagram. Do not edit this line directly.

EventBus Service

The EventBus Service is a messaging system that facilitates communication between different blocklets and the core system. It employs a publish-subscr

Image Service

The Image Service provides robust, on-the-fly image processing capabilities through a simple URL-based API. Developers can perform various manipulatio

KYC Service

The Know Your Customer (KYC) Service provides a standardized way to verify user identity attributes within your application. This service enables deve

MCP Service

The Model Context Protocol (MCP) Service provides a standardized way for blocklets and their components to expose AI-powered tools and capabilities. I

Notification Service

The Blocklet Service provides a robust, multi-channel Notification Service designed to streamline communication with your users. Instead of building a

OAuth Service

The OAuth Service enables developers to integrate third-party authentication providers and to expose a standard OAuth 2.0 interface for their own appl

Overview

Blocklet Service is a foundational layer that provides a suite of ready-to-use, reusable services for blocklets. It is designed to run within a Blockl

User Guide

This guide is for administrators and non-technical users, providing step-by-step instructions for configuring and managing the Blocklet Service throug

AIGNE Hub

The AIGNE Hub acts as a centralized control panel for integrating and managing AI capabilities across all your blocklets. It simplifies the administra

Blocklet Studio

Blocklet Studio is a no-code platform designed for administrators to create, manage, and publish new blocklets using pre-built templates. It streamlin

Dashboard

The Dashboard is the central administrative interface for your Blocklet Service. It functions as the primary hub for managing blocklets, monitoring th

Developers

The Developer Tools section provides administrators with access to a suite of powerful tools for monitoring, debugging, and understanding the inner wo

Logs

The Logs section provides administrators with direct access to real-time and historical log data generated by the blocklet. This tool is essential for

Performance

The Performance section provides administrators with essential tools to monitor the runtime health and resource utilization of blocklets. Consistent m

DID Connect

DID Connect is a comprehensive user and identity management center designed for administrators. It provides a centralized suite of tools for managing

Members

The Members section within DID Connect serves as the central administrative hub for user management. It provides a comprehensive interface for viewing

OAuth Apps

OAuth Apps functionality allows your service to act as an OAuth 2.0 provider. This enables third-party applications to securely access user data throu

Passports

A Passport is a verifiable digital credential issued to a user, serving as proof of identity or authorization within your application. As a fundamenta

Security

For administrators, the Security section is where you define advanced security rules, access policies, and response handling to protect your applicati

Settings

The Settings section within DID Connect is the central control panel for administrators to configure authentication policies, user verification proces

DID Spaces

DID Spaces provides a decentralized and secure storage solution integrated directly into your Blocklet Service. It allows administrators to manage app

Backups

The Backups feature, integrated with DID Spaces, provides a robust solution for safeguarding your application's data. It allows administrators to esta

Storage

The Storage section, part of the DID Spaces service, provides administrators with essential tools for monitoring and managing the storage resources al

Integrations

The Integrations section provides the tools necessary to connect your Blocklet Service with external systems and to manage programmatic access via the

Access Keys

Access Keys provide a method for granting programmatic access to your blocklet's services. They are used by applications, scripts, or external service

MCP Servers

The Model Context Protocol (MCP) provides a standardized framework that allows the main blocklet and its components to expose and consume AI-powered t

WebHooks

WebHooks provide a mechanism for your Blocklet Service to send real-time notifications to external services. By subscribing to specific system events,

Operations

The Operations section provides a centralized suite of tools for administrators to manage and monitor the production environment of their blocklets. I

Advanced

The Advanced settings section provides administrators with access to powerful, low-frequency administrative functions. These tools are intended for cr

Analytics

The Analytics section provides essential tools for understanding your blocklet's performance and user engagement. It allows administrators to monitor

Audit Logs

The Audit Logs service provides administrators with a comprehensive and chronological record of all activities that occur within the system. This feat

Notifications

Overview

Website

The Website service provides a centralized control panel for administrators to manage all aspects of a site's public-facing presentation. This include

Branding

The Branding section allows administrators to customize the application's visual identity to align with their brand. Proper branding ensures a consist

Domains

Proper domain configuration is fundamental to establishing your website's brand identity and ensuring users can easily access your services. This sect

Navigation

The Navigation section provides administrators with the tools to configure and manage the navigation menus for the website. This includes creating, ed

Theming

The Theming section provides administrators with granular control over the visual appearance of their website, ensuring a consistent and on-brand user

Blocklet Spec

@blocklet/meta 規定 Blocklet 的中繼資料格式，並提供解析與驗證工具。

API 參考

@blocklet/meta 函式庫提供了一套全面的實用函式，用於以程式化方式與 blocklet.yml 元資料進行互動。這些輔助函式簡化了常見任務，例如解析、驗證、資料操作和安全操作。無論您是在建構開發工具、自訂 blocklet 執行環境，還是與 Blocklet 生態系統互動的應用程式，這些

元件與狀態工具程式

@blocklet/meta 函式庫提供了一套全面的工具函式，旨在簡化與 BlockletState 物件的互動。Blocklet，特別是複合型 Blocklet，會被表示為一個元件樹。這些工具程式提供了強大且高效的方法來遍歷此樹、尋找特定元件、檢查其狀態，以及提取用於執行時期操作、UI 渲染和管理

DID 與錢包工具

本節提供與去中心化識別碼 (DID) 和密碼學錢包相關的工具函式的詳細參考。這些輔助工具對於管理 Blocklet 的身分、生成應用程式專用錢包以及從使用者會話中提取身分資訊至關重要。

檔案工具

此模組提供一組低階函數，用於與檔案系統上的 blocklet.yml 檔案進行互動。它包括用於定位、讀取和寫入元資料檔案的工具，以及自訂的 Joi 擴充功能，以簡化檔案路徑和 DID 的驗證。

元資料輔助函式

這些工具函式是您從遠端來源獲取、處理和驗證 Blocklet 元資料的工具包。無論您是從商店 URL 還是本地檔案路徑解析 Blocklet，這些輔助函式對於任何需要與本地不存在的 Blocklet 互動的工具或應用程式（如啟動器、開發工具或註冊服務）都至關重要。

其他公用程式

本節介紹由 @blocklet/meta 提供的一系列專業輔助函數。這些公用程式處理諸如解析和建立通訊通道字串，以及從地址產生獨特且視覺上可識別的圖示（Blockies）等任務。

導覽工具函式

這些函式是在基於 Blocklet 的應用程式中建構動態使用者介面的引擎。它們解析並處理來自 blocklet 元資料（blocklet.yml）及其目前狀態的 navigation 屬性，將主 blocklet 及其所有子元件的導覽項目匯總成一個統一、可供渲染的結構。

解析與驗證

本節為用於讀取、解析和驗證 blocklet.yml 檔案的函式提供了詳細的參考。這些工具是與 Blocklet 規範搭配使用的程式化介面，可確保您的 blocklet 元資料正確、完整，並可供 Blocklet Server 和其他工具使用。

安全性公用程式

@blocklet/meta 函式庫提供了一套用於處理密碼學操作的安全性公用程式。這些函式對於確保資料的完整性和真實性至關重要，特別是用於簽署和驗證 Blocklet 中繼資料和 API 回應。它們構成了 Blocklet 生態系統內信任的基石。

URL 與路徑工具

本節提供了一組輔助函式，用於建立 URL 友善的字串和驗證 URL 路徑。這些工具對於在您的 blocklet 應用程式中產生乾淨、有效且一致的路由和連結至關重要。

入門指南

本指南簡要介紹如何使用 @blocklet/meta 函式庫。您將學習如何安裝該套件並執行最常見的任務：解析 blocklet.yml 檔案以在您的應用程式中存取其元資料。

概覽

@blocklet/meta 是 Blocklet 生態系中的一個基礎函式庫，作為管理 blocklet 元資料的權威工具組。它為 blocklet.yml 清單檔案建立了正式規範，並提供了一套全面的工具函式，用於以程式化方式解析、驗證、修復及與此元資料互動。

Blocklet 規範 (blocklet.yml)

blocklet.yml 檔案是每個 Blocklet 的核心。它是一個 YAML 清單，定義了您應用程式的所有基本元數據，作為 Blocklet Server 和生態系統中其他工具的唯一真實來源。

組合 (元件)

Blocklet 組合是一項強大的功能，可讓您透過組裝更小、獨立的 blocklet 來建構複雜的模組化應用程式。這種方法有助於提高可重用性、關注點分離和簡化維護。blocklet.yml 檔案中的 components 屬性是此功能的基石，它定義了一個 blocklet 對其他 blocklet

核心元資料

核心元資料欄位確立了 Blocklet 的基本身份。它們提供了用於在 Blocklet 生態系中進行識別、版本控制和可發現性的基本、一目瞭然的資訊。每個 blocklet.yml 檔案都必須定義這些基礎屬性，才能被視為有效。

發行版和連結

本節介紹 blocklet.yml 中的欄位，這些欄位定義了您的 blocklet 如何打包以供發行，並提供了指向其原始碼、首頁、文件和其他資源的重要連結。正確設定這些欄位對於可發現性、使用者信任以及整合到 Blocklet 生態系統中至關重要。

執行與環境

blocklet.yml 中的執行與環境設定是您 Blocklet 運作的藍圖。它指定了必要的執行環境、定義了系統需求、向使用者揭露設定選項，並與 Blocklet 的生命週期掛鉤。正確設定此部分對於建立一個可攜、穩健且使用者友善的應用程式至關重要。

介面與服務

Blocklet 透過 interfaces 與外部世界互動，並透過 services 增強其強大、可重用的功能。blocklet.yml 中的 interfaces 屬性是公開應用程式網頁、API 和其他端點的基石。然後，可以將 services（例如內建的身份驗證服務）附加到這些介面上，以提供通

營利

Blocklet 開發者可以透過由 OCAP (Open Capability Access Protocol) 和 NFT 驅動的內建支付系統來將其工作營利。當使用者購買一個 blocklet 時，他們會收到一個獨特的 NFT（一個 BlockletPurchaseCredential），作為所有

人員與所有權

適當地標示作者身份並為貢獻和維護定義角色，對於一個健康的開源生態系統至關重要。在 blocklet.yml 中，您可以使用三個不同的欄位來指定參與專案的人員：author、contributors 和 maintainers。所有這些欄位都使用一個通用的 person 結構描述。

安全性與資源

安全性和資源管理對於創建可信賴且可互通的 Blocklet 至關重要。blocklet.yml 規範為此提供了兩個關鍵欄位：signatures 用於確保元資料的完整性和真實性，以及 resource 用於定義和捆綁共享資產，以便與其他 Blocklet 組合。

UI 與主題

本節詳細介紹 blocklet.yml 檔案中的 navigation 和 theme 屬性。這些屬性對於定義 blocklet 對使用者介面的貢獻至關重要，它們控制 blocklet 在選單中的顯示方式，並指定其外觀和風格，以確保一致的使用者體驗。

Blocklet Store

發布和取得 Blocklet 應用的平台。

Best practice

NOTE: this page is in draft and is subject to change.

Blocklet Detail Page

Instructions on obtaining a meticulously configured blocklet detail page.

Frequently asked questions

Q：How to create a blocklet from scratch?

Publish your blocklet

TODO: this page is not yet complete

Choose License

TODO: this page need to be updated

Request Entity too large

Blocklet Store limit blocklet bundle size within a certain range for efficiency considerations, since larger bundles takes much more time to download

Developer Program Policies

Effective Date: 2024-06-01 Welcome to the Blocklet Store Developer Program. The following policies are designed to ensure a safe, trustworthy, and eff

Get your developer passport

If we want to publish an application to the Blocklet Store, we need the Blocklet Store to issue a Developer certificate to us.

Internationalize your blocklet

This page describes how to support multiple languages of an blocklet in the Blocklet Store.

Listing information

Welcome to the Blocklet Development Guide. This document is designed to provide all developers with a complete list of steps to develop blocklets, hel

How to fix logo and screenshot ratio?

To guarantee the effective presentation of the Blocklet detail page, we require Blocklet developers to submit images that adhere to certain specificat

Manage your blocklet

TODO: this page need to be updated, topics to be covered: auto publish, private publish

Prepare your Blocklet

Best practice Internationalize your blocklet

Error: Bundles with the same did cannot in different stores

If you encounter the above error when publishing your blocklet to the blocklet store, like the following screenshot

Publish your Blocklet

Permission Modes

At the heart of permission models of Blocklet Store is the DID and Verifiable Credential-based developer passport mechanism, an advanced system for

Supplying images

Welcome to the Blocklet Development Guide. This document is designed to help developers understand what images are required and how to add them to you

How to upload/update different links and videos on the Blocklet page?

How to create a new Blocklet and upload various links and videos:

Terms and Policies

- Developer Program Policies

What is blocklet store

NOTE: this page is in draft and is subject to change.

How to create high-quality screenshot?

Blocklet Store has always been committed to providing developers and users with an excellent experience. To further improve the display effect of bloc

Blocklet UI（React）

@blocklet/ui-react 提供 Blocklet 開發常用的介面元件。

元件

本節為 Blocklet UI React 函式庫中所有可用的 UI 元件提供了詳盡的參考文件。每個元件都附有其屬性（props）、實際用法範例和最佳實踐的說明，以確保能順利地整合到您的應用程式中。

組件管理

組件管理提供了一套工具，用於在執行中的應用程式內動態安裝、發布和管理 blocklet 組件。此功能使應用程式得以模組化和擴充，讓管理員和開發人員能夠新增或更新功能，而無需對核心應用程式進行完整的重新部署。

BlockletStudio

BlockletStudio 元件提供了一個精簡、可嵌入的使用者介面，用於發佈和管理 blocklet 資源。它透過渲染一個全頁 iframe 來運作，該 iframe 從指定的 blocklet 服務載入一個專用的發佈介面。這讓您的應用程式能夠提供一致且強大的資源管理體驗，而無需從頭開始建構 UI

ComponentInstaller

ComponentInstaller 是一個實用工具元件，對於依賴其他 blocklet 的功能扮演著守門員的角色。它會驗證指定的元件相依性是否已安裝。如果尚未安裝，它會為管理員（預設為 owner 或 admin 角色）提供一個使用者友善的介面，讓他們可以直接安裝。如果使用者缺乏必要的權限，它會顯

佈局

佈局元件是建構 blocklet 應用程式使用者介面的基礎建構模塊。它們提供了一致且可預測的框架，包括主要的 Header、Footer 和內容區域。透過利用這些元件，您可以確保在整個應用程式中提供專業且一致的使用者體驗，因為它們會根據您的 blocklet 元資料自動調整。

Dashboard

Dashboard 元件為 blocklet 應用程式提供了一個預先建置、響應式的佈局，通常用於管理介面或以使用者為中心的視圖。它透過解析 blocklet 的元資料，自動建構一個包含側邊欄、頁首和主要內容區域的標準儀表板。此元件顯著減少了建構通用應用程式結構所需的樣板程式碼。

Footer

Footer 元件為您的應用程式提供一個標準化、回應式的頁尾。它會透過讀取您的 blocklet 的元資料，自動填入其內容——包括品牌、導覽連結、社群媒體圖示和版權資訊。這種資料驅動的方法確保了一致性並簡化了設定。

Header

Header 元件為 Blocklet 應用程式提供了一個響應式且可自訂的頁首。它透過直接從 blocklet 的設定檔（blocklet.yml）讀取元資料，自動填入導覽連結、應用程式標誌和使用者會話控制項。此元件旨在以最少的設定建立一個一致且功能豐富的頁首。

通知

本節詳細介紹了可用於實作即時使用者通知系統的元件和工具。該系統旨在透過專用的 UI 元件和快顯訊息，向使用者及時傳遞更新。

使用者管理

使用者管理套件提供了一系列預先建置的 React 元件，專為處理基本的使用者相關功能而設計。這些元件簡化了在您的應用程式中實現使用者個人資料、會話管理和組織切換的過程，確保提供一致且可靠的使用者體驗。

UserCenter

UserCenter 元件是一個全面的預建介面，提供完整的用戶個人檔案和設定管理頁面。它整合了多種功能，包括使用者資訊顯示、通行證管理、隱私控制、通知設定和 DID 儲存管理，為使用者提供了一個集中式的中心。

UserSessions

UserSessions 元件會渲染一個全面的資料表，用於顯示和管理使用者的登入會話。它清晰地概覽了所有在各種裝置上的活躍、過期和離線會話，讓使用者能夠掌控其帳戶安全。

工具

本節提供了一系列輔助元件、高階元件 (HOCs) 和工具函式的說明文件。這些工具旨在簡化常見的開發任務、管理應用程式主題以及處理複雜的資料結構。

Icon

Icon 元件是一個基於 Material-UI 的 Avatar 元件所建構的靈活工具。它旨在渲染來自多種來源的圖示，包括 Iconify 圖示字串、圖片 URL 以及基於字元的「字母頭像」。這種多功能性使其成為一個標準化元件，可滿足應用程式中大多數圖示和頭像的顯示需求。

核心概念

本文件說明 Blocklet UI React 函式庫的基本原則。其核心設計理念是元數據驅動方法，其中 UI 元件（如 Header、Footer 和 Dashboard）會根據 blocklet 的元數據自動設定和渲染。此策略確保了一致性，減少了樣板程式碼，並實現了能根據使用者角色和語言偏好進行調

入門指南

本指南提供逐步教學，引導您安裝 @blocklet/ui-react 函式庫並渲染您的第一個元件。目標是在最短的時間內，讓您的應用程式中能正常運作 Header 和 Footer。

Hooks API

本節提供該函式庫中可用的自訂 React Hooks 的詳細參考。這些 Hooks 旨在封裝和重用有狀態的邏輯，簡化 Blocklet 環境中的常見任務和互動。

操作指南

本節提供了實用的逐步指南，用於完成常見任務和使用該函式庫的元件實作特定工作流程。每個指南都設計為一組獨立的說明，旨在幫助您高效地達成特定成果。

概覽

@blocklet/ui-react 程式庫提供了一系列必要的 React 元件，旨在加速應用程式（稱為 Blocklet）的開發。它透過智慧地使用 blocklet 的元資料，簡化了通用使用者介面元素的建立過程，讓開發者能以最少的精力建構出一致且功能豐富的使用者介面。

Blocklets

Blocklet 套件、本地優先驗收、撰寫邊界和生命週期證據的 ARC 開發者文件。

Read the agent-run dashboard

The Agent Observability dashboard answers what your agents did lately — failures, cost outliers, round counts and per-app roll-ups — and which of its numbers are not what their labels suggest.

Read one agent run in Traces

Open an agent-run trace in Agent Observability: which runs you are allowed to see, the list and its filters, the round-by-round timeline, the event inspector, and the trace assistant.

Read your AI usage in Agent Observability

Read the AI token ledger the Agent Observability blocklet renders — the personal face, the admin face, and the AFS paths both are bound to, with the reconciliation limits verified on a live deployment.

Author a Blocklet

Organize declared capabilities, data boundary, and Web-facing surfaces without conflating their contracts.

Check, build, and inspect

Run arc blocklet check, build, inspect, and dev with real outputs; treat each command as a different proof.

Create and run locally

Scaffold a Blocklet with arc blocklet create, validate it, and serve it with blocklet run or service start — no DID Space required.

Data and AFS

Use AFS paths, mounts, seed, and collection declarations from a Blocklet without binding the product contract to a storage engine.

Discuss Kit lineage

Locate the current Discuss Kit reference implementation for replicated discussion data — without claiming full legacy product parity.

Get started

Install arc, pick a recipe, and walk the local package → check → run path before any remote publish.

Lifecycle

Separate local observation, package checks, build artifacts, and remote publish/deploy as distinct lifecycle stages.

Manifest and capabilities

Declare a Blocklet with blocklet.yaml fields the current parser and checker accept — not wishlists.

Blocklets

Understand ARC's application package-and-instance unit, start locally, and keep authoring, runtime, and release boundaries explicit.

Package and instance

Keep the shipped Blocklet package distinct from a particular running or configured instance.

Publish and deploy

Split local daemon registration, local DID Space publish, remote --server publish, and Pages deploy — mark unverified paths experimental.

Reference

Index of Blocklet commands, manifest field groups, lifecycle states, and evidence boundaries for ARC 2.0.0-beta.28.

Reference applications

Study real packages under ArcBlock/arc blocklets/ as bounded examples — not universal templates or product-parity proofs.

Test and diagnose

Collect source, contract, runtime, and visible-surface evidence when a Blocklet fails — and map each failure to the right command.

Web surfaces

Use AUP for interface semantics and Web Device for Web content/site rendering inside a Blocklet — link out, do not copy primitive catalogs.

Create Blocklet

用一條命令產生一個 Blocklet 專案骨架的命令列工具。

Add new template

[!NOTE] this page is a draft and need to be updated

Available Scripts

The project created by the create-blocklet tool will have the corresponding npm script configured in package.json for developers to use.

Folder Structure

After creation, your project should look like this:

Composition folder structure

After creation, your project should look like this:

Create blocklet composition

What is a Combined Application

Create first blocklet

Create Blocklet is an officially supported Blocklet creation tool that allows you to quickly create Blocklets and automatically add them to your project.

How to create a single blocklet?

create-blocklet supports two creation modes, create single application and combined application of type monorepo

Customize your blocklet

In the root directory of every Blocklet application there exists a blocklet.yml file, which is the configuration file for the Blocklet application, including the project name, version, author, description of the project and other configuration information.

FAQs

How the documentation is organized?

vite-plugin-wss-hmr

This page need to be updated

How To Guides

- How to create a single blocklet?

Install Blocklet CLI

About why Blocklet Server is required and how to install and setup Blocklet Server please refer to Blocklet Developer Guide.

Manage blocklet release

The project created by the create-blocklet tool is automatically configured with the corresponding versioning script

Getting Started

If you are an intermediate or advanced developer, and you already have a basic understanding of how blocklet works, you can start from Create first bl

Reference Guides

- Folder Structure

Setup DID Wallet

About why DID Wallet is required and how to install and setup DID Wallet please refer to Blocklet Developer Guide.

Setup Node.js

About why Node.js is required and how to install Node.js please refer to Blocklet Developer Guide

Welcome

Welcome to Create Blocklet, your Blocklet Project Assistant

Where to go from here?

- Blocklet Server - Blocklet CLI - Blocklet Pages - Blocklet Actions - Blocklet SDK - Blocklet UI

vite-plugin-blocklet

Creator Studio

面向內容創作者的工具。

Forum

Forum Blocklet is a customized application package of Discuss Kit, designed specifically for users and teams who wish to set up a forum.

FAQs

Overview

Getting Started

Overview

How To Guides

Overview

How to use the "Knowledge Planet" Blocklet

Introducing

Blog

The Blog Blocklet is a customized application package of Discuss Kit, specifically designed for users who wish to set up personal or corporate blogs.

Knowledge Planet (Beta)

This blocklet is in beta and is not recommended for production use

Personal Website (Beta)

This blocklet is in beta and is not recommended for production use

Bookmarklet

The Bookmarklet Blocklet is a customized application pack of Discuss Kit, aimed at providing a simple and efficient solution for saving and managing w

Doc

The Doc Blocklet is a customized application pack for Discuss Kit, specifically designed for users and teams who need to build and maintain a knowledg

Welcome

Overview

DID Connect 指南

連接使用者和應用的開放協定與開發套件。

DID Connect UI（React）

@arcblock/did-connect-react 提供 DID Connect 的介面元件和工作階段管理。

進階主題

當您熟悉 SessionProvider 和 DidConnect 等核心元件後，就可以探索 @arcblock/did-connect-react 程式庫更強大、更靈活的功能。本節涵蓋了進階主題，讓您能夠建構更複雜、更健全且更方便使用者使用的去中心化身分應用程式。

驗證方法

雖然 DID 錢包是主要且最安全的驗證方法，但 @arcblock/did-connect-react 仍為多種替代登入方法提供了強大的支援，以提供靈活性並滿足不同使用者的偏好。本節詳細介紹如何將 OAuth (社群登入)、Passkeys (無密碼驗證) 和统一登录站点群登入整合到您的應用程式中。

工具程式

@arcblock/did-connect-react 函式庫匯出了一系列工具函式，旨在簡化與身份驗證流程、資料處理和 API 通訊相關的常見任務。雖然核心元件和掛鉤（hooks）處理了大多數使用情境，但這些工具程式為進階整合或自訂實作提供了精細的控制。

API 參考

本節為整個 @arcblock/did-connect-react 函式庫中使用的所有主要 TypeScript 類型提供了全面的參考。了解這些資料結構對於有效使用 SessionProvider 等元件和 useConnect 等掛鉤至關重要。

核心元件

@arcblock/did-connect-react 函式庫圍繞著幾個核心元件構建，這些元件為將去中心化身份整合到您的應用程式中提供了基礎。這些元件處理會話管理和使用者面向的連接介面。

連線 UI (DidConnect)

DidConnect 元件是一個預先建置的、全面的 UI 解決方案，用於處理各種去中心化身分（DID）連線流程。它為登入、驗證和個人資料請求等操作提供了一個使用者友善的介面，並原生支援多種連線方式。

Session 管理 (SessionProvider)

SessionProvider 是 @arcblock/did-connect-react 函式庫的基石。它是一個 React Context Provider，封裝了所有與 session 相關的邏輯、狀態和操作。透過用 SessionProvider 包裹您的應用程式，您可以將使用者的 sess

入門指南

本指南將引導您完成使用 @arcblock/did-connect-react 將去中心化身分（DID）驗證整合到您的 React 應用程式中的基本步驟。只需幾分鐘，您就可以擁有一個功能齊全的登入和登出流程。

Hooks

@arcblock/did-connect-react 函式庫提供了一組強大的 React hooks，可提供程式化控制和靈活的資料存取。雖然 SessionProvider 提供了一種方便的基於上下文的方法，但 hooks 為您提供了複雜 UI 和進階用例所需的精細控制。

useConnect

useConnect hook 提供了一種強大的程式化方式來開啟、關閉和管理 DidConnect UI 模態框。當您需要比宣告式 Button 元件提供更多對連線流程的控制時，例如從自訂 UI 元素、選單項目或響應應用程式事件來觸發模態框，這便是理想的解決方案。

useDid

useDid hook 是一個方便的實用程式，可輕鬆地從 session.user 物件中提取和使用特定的 DID 相關資訊。它簡化了使用者物件的解析過程，無需手動處理即可獲取永久 DID、錢包資訊和已連接帳戶等常用資料。

useOAuth & usePasskey

雖然 DidConnect 元件和 useConnect hook 為所有驗證方法提供了一套全面、預先建置好的 UI，但您可能需要建置自訂的驗證流程。useOAuth 和 usePasskey hook 提供了直接存取社交登入（OAuth）和無密碼驗證（Passkey）底層邏輯的方法。

總覽

@arcblock/did-connect-react 程式庫提供了一套全面的 React 元件和掛鉤 (hooks)，旨在將去中心化身分 (DID) 功能無縫整合到您的 Web 應用程式中。它使用 ArcBlock 的 DID Wallet 簡化了使用者驗證和會話管理的流程，為傳統登入系統提供了一

UI 元件

@arcblock/did-connect-react 函式庫包含一組預先設計樣式的輔助 UI 元件，旨在幫助您以一致且美觀的方式顯示 DID 相關資訊。這些元件與核心連接流程無縫協作，並建立在強大的 @arcblock/ux 和 @mui/material 函式庫之上，確保您的應用程式具有一致的外

Address

Address 元件是一個專門的 UI 元素，旨在以清晰、可讀且使用者友善的格式顯示去中心化識別碼 (DID) 位址。它透過提供縮短和輕鬆複製的選項，智慧地處理 DID 常見的長字串，從而提升整體使用者體驗。

Avatar

Avatar 元件是顯示使用者個人資料圖片的簡單方便方法。它可以根據使用者的去中心化識別碼 (DID) 自動產生獨特的頭像，或顯示來自指定 URL 的圖片。

按鈕

ConnectButton 元件提供了一個預設樣式且易於識別的按鈕，用於啟動 DID Connect 身份驗證過程。它簡化了為您的應用程式登入流程建立一致使用者體驗的過程。該按鈕採用 DID Connect 官方品牌設計，包括標誌和配色方案，為使用者提供了清晰的行動號召。

Logo

Logo 組件提供了一種簡單且一致的方式，在您的應用程式中顯示官方的 DID Connect 標誌。它是一個專為品牌形象設計的直觀視覺組件，確保您的用戶能識別出這種熟悉的去中心化身份連接方式。

DID Connect SDK（Node.js）

@arcblock/did-connect-js 幫 Node.js 應用接入 DID Connect 做認證。

API 參考文件

本節提供 DID Connect SDK 中核心類別、建構函式、方法和可用選項的詳細文件。了解這些組件是為您的應用程式建構穩健且安全的驗證流程的關鍵。

WalletAuthenticator

WalletAuthenticator 是 DID Connect 會話中伺服器端邏輯的核心類別。它負責建立驗證請求、簽署回應以及驗證從使用者錢包返回的資料。它獨立於任何特定的網頁框架運作，處理所有加密操作和 JWT 管理。

WalletHandlers

WalletHandlers 類別是一個高階實用工具，旨在將 DID Connect 工作流程無縫整合到 Express.js 或類似的伺服器端框架中。它會自動為給定的操作設定所有必要的 API 端點，處理您的應用程式和使用者 DID 錢包之間的通訊。

協議聲明

協議聲明是一個強大的工具，用於獲取使用者對服務條款、隱私政策或任何其他正式協議等文件的明確同意。此聲明並非簡單的核取方塊，而是要求使用者以密碼學方式簽署文件的雜湊值（摘要），從而創建一個可驗證且不可否認的同意記錄。

資產聲明

「資產聲明」用於要求使用者出示特定鏈上數位資產的所有權證明，例如非同質化代幣（NFT）。這在 NFT 門禁等情境中特別有用，其中服務或內容的存取權限僅限於特定資產的所有者。

資產或 VC 聲明

The assetOrVC 聲明提供了一種靈活的方式，要求使用者出示擁有符合特定標準的鏈上資產（如 NFT）或可驗證憑證（VC）的所有權證明。這對於需要彈性存取控制的場景特別有用，在這些場景中，可以接受多種形式的資格證明。

Auth Principal 宣告

authPrincipal 宣告是任何 DID Connect 會話的基石。它是最基本且最常用的宣告，旨在要求使用者連接他們的錢包並選擇一個去中心化識別碼（DID）來與您的應用程式互動。這個初始步驟建立了一個安全的會話，並為應用程式提供了使用者的主要 DID，所有後續的互動都建立在此基礎之上。

聲明參考

DID Connect 讓應用程式能夠向使用者的數位錢包請求特定資訊或操作。這些請求被稱為「聲明」。每種聲明類型都為不同的目的而設計，從簡單的身份驗證到複雜的多步驟工作流程，如交易簽署或出示數位憑證。

加密金鑰聲明

encryptionKey 聲明是一項強大的功能，它允許您的應用程式向使用者的錢包請求一個秘密的加密金鑰。這個金鑰是根據錢包的主密鑰和您提供的 salt 確定性地派生出來的。它使應用程式能夠加密使用者特定的資料，而無需處理使用者的主私鑰，從而增強了安全性和隱私性。

金鑰對聲明

「金鑰對聲明」是一項強大的功能，允許您的應用程式請求使用者的錢包產生一個新的加密金鑰對。這對於建立新的、特定於應用程式的帳戶或身份特別有用，這些帳戶或身份由使用者的錢包安全管理，但專門用於與您的服務互動。

準備交易聲明

prepareTx 聲明是 dApp 的一個強大工具，適用於需要使用者完成並簽署交易的場景，尤其是在支付和資產轉移情境中。與標準的 signature 聲明（其整個交易是預先定義的）不同，prepareTx 會將一筆部分建構的交易傳送至錢包。錢包接著負責新增必要的輸入（如代幣或資產）以滿足指定的 r

個人資料聲明

個人資料聲明（Profile Claim）用於從使用者的 DID 錢包中請求個人資訊。這是許多應用程式的基礎步驟，透過在使用者明確同意下安全地獲取使用者資料，來實現使用者註冊、個人化體驗和通訊等功能。

簽章聲明

簽章聲明是一種多功能工具，用於請求使用者使用其 DID 關聯的私鑰簽署任意資料。此加密簽章可作為使用者已查看並批准該資料的不可否認的證明，從而有效地證明其對數位身份的控制權。常見的使用案例包括簽署訊息、授權交易或確認委託。

可驗證憑證宣告

可驗證憑證 (Verifiable Credential, VC) 是一種數位防竄改的憑證，可用於證明持有者的某些資訊。可驗證憑證宣告允許您的應用程式要求使用者從其 DID 錢包中出示特定的 VC，以證明某項屬性、資格或權利。

範例

歡迎來到範例部分。在這裡，您將找到一系列實用、端到端的範例，旨在幫助您快速理解和實作 DID Connect 的各種功能。每個範例都提供了一個真實場景，並附有可執行的程式碼片段，以引導您完成整個過程。

多鏈連接

DID Connect 的設計考慮了互通性，將其功能擴展到 ArcBlock 生態系統之外。您可以對其進行設定，以與其他主要區塊鏈（例如 Ethereum 和 Solana）無縫互動。本範例將示範如何設定 DID Connect 會話以請求在 Ethereum 網路上執行操作。

多步驟會話

在許多真實世界的應用中，單一的互動並不足以完成一項任務。您可能需要引導使用者完成一系列步驟，例如先註冊個人資料，然後驗證資產所有權，最後簽署使用者協議。DID Connect 函式庫讓您可以將多個會話串連成一個無縫的單一多步驟工作流程，從而簡化這些複雜的互動。

出示 NFT

此範例示範如何限制應用程式中的特定內容或功能，僅供擁有特定非同質化代幣 (NFT) 或鏈上資產的使用者存取。這是一種常見的 Web3 模式，用於專屬會員資格、活動門票或特殊數位物品。

簡易登入

本範例提供了一個逐步指南，說明如何使用 DID Connect 實作一個基本的使用者登入系統。目標是使用者的 DID 錢包來驗證使用者，並檢索其基本個人資料，例如姓名和電子郵件地址。這是該程式庫最常見的用途之一。

交易支付

此範例展示了 DID Connect 一個常見且強大的使用案例：要求使用者簽署並提交一筆鏈上交易以進行支付。此模式非常適合電子商務結帳、服務訂閱、內容購買或任何需要轉移代幣或資產的場景。

入門指南

本指南提供了一個最小化的、逐步的範例，幫助您在 Node.js 應用程式中設定基本的 DID Connect 會話。在本教學結束時，您將擁有一個可以透過用戶的 DID 錢包請求其個人資料資訊的工作伺服器。

指南

歡迎來到 DID Connect 指南。本節提供了實用的逐步說明，用於實現常見用例和利用該函式庫的進階功能。無論您是設定第一個 DID Connect 會話，還是建構複雜的多步驟工作流程，這些指南都旨在幫助您成功。

串接工作流程

DID Connect 讓您能夠將多個獨立的驗證會話連結在一起，從單一的初始互動為使用者建立一個無縫的多步驟流程。這對於複雜的場景非常理想，例如使用者註冊後接著進行 KYC，或登入後接著進行交易確認。

委派連線

委派連線 (Delegated Connect) 是一項進階功能，它允許應用程式使用臨時或較低權限的「agent」DID 來執行 DID 連線操作，同時仍向終端使用者呈現其主要的官方 DID，從而增強安全性。這意味著應用程式的主要私鑰永遠不會在處理日常互動的熱錢包中暴露。

處理錢包回應

在您如請求聲明指南中所示定義了 DID Connect 會話的聲明後，下一個關鍵步驟是處理來自使用者 DID 錢包的回應。@arcblock/did-connect-js 函式庫提供了一套全面的生命週期回呼，以管理會話的每種可能結果，無論是使用者批准、拒絕，還是會話逾時。

請求 Claim

在 DID Connect 會話中，「claim」是您向使用者錢包請求的特定資訊或操作。這可以是從姓名、電子郵件到證明資產所有權的加密簽名等任何內容。本指南將帶您了解向使用者請求 claim 的不同方式。

DID Connect 工作流程

DID Connect 會話是一個安全、去中心化的身份驗證過程，允許使用者使用其 DID 錢包與去中心化應用程式 (DApp) 互動。本指南將詳細解析從最初的 QR 碼掃描到最終處理使用者回應的端到端流程。

總覽

歡迎使用 DID Connect，這是一套專為使用去中心化識別碼（DID）進行無縫、安全驗證而設計的協議。本函式庫 @arcblock/did-connect-js 提供了將 DID Connect 整合到您的 Node.js 應用程式中所需的工具，讓使用者可以透過安全的 DID Wallet 登入

How to add/switch accounts?

Click on the profile picture in the top right corner of the site to open the personal control panel Click on the account section below the avatar to s

How do I connect my social account to a wallet?

You can easily connect to some Blocklets using your social accounts, like Google or Apple, without setting up a DID Wallet right away.

Developer Guide

Overview

Specify the behavior of DID Connect via URL.

In some cases, users need to be able to quickly switch to a specified account in any link. This can be achieved by customizing the behavior of the DID

Quick Start

Integrating DID Connect is simplest by first creating a Blocklet. If you are unsure how to create a Blocklet, please refer to: Create Blocklet Docume

Introduction

This is where you will learn everything about DID Connect.

DID Connect Protocol

DID Connect Protocol is an open protocol that provides a secure and decentralized mechanism for connecting users with DApps by using cryptography tech

DID Connect Workflow

Glossary

FAQ

- How to use DID Connect in other frameworks

User Guides

- How do I update profile?

Configure OAuth login

- Configure GitHub login

Configure Auth0 Login

Auth0 is a third-party login management platform that allows easy integration of login methods such as Google, Apple, GitHub, etc. Blocklet Server sup

Configure GitHub login

Github provides OAuth login method, users can log in to GitHub OAuth-enabled applications through their GitHub accounts. For users, they no longer nee

Configure Google Login

Google provides the OAuth login method, allowing users to log in to applications that have integrated Google OAuth using their Google accounts. For us

Reference

- DID Connect Protocol

Request digest signature

This function is basiclly same as , the difference lies in the ability to simplify the data to be signed and protect the original content of the sign

Request multiple claims

In some cases, you may need do multiple signature in single one DID Connect, which can get a smoother experience, follow this article to learn how to

Request multiple steps

Similar to , you can do multiple signature in single one DID Connect, but there are some different features, follow this article to learn how to do m

Request NFT

In some cases, you may need check if your DID Wallet has specific NFT or VC, like if you've been to ArcBlock devcon 2021, follow this article to learn

Request payment

In some cases, you may need to pay some fees to a Blocklet, follow this article to learn how to request payment with DID Connect. The basic process is

Request for signature

In some cases, you may need to use your DID Wallet to sign some data, this signature can be verified by your DID Wallet, follow this article to learn

How to manage storage?

Click on the personal avatar in the upper right corner of the website, click to show the menu, and click on the personal center button . On the user c

Subscribe to DID Connect Events

Overview

How to change my passport?

During the process of accessing the blocklet, you may encounter some page prompts indicating that you do not have permission to access it. This means

How do I update profile?

Open any site (such as https://www.arcblock.io/en ), click on the person's profile picture in the upper right corner Click on the personal center to

Type cheatsheet

Agreement

How to manage login sessions?

Click on the profile picture in the top right corner of the website, click on the menu that appears, and then click on the personal center button On

How to use DID Connect in other frameworks

DID Connect currently only supports React, Vue.js, svelte, Solid.js, AngularJS are actively under development

DID Names

基於 NFT 和可驗證憑證的命名服務。

How to Guides

Quick help when you have setup your domain.

Bulk host domains using the didnames CLI

DID Names offers a didnames CLI tool to simplify managing domains hosted with other providers within the DID Names system.

FAQs

Overview

Hosting Domain

DID Names supports hosting domains registered with other registrars. After an NFT is issued for the domain, it can be used on the Blocklet platform.

How to hosting domains from Godaddy?

Different registrars have different ways of making modifications. This document will demonstrate some methods for registrars to modify name servers an

Enable DID Domain in Blocklet Server

The older version of Blocklet Server does not have DID Domain enabled by default. You need to manually configure the URL of the DID Domain service to

Get DID Domain

Before using the DID domain name, you need to obtain a domain name. You can follow the steps below to obtain a domain name.

How to host a domain from Namecheap on DID Names

If you purchased your domain on Namecheap, please consult the following documentation to update your nameservers.

Introduction

What Is a DID Name?

Terminology

What is the relationship between DID Domain and DID Names? A DID Domain name is a type of DID Name Service. Standardize the terms "top-level domain,"

Getting Started

Step-by-step instructions on how to get and use a domain on the blocklet platform:

Upgrade DID Names Subscription

If you want to update your DID Names subscription, from monthly to yearly billing, checkout video below:

Use DID Domain

There are two ways to add your DID domain to a running Blocklet:

DID Space SDK（Node.js）

@blocklet/did-space-js 在 Node.js 裡以程式方式與 DID Space 互動。

API 參考

歡迎來到 DID Space Client SDK 的完整 API 參考。本節為每個可用的類別、方法和指令提供了詳細的文件。它旨在成為一個全面的資源，幫助您快速找到特定資訊並了解 SDK 的全部功能。

NFT 指令

處理 NFT 相關資產及其關聯 DID 文件的專門指令。這些指令簡化了將以非同質化代幣（NFT）形式表示的數位資產儲存至您 DID 空間的流程。

PutNftObjectCommand

PutNftObjectCommand 是一個專門設計的命令，用於上傳數位資產（如圖片、影片或音訊檔），並同時建立或更新其關聯的 DID 文件。此過程有效地將去中心化識別碼（DID）與特定的資料連結起來，這是在 DID Spaces 中管理非同質化代幣（NFT）和其他可驗證數位資產的關鍵步驟。

物件命令

物件命令是在 DID Space 中與個別檔案（或稱「物件」）互動的核心工具。它們為所有 CRUD（建立、讀取、更新、刪除）操作提供了基本的建構模塊，讓您能以程式化的方式上傳、下載、列出和刪除檔案。

DeleteObjectCommand

DeleteObjectCommand 用於從您的 DID Space 中永久刪除一個物件。此操作不可逆。

GetObjectCommand

GetObjectCommand 用於從您的 DID Space 中擷取或下載物件。物件的內容會以可讀流的形式返回，使其能夠高效處理任何大小的檔案，而不會消耗過多記憶體。

ListObjectsCommand

ListObjectsCommand 用於從您 DID Space 中的指定路徑擷取物件列表，這些物件可以是檔案或目錄。它透過選項提供靈活性，可進行平面（僅列出直接子項目）和遞迴（列出所有巢狀項目）的目錄遍歷。

PutObjectCommand

PutObjectCommand 用於在您的 DID Space 中上傳新物件或更新現有物件。此命令功能多樣，可以處理各種資料類型，例如檔案、字串或緩衝區，使其成為向您的空間新增內容的主要方法。

SpaceClient

SpaceClient 是與 DID Space API 互動的主要介面。它是 SDK 的主要入口點，負責處理設定、身份驗證以及向您的 DID Space 發送命令。

同步指令

用於同步 DID Space 中本地資料夾與遠端目錄狀態的高階指令。這些指令透過自動偵測差異並執行必要的操作，簡化了保持目錄同步的複雜過程。

SyncFolderPullCommand

SyncFolderPullCommand 是一個高階指令，旨在將遠端目錄從 DID Space 同步到本機資料夾。它會智慧地比較遠端來源和本機目標之間的檔案，僅下載新的或已更新的檔案。這能有效確保您的本機目錄是遠端資料的最新鏡像。

SyncFolderPushCommand

SyncFolderPushCommand 是一個高階指令，旨在高效地將本地目錄與您 DID Space 中的遠端目錄同步。它會智慧地比較本地和遠端狀態，上傳新的或修改過的檔案，並可選擇性地刪除本地已不存在的遠端檔案。此指令簡化了常見任務，如部署靜態網站、備份重要資料或分發數位資產。

客戶端初始化與驗證

SpaceClient 是與 DID Space 網路互動的主要介面。在您可以上傳檔案或管理資料之前，必須先使用正確的組態和驗證憑證來建立一個客戶端的實例。本指南將引導您了解初始化和驗證 SpaceClient 的各種策略。

核心概念

本節深入探討驅動 @blocklet/did-space-js SDK 的基本原則和架構模式。理解這些概念將有助於您更有效地使用此程式庫，並更自信地排解問題。此 SDK 建立在三大支柱之上：穩健的命令模式、靈活的驗證方法和安全的請求簽章機制。

請求簽章

為確保與您的 DID Space 每次互動的安全性和完整性，所有 API 請求都受到一個強大的密碼學簽章機制的保護。此過程保證了請求是真實的——由聲稱的身份發送——並且在傳輸過程中未被篡改。

快速入門

歡迎使用 DID Space Client SDK！本指南將引導您完成安裝、設定 SDK 以及執行首次檔案上傳的基本步驟。只需幾分鐘，您就可以開始使用了。

指南

歡迎來到指南區塊。在這裡，您將找到實用的逐步教學，旨在幫助您使用 DID Space Client SDK 完成常見任務和實作特定功能。每個指南都專注於一個真實世界的工作流程，提供完整的程式碼範例和最佳實踐。

管理資料夾預覽

DID Space 允許您為任何資料夾設定自訂預覽。此功能讓您能夠定義資料夾在應用程式中的呈現方式，將簡單的檔案列表轉變為豐富的互動式體驗，例如畫廊、文件預覽，甚至是迷你應用程式。這是透過資料夾 .meta 目錄中一個特殊的 preview.yml 檔案來管理。

同步資料夾

對於靜態網站託管、資料備份或協作資產管理等應用程式而言，保持本地目錄與 DID Space 中的遠端目錄同步是一項常見需求。DID Space Client SDK 透過兩個強大、高階的指令簡化了這個過程：SyncFolderPushCommand 和 SyncFolderPullCommand。

總覽

歡迎使用 DID Space Client SDK for JavaScript！這是一個功能強大、現代化的函式庫，專為 Node.js 環境設計，讓您能夠無縫地與 DID Spaces 互動。如果您正在建構使用者真正擁有並控制其資料的應用程式，那麼您來對地方了。

工具函式

@blocklet/did-space-js 函式庫匯出一系列工具函式，旨在簡化您在建構應用程式時會遇到的常見任務。這些輔助函式處理 DID 格式化、URL 標準化、編碼和錯誤解析等操作，讓您能專注於核心應用程式邏輯。

DID Spaces 指南

DID Spaces 的使用說明：功能、特性和求助管道。

DID Spaces UI（React）

@blocklet/did-space-react 提供連接和使用 DID Spaces 的 React 元件。

API 參考

本節作為在 DIDSpaceConnect 和 DIDSpaceConnection 元件中用作 props 的關鍵 TypeScript 型別和介面的參考。理解這些資料結構對於開發者充分利用該函式庫的全部功能、確保型別安全以及在 TypeScript 環境中正確設定元件至關重要。

類型

本節為整個 DID Space 元件庫中使用的核心 TypeScript 類型和介面提供詳細參考。理解這些資料結構對於在您的應用程式中正確鍵入元件 props 和管理狀態至關重要。

元件

DID Space React 函式庫提供了一組核心元件，旨在簡化連接 DID Space 並與之互動的流程。這些元件封裝了驗證、狀態檢查與資料顯示等複雜邏輯，讓您能輕鬆建構功能豐富的應用程式。

DIDSpaceConnect

DIDSpaceConnect 元件提供了一個多功能的按鈕，用於啟動與 DID Space 的連接。它簡化了各種驗證流程，包括初始連接和重新連接，並可以與使用者會話整合以進行持久儲存。

DIDSpaceConnection

DIDSpaceConnection 元件是一款多功能的 UI 卡片，旨在顯示已連接 DID Space 的關鍵資訊。它以清晰且互動的方式呈現空間的詳細資訊，包括其 NFT 頭像、名稱、DID 和目前的連線狀態。

入門指南

本指南將引導您完成將 DID Space 功能整合到您的 React 應用程式中的基本步驟。您將學習如何安裝必要的套件，並實作一個允許使用者連接到其 DID Space 並查看其詳細資訊的基本元件。

總覽

歡迎閱讀 @blocklet/did-space-react 的文件。此函式庫提供了一組 React 元件，旨在簡化將 DID Space 整合到您的應用程式中的過程。透過這些工具，您可以輕鬆地讓使用者連接他們的 DID Space 並顯示相關資訊，從而創造無縫且去中心化的使用者體驗。

Prod Spaces data retention policy updated

Welcome to the ArcBlock community! Here, we are committed to providing you with a platform to share insights, report issues, seek help, and inspire in

AIGNE

Scenario

Application Example

To help developers understand how to integrate DID Spaces and ensure they function correctly, we have prepared the following examples.

DID Spaces v0.5.83: OAuth integrated DID Space

The updates introduce the following new features:

Reading and Writing to DID Space Using @blocklet/did-space-js

Overview

Backup Blocklet to DID Space.

Overview

Get DID Space

Overview

Get the endpoint of the DID Space when logging into the application for the first time.

Overview

Get the endpoint of DID Space

Overview

Get the endpoint of the DID Space during the installation startup process.

Overview

Data retention policy

Overview

Best Practices for Developers

Here are some guidelines for using DID Spaces.

Install the DID wallet

You can refer to https://support.didwallet.io/howToDownload for completing the wallet download and installation.

Frequently Asked Questions

- Data retention policy

User Guide

Overview

Developer Guide

Overview

MCP服务器 MCP Server

Overview

Welcome

Overview

Fix CORS error when connecting DID Space

Overview

Create a DID Space by installing Personal DID Spaces.

Summary

Receive DID Space for free

Overview

Draft: Purchase DID Space

Overview

Reference Terminology

DID Spaces

Draft: Default Space How to upgrade by payment?

This is just a draft, to be perfected.

Connecting to the DID Space using the Gateway Address

Overview

The automatic backup of Blocklet is stuck, how can it be quickly restored?

Overview

How to re-subscribe to an expired DID Space

Overview

Switch the DID Space bound to NFT Blender.

Overview

DID Spaces v0.4.26 released: subscription fully adopts pay-as-you-go & supports paid upgrade Default Space

Through the relentless efforts of engineers, DID Spaces officially released a new version v0.4.26. The main features of this update include subscripti

Store the data of the DID Wallet.

Overview

NFT Maker

Scenario

The application connects to the DID Space to store and display personalized data.

Overview

Pricing policy

Overview

Restore Blocklet

Overview

Restore the Blocklet to the Blocklet Server.

Overview

Restore Blocklet to Launcher

Overview

Store personal data

Overview

DID Spaces v0.3.75 released: Supports reading and writing component spaces

As of now, the new version v0.3.75 of DID Spaces has been released. This update includes added read and write component space functionality, as well a

Todo List --> 待办事项列表

Overview

DID Spaces v1.0.48: 支持预览 post/bookmark/blog/doc

执行摘要

DID Spaces v0.6.0: OAuth Integration in DID Spaces

The key feature of this update is the integration of OAuth accounts with DID Spaces. Additionally, there are several enhancements and fixes responding

Change log

- Draft: Purchase DID Space

Application case

Currently, several online applications have integrated with DID Spaces and are operating successfully. These applications include:

DID Wallet 指南

DID Wallet 的使用說明：支援多條鏈，把身分和資產放在一起管理。

Get Started

- What is DID wallet？

How to add a chain?

Open your wallet and go to the home page Click the upper right corner to enter My, and then click the upper right corner Settings Click the Chain Mana

How to add a token?

Which chains and tokens are supported?

How to add ERC721 NFT?

On the token list page, find the EVM token (depending on which chain your NFT is on) and enter the token details page; Select your account with ERC721

How to backup mnemonic code?

Open DID Wallet and go to the home page of assets. Click the icon in the upper right corner to enter the Settings page. Continue to click the icon in

How to Connect Dapp?

DID Wallet supports three ways to connect to DApps:

How to create a bridge?

Which accounts can initiate Bridge Move

How to create wallet?

The creation process of DID wallet is very simple in design. It only needs one click to complete the creation process of wallet.

How to download DID Wallet?

DID Wallet currently supports installation on multiple client platforms.

How to turn on Face ID?

1. Enter menu page

How to find the hash of a bridge transaction?

Find the account for your bridge transactions, click "View in Block Explorer" Find transactions of type Withdraw Token Click to enter transaction deta

How to generate backup file?

Backup files are one way to fully restore a wallet. For more information about how to restore a wallet, refer to other help documents.

How to get native ABT?

Currently, there is only one way to get Native ABT: first get ERC20 ABT assets on the Ethereum mainnet, then exchange ERC20 ABT to native ABT via Arc

How to provide your NFT/Passport to a Dapp

Where is your NFT

How to provide a profile to a Dapp

How to create a profile

How to recover bridge(deposit/withdraw) history?

We currently only support recovery withdrawal history. How to recover withdrawal history: Enter the wallet homepage, click on ABT Click Bridge. Cli

How to recovery a passport from a Dapp?

From Dapp web

How to recover the wallet?

DID Wallet supports two ways to recover your Wallet:

How to swap ABT to Ethereum Mainnet

Currently, there is only one way to transfer your native ABT to Crypto Exchange.

Manage Asset

- How to add a token?

Manage Wallet

- How to turn on Face ID?

Q&A

- How to find the hash of a bridge transaction?

What can the scanning function do?

DID Connect, is the most important function of scanning the DID Connect QR code and performing subsequent operations.

What if I forget wallet password?

The DID wallet is a non-custodial wallet that does not store any information elsewhere. If your password is lost or forgotten, we can NOT help you get

What is DID?

The experience and use of decentralized identities implemented by DID technology is very different from traditional digital identities: First of all,

What is DID wallet？

DID Wallet is an advanced digital wallet that supports both centralized identity and digital asset management. DID wallet supports ArcBlock Asset Chai

What is mnemonic code?

Mnemonic is another form of plaintext private key, which was first proposed by BIP39, and its purpose is to help users remember complex private keys.

What is revoke waiting period?

Revoke Waiting period

What is slasher?

Slasher

What is stake?

In the Arcblock blockchain system, staking is a way to gain benefits privileges and prevent malicious behavior. Simply put, staking is like temporaril

Which chains and tokens are supported?

DID Wallet supports ArcBlock Chain, Ethereum Mainnet, EVM Compatible Chain (like BNB Smart Chain), and more different chains in the future.

Why wallet has multiple addresses?

When a new DID Wallet is initialized, there are three addresses by default. Respectively is:

AIGNE DocSmith

建在 AIGNE Framework 上的文件生成工具，直接從原始碼產出結構化的多語言文件。

設定參考

config.yaml 檔案是您文件產生的核心控制面板。透過調整其設定，您可以控制 AI 如何產生文件，包括文件結構、內容風格和語言支援。本指南為每個設定欄位提供了詳細的解釋，以幫助您根據專案需求進行微調。

初始設定

本指南將逐步引導您完成 AIGNE DocSmith 的互動式設定過程。此程序會在您首次執行 aigne doc create 時自動執行，但您也可以手動啟動。設定的目標是建立一個 config.yaml 檔案，用以儲存您產生文件的偏好設定。

管理偏好設定

您是否曾希望您的 AI 助理能記住您的指示？本指南將說明如何檢視、移除和切換您儲存的文件建立偏好設定，讓您能精細控制 AI 的輸出，並確保其始終遵循您專案的特定風格。

疑難排解

本指南協助您診斷和修復使用 AIGNE DocSmith 時遇到的常見問題。如果您在產生、發布或設定過程中遇到問題，請查看以下情境的解決方案。

入門指南

本指南提供安裝 AIGNE DocSmith 並產生第一組文件的直接、逐步程序。此過程設計為在幾分鐘內完成，讓您能夠以最少的設定從專案檔案中產生文件。

指南

本節提供結構化、逐步的說明，指導您如何使用 AIGNE DocSmith 執行常見的文件任務。每個指南都旨在引導您完成一個特定的工作流程，從初始生成到最終發布。

新增文件

是否曾發現您的文件有所欠缺？aigne doc add-document 指令提供了一種直接、互動的方式，可將新主題引入您現有的文件結構中，確保您的內容與專案一同成長。

清理

需要重設專案或移除敏感資料嗎？本指南將說明如何使用 aigne doc clear 指令來安全地移除產生的檔案、組態設定和快取資訊，幫助您維持一個乾淨且有條理的工作區。

評估文件

想知道您的文件是否達標嗎？本指南將介紹 evaluate 指令，這是一個強大的工具，可以系統性地評估您文件的品質和完整性，並提供一份清晰、可行的報告來指導您進行改進。您將學習如何執行評估並解讀其結果。

建立文件

本指南將引導您使用單一指令，從專案的原始檔案建立一套完整的文件。此流程設計得簡單明瞭，從初始分析到最終內容建立，並包含一個互動式審查步驟，以確保輸出結構完全符合您的需求。

互動模式

是否對命令列選項感到不知所措？本指南將說明如何使用互動模式，這是一個對話式介面，能簡化文件處理過程的每一步。讀完本指南後，您將能夠使用簡單、自然的語言指令來建立、更新、本地化和發布您的文件。

管理歷史紀錄

曾經想知道您的文件在何時做了哪些變更嗎？AIGNE DocSmith 會為每一次更新保留詳細的日誌。本指南將向您展示如何存取和讀取此歷史紀錄，以便您能輕鬆追蹤文件的演進過程。

發布您的文件

文件建立後，最後一步是將其發布到網路上。本文件提供了如何使用 aigne doc publish 命令發布文件的逐步指南，讓您的讀者可以存取這些文件。

移除文件

要確保您的文件準確無誤，不僅需要新增內容，還需要進行整理。本指南詳細介紹如何使用 aigne doc remove-document 命令安全地從專案中刪除文件，以確保您的文件集保持整潔和相關性。

本地化文件

將您的文件提供多種語言版本對於觸及全球受眾至關重要。本指南提供逐步流程，說明如何使用 aigne doc localize 指令將您的內容本地化為 12 種支援的語言之一，確保全球各地的使用者都能輕鬆存取和理解您的文件。

更新內容

本指南說明如何使用 update 指令來修改現有文件。您可以更新文件內容、新增或更新圖表，以及透過回饋移除圖表。

更新文件

隨著專案的發展，您的文件也需要跟上腳步。本節提供了一個中心樞紐，用於處理所有與修改文件集相關的任務，確保其保持準確和相關。在這裡，您將找到關於更改現有內容、整合新文件和移除過時檔案的指引。

總覽

AIGNE DocSmith 是一套文件工具，它利用 AI 分析您的專案原始碼並自動產生文件。它基於 AIGNE Framework 建構，可產生與您的程式碼庫同步的結構化、多語言文件。此過程解決了手動編寫文件所面臨的挑戰，例如耗時、容易過時以及內容不一致。

版本發行說明

隨時了解 AIGNE DocSmith 的最新開發進展。此頁面按時間順序記錄了該工具每個版本的新功能、效能改進和錯誤修復。

DIF Hackathon 指南（2024）

2024 年 DIF Hackathon 的要點說明。

FAQ

Q1: What to do if I failed to connect to test store

Building on DID Connect

Introduction

Building with DID Wallet

The DID Wallet Dapp template provides a powerful foundation for building decentralized identity applications. Following this guide, you can create a f

Building on AIGNE

Introduction

Building on DID Spaces

Introduction

DIF Hackathon Guide (2024)

Welcome to the ArcBlock DIF Hackathon! As proud Decentralized Identity Foundation (DIF) members, we are thrilled to invite developers of all skill le

身分與資料空間

ARC 的呼叫者上下文、按 DID 劃分的儲存、工作階段資料檢視，以及它們經過驗證的邊界。

Caller context

ARC resolves caller identity and optional instance membership on trusted server context, not from a UI message or a path supplied by the client.

Core model

Separate verified caller context, DID-scoped storage, and the documentation term Data Space before choosing an integration path.

Current contract boundaries

Know the limits of the present identity and data-space documentation before you make a runtime, deployment, or administration promise.

What “Data Space” means here

Use Data Space as a way to discuss data context and visibility, not as the name of an already-public ARC SDK surface.

DID Connect in ARC

ARC embeds DID Connect service code to resolve trusted credentials into caller information and optional instance membership context.

DID-scoped storage

Mount a DID Space as an AFS provider when data needs a DID-scoped logical storage boundary, and treat transport capabilities as unequal.

Evidence and version boundaries

Re-verify identity and data-space claims against a named ARC release using source, tests, and isolated CLI runs.

Integrate identity

Treat verified caller context as the handoff into session views and provider policy, then add DID Connect only where the runtime already resolves credentials.

Inspect local spaces

Run arc space list, sync, tree, path, and rm against an isolated root on ARC 2.0.0-beta.42 and read the real outputs.

Identity and Data Spaces

Understand ARC caller context, DID-scoped storage, session data views, and the boundaries that keep them separate.

Reference and boundaries

Check which identity and data-space statements are current contracts, which are architecture terms, and which still require release-specific evidence.

Session data

Read the caller-specific, temporary, and optional space views that ARC composes for one session.

User, temporary, and space views

A session receives a constrained AFS view: its own user data, session-local temporary data, and an optional caller space view.

Blocklet Launcher

ArcBlock 的託管服務，用來更快地把 Blocklet 跑起來。

Data retention policy

After the invoice is overdue, the data will not be immediately deleted. After the due date, it is divided into two stages, Past-due and Canceled, wher

Launch an application on my own Blocklet Server

Blocklet Launcher supports launching applications on existing Blocklet Servers, whether they are launched on your own server or in dedicated spaces pu

Launch the application in a dedicated space.

Dedicated Space is an independent server instance that adopts a pre-paid charging method.

Unable to install certain Blocklets in an On-demand space

Reason

Launch on-demand application

The billing method of On-demand space is based on the number of components and usage duration. This more refined billing model allows users to subscri

FAQs

What is the difference between on-demand space and dedicated space?

Getting Started

Overview

Reference Guides

Understanding pricing and data retention policies.

Welcome

What is blocklet launcher?

Pricing policy

The latest version of Launcher has upgraded the payment method, with the aim of making it easier for users to purchase and maintain space. The new pay

Transfer subscription of application

Applicable scenarios

Media Assets

Official ArcBlock and DID logos, lockups, and color values. Download SVG and PNG from this board.

ArcBlock logos

Official cube, wordmark, horizontal and vertical lockups, and the ABT token mark. Each lockup on a light plate and a dark plate, with SVG and PNG downloads.

DID logos

Official DID, DID Names, DID Spaces, DID Connect, and DID Wallet marks. Each lockup on a light plate and a dark plate, with SVG and PNG downloads.

Media Assets

Official ArcBlock and DID logos, lockups, and color values. Download SVG and PNG from this board.

Usage

Which official file to use on light or dark backgrounds, and the color stops taken from the official SVG.

Media Kit

上傳和託管媒體資源的 Blocklet：拖曳上傳、圖片標籤、CDN 接入。

API 參考

歡迎來到 Blocklet Uploader 套件的 API 參考文件。本節為前端和後端函式庫中所有匯出的元件、函式、props 和設定選項提供了全面的詳細說明。這是您獲取深入技術資訊的首選資源。

元件 Props

前端：@blocklet/uploader

@blocklet/uploader 套件提供了一個功能強大且高度可自訂的 React 元件，用於處理 Blocklet 生態系統中的檔案上傳。它建構於 Uppy 之上，這是一個時尚、模組化的開源檔案上傳工具，確保了強大且使用者友善的體驗。

可用外掛程式

@blocklet/uploader 透過數個強大的自訂外掛程式擴充了核心 Uppy 函式庫。這些外掛程式與 Blocklet 生態系統（特別是 Media Kit）無縫整合，提供 AI 圖片生成、瀏覽先前上傳的檔案以及存取共享資源等功能。當您使用

與 Hooks

對於更進階的使用案例，您可能需要從應用程式的不同部分觸發 Uploader，或以程式化方式控制其行為。UploaderProvider 元件及其相關的 hooks 提供了一種靈活的方式，使用 React 的 Context API 將 Uploader 的 UI 與其觸發器分離。

initCompanion(options)

initCompanion 函數初始化並設定 Uppy Companion 中介軟體，這對於讓使用者能夠從遠端來源（如 Unsplash、Google Drive、Instagram 或直接的 URL）匯入檔案至關重要。此函數是官方 @uppy/companion 函式庫的封裝，專為在 blockl

initDynamicResourceMiddleware(options)

initDynamicResourceMiddleware 是一個功能強大的 Express 中介軟體，專為動態提供來自一或多個指定目錄的檔案而設計。與 initStaticResourceMiddleware 不同，它會即時主動監控檔案系統的變更（新增、刪除、修改），因此非常適合提供在執行期間可能

後端：@blocklet/uploader-server

@blocklet/uploader-server 套件提供了一套 Express.js 中介軟體，旨在處理您 blocklet 後端的各種檔案處理任務。它作為 @blocklet/uploader 前端元件的伺服器端對應部分，可實現直接檔案上傳、與遠端來源整合以及資源服務等功能。

initLocalStorageServer(options)

initLocalStorageServer 函式是處理從使用者裝置直接上傳檔案到您的 blocklet 本地儲存的核心中介軟體。它利用了強大的 Tus 可續傳上傳協定，確保上傳的可靠性，並能在網路中斷後恢復。

initStaticResourceMiddleware(options)

initStaticResourceMiddleware 是一個功能強大的 Express 中介軟體，專為從其他已安裝的 blocklet 提供靜態資產而設計。這讓您的應用程式能夠從相依的元件存取如圖片、樣式表或字體等共享資源，而無需知道它們在檔案系統中的確切位置。

公用程式函式

@blocklet/uploader/utils 模組匯出一系列輔助函式，旨在簡化與檔案處理、URL 操作、Uppy 實例自訂和網路配置相關的常見任務。這些公用程式由 Uploader 元件內部使用，但也可用於您的應用程式中，以實現更進階的整合。

概念

@blocklet/uploader 套件的設計旨在兼具強大功能與易於整合的特性。為了充分利用它們，了解驅動其功能的核心概念和關鍵整合會很有幫助。本節將探討 uploader 背後的基礎技術和設計原則。

國際化 (i18n)

@blocklet/uploader 元件的設計考慮到了全球使用者，為多語言和文字自訂提供了強大的支援。這讓您能夠創造出無縫的使用者體驗，讓使用者無論身在何處都能感到親切自然。

與 Media Kit 整合

@blocklet/uploader 套件專為與 Media Kit Blocklet 的無縫、零組態整合而設計。Media Kit 提供集中的媒體儲存、管理與處理服務。當 Uploader 元件偵測到 Media Kit 安裝在相同環境中時，它會自動增強其功能，無需開發人員進行任何額外設定。這種自

與 Uppy 整合

@blocklet/uploader 套件直接建構在 Uppy 之上，Uppy 是一個時尚、模組化且開源的網頁檔案上傳工具。我們沒有從頭開始建構檔案上傳工具，而是利用 Uppy 強大的核心引擎、豐富的外掛生態系統以及精美的用戶介面。這使我們能夠提供一個穩定且功能豐富的上傳體驗，同時專注於在 Bloc

後端設定 (@blocklet/uploader-server)

本指南將引導您在基於 Express.js 的 blocklet 中設定 @blocklet/uploader-server 套件。此套件提供了必要的伺服器端中介軟體，以處理由 @blocklet/uploader 前端元件發起的檔案上傳。

入門指南

本指南將引導您完成將強大的檔案上傳器整合到您的 Blocklet 中的基本步驟。我們將涵蓋前端 UI 元件和可選的後端伺服器設定，幫助您快速上手。

前端設定 (@blocklet/uploader)

本指南將引導您完成在 Blocklet 中安裝與整合 @blocklet/uploader React 元件的過程。此元件提供一個功能豐富的檔案上傳使用者介面，它建立在功能強大且可擴展的 Uppy 檔案上傳器之上。

設定外掛

@blocklet/uploader 元件建立在靈活且強大的 Uppy 檔案上傳器之上。這種架構允許透過基於外掛的系統進行廣泛的自訂。Uploader 預設配置了幾個必要的外掛，以及為與 Blocklet 生態系統整合而設計的特殊外掛。

建立自訂外掛

@blocklet/uploader 的設計具有可擴充性。雖然它內建了幾個強大的外掛，但您可以輕鬆地新增自己的自訂分頁，以整合獨特的工作流程、連接到專有服務或提供專門的使用者介面。本指南將向您展示如何使用提供的 VirtualPlugin 元件建立一個新的外掛分頁。

指南

歡迎來到指南部分。在這裡，您將找到實用的、以任務為導向的演練，幫助您為上傳器實作常見功能和自訂設定。這些指南建立在入門部分介紹的概念之上，為真實世界的情境提供逐步說明。

處理上傳

檔案成功上傳後，您通常需要在用戶端和伺服器端執行操作。本指南說明如何在 @blocklet/uploader 前端元件和 @blocklet/uploader-server 中介軟體中使用 onUploadFinish 回呼來處理檔案及其元資料。

整合遠端來源 (Companion)

若要允許使用者從外部來源（例如直接的 URL 或 Unsplash 等服務）匯入檔案，您需要在後端設定 Uppy 的 Companion 服務。@blocklet/uploader-server 套件提供了一個方便的 initCompanion 函式，簡化了這個過程。

總覽

Blocklet Uploader 是一個專為 blocklets 設計的綜合檔案上傳解決方案，它建立在強大且可擴展的 Uppy 檔案上傳器之上。它由兩個主要套件組成，共同提供從瀏覽器中的使用者介面到伺服器上的檔案處理的無縫體驗。

NFT Studio

讓數位創作者掌握創作全過程的工具。

Concept Guide

What's NFT?

By using the NFT Blender + AI tool, 6000 NFTs with a theme of the Year of the Dragon for the Spring Festival can be quickly created.

Put some result pictures first

Ecological projects

Summarize

FAQs

Overview

How to Bind a Domain to a Blocklet (Google Domain)

Why do I need to bind a domain name to Blocklet?

How to Build a Complete NFT Program

Overview

How to Mount NFT Series Blocklets Locally

Overview

How to publish NFT Templates to the Blocklet Store

Summary

How to Upload NFTs to DID Spaces Using the SDK

Overview

How to use AIGC to generate NFT image resources

Overview of AIGC

How to use NFT Blender to manage materials

Overview

How to use NFT Maker to create Collection

You can learn more by going to

How to use the SDK to recycle or redistribute NFTs

Overview

Midjourney

Overview

Getting Started

Overview

How To Guides

Overview

Welcome

Overview

Official Projects

You can learn more by going to

Reference Guide

Overview

NFT Studio + Payment Kit

How to add Stripe payment method to receive currencies other than Virtual Currencies You need to go to Payment Kit to add new payment methods, restart

Sample Projects

Overview

Stable Diffusion（DrawThings）

Overview

Stable Diffusion（InvokeAI）

Overview

Payment Kit UI（React）

@blocklet/payment-react 是 Blocklet 支付相關介面的 React 元件庫。

元件

@blocklet/payment-react 函式庫提供了一套全面的預建 React 元件，旨在加速支付、訂閱和捐贈功能的開發。這些元件經過分類，以幫助您為工作找到合適的工具，無論您需要一個完整的即插即用解決方案，還是需要精細的 UI 元素來建立自訂體驗。

業務邏輯元件

業務邏輯元件是專為處理訂閱和發票管理相關的複雜、具狀態性操作而設計的特殊 React 元件。這些元件封裝了完整的用戶流程，例如支付逾期發票或恢復已取消的訂閱，讓您能以最少的設定輕鬆地將進階功能整合至您的應用程式中。

自動儲值元件

自動儲值功能透過在使用者點數餘額低於指定閾值時自動儲值，確保服務不中斷。此功能由兩個主要元件管理：AutoTopup，用於顯示目前的設定；以及 AutoTopupModal，提供設定介面。

OverdueInvoicePayment

OverdueInvoicePayment 元件是一個專門用於處理特定客戶或訂閱的逾期發票付款的工具。它透過自動擷取逾期發票並向使用者呈現一個清晰的介面來結清其未付帳款，從而簡化了流程。

ResumeSubscription

ResumeSubscription 元件為使用者提供了一個簡單明瞭的使用者介面，以便恢復已取消的訂閱。它會渲染一個對話方塊，引導使用者完成確認過程，並在訂閱需要時自動處理重新質押等複雜情境。

結帳元件

@blocklet/payment-react 函式庫提供了一組高階的結帳元件，旨在為各種支付場景提供完整、即用的入口點。這些元件封裝了從選擇產品到完成支付的整個使用者流程，讓您能以最少的設定整合複雜的支付體驗。

CheckoutDonate

CheckoutDonate 元件提供了一個彈性且易於整合的解決方案，可為您的應用程式增加捐贈功能。它支援多種顯示模式，從開啟結帳對話方塊的簡單按鈕到由您完全控制的自訂 UI。

CheckoutForm

CheckoutForm 元件是處理付款連結和結帳會話的主要進入點。它作為一個高階封裝器，根據提供的 ID 擷取所有必要的資料，並呈現適當的付款或捐款介面。此元件是將完整的結帳流程整合到您應用程式中最簡單的方法。

CheckoutTable

CheckoutTable 元件為訂閱結帳提供了一個完整、開箱即用的解決方案。它會獲取並呈現價格表，允許使用者選擇方案，然後無縫地將他們轉換到付款表單以完成購買。這個高階元件是將基於方案的付款流程整合到您的應用程式中最快的方法。

歷史記錄元件

@blocklet/payment-react 函式庫提供了一套歷史記錄元件，旨在為您的使用者提供清晰詳細的過往活動檢視。這些元件對於建構客戶入口網站、帳戶儀表板和管理介面至關重要，在這些介面中，使用者需要追蹤他們的帳單、付款和點數使用情況。

CreditGrantsList

CreditGrantsList 元件會渲染一個分頁表格，用來顯示客戶的信用額度授予。它清晰地概覽了每筆授予的狀態、剩餘額度、適用範圍和有效期限。

CreditTransactionsList

CreditTransactionsList 元件會呈現一個詳細且分頁的所有點數交易表格，提供清晰的點數使用和調整記錄。它非常適合在客戶入口網站或管理儀表板中使用，以追蹤點數如何授予和消耗。

CustomerInvoiceList

CustomerInvoiceList 元件旨在呈現客戶的發票歷史記錄。它會從支付服務中擷取並顯示發票資料，提供兩種不同的版面配置：一種是簡單的、按日期分組的無限滾動列表，另一種是詳細的、分頁的表格。此元件必須在 PaymentProvider 中使用才能正常運作。

CustomerPaymentList

CustomerPaymentList 元件可呈現客戶付款的詳細歷史記錄。它會自動處理擷取、透過無限滾動實現分頁以及按日期將付款分組，從而提供清晰、有條理的使用者交易歷史記錄檢視。

UI 元件

@blocklet/payment-react 函式庫提供了一組細粒度的 UI 元件，旨在為您在建構支付和結帳介面時提供最大的靈活性。與封裝整個流程的高階結帳元件不同，這些元件是建立自訂使用者體驗的基礎。

表單元素

@blocklet/payment-react 程式庫提供了一系列精細的輸入元件，旨在簡化自訂支付和聯絡資訊表單的建立。這些元素在建構時考慮了驗證和使用者體驗，並與 react-hook-form 順利整合，為資料收集提供了強大而靈活的解決方案。

AddressForm

AddressForm 元件提供了一個預先建置的使用者介面，用於收集帳單地址資訊。它與 react-hook-form 無縫整合，並包含針對郵遞區號等欄位的內建、特定國家/地區的驗證。

CountrySelect

CountrySelect 元件提供了一個方便使用者選擇國家的下拉式選單。它具有可搜尋的列表、顯示國旗，並提供響應式設計，能適應桌面和行動裝置的視窗。它設計用於在 react-hook-form 管理的表單中使用。

CurrencySelector

CurrencySelector 組件提供了一個使用者友善的介面，讓使用者能從可用選項清單中選擇支付貨幣。它會顯示每種貨幣的標誌、符號及相關的支付方式，方便使用者進行選擇。此組件通常用於較大的支付或結帳表單中。

PhoneInput

PhoneInput 元件提供了一個使用者友善的國際電話號碼輸入欄位。它與 react-hook-form 無縫整合，並包含一個帶有國旗和國碼的可搜尋國家選擇器、自動號碼格式化，以及由 google-libphonenumber 支援的強大驗證功能。

PaymentSummary

PaymentSummary 元件是任何結帳流程中至關重要的 UI 元素。它提供了訂單的詳細明細，包括所有訂單項目、試用期資訊、質押要求以及最終總金額。它的設計具有響應性，並能適應行動裝置的佈局。

PricingTable

PricingTable 元件是一個彈性的 UI 元件，旨在以結構化、響應式的表格來顯示訂閱方案與價格選項。它允許使用者切換計費週期（例如，月繳、年繳）、選擇偏好的貨幣，並選擇一個方案以繼續進行。

入門指南

本指南將引導您完成安裝 @blocklet/payment-react 並將一個基本的、功能齊全的支付表單整合到您的應用程式中的必要步驟。只需幾分鐘，您就能擁有一個可運作的結帳體驗。

指南

歡迎來到指南部分。在這裡，您將找到關於進階主題的深入文章，這些主題超越了單一組件的用法。這些指南旨在幫助您自訂程式庫的外觀，並利用其強大的實用程式函數來建構更複雜的支付解決方案。

主題化

了解如何使用內建的主題提供者和 Material-UI 主題選項來自訂支付元件的外觀。@blocklet/payment-react 函式庫建立在 Material-UI 之上，讓您對支付流程的外觀和風格有廣泛的控制權。

工具程式

@blocklet/payment-react 函式庫匯出一系列工具函式與類別，旨在簡化常見任務，如發送 API 請求、管理快取、處理日期、格式化價格以及設定國際化。這些工具的設計能與函式庫的元件和提供者無縫協作。

Hooks

@blocklet/payment-react 函式庫提供了一組自訂的 React hooks，用以封裝和簡化常見的邏輯，例如處理即時事件或適應不同的螢幕尺寸。這些 hooks 讓您可以輕鬆地將進階功能整合到您的元件中，只需最少的樣板程式碼。

useMobile

useMobile hook 是一個方便的實用工具，用於偵測應用程式是否在行動裝置尺寸的裝置上檢視。它利用 Material-UI 的中斷點系統，幫助您直接在 React 邏輯中建立響應式佈局和元件。

useSubscription

useSubscription hook 提供了一種使用 WebSockets 從支付服務訂閱即時事件的簡單方法。它處理連線、訂閱和清理邏輯，讓您可以專注於應用程式如何對 invoice.paid 之類的事件做出反應。

總覽

@blocklet/payment-react 是一個全方位的 React 元件庫，旨在簡化將支付流程、訂閱和捐贈系統整合到您的 blocklet 中的過程。它建立在 Payment Kit 的基礎之上，提供了一套預先建置、可自訂且生產就緒的元件，幫助您以最少的精力打造強大的支付體驗。

提供者

Context Provider 是 @blocklet/payment-react 的一個核心概念。它們作為您應用程式部分的包裝器，使用 React 的 Context API 將必要的資料和函式傳遞給所有嵌套在其中的元件。這避免了需要手動將 props 透過多層元件樹向下傳遞。

DonateProvider

DonateProvider 是一個關鍵的 context provider，負責管理應用程式中所有捐款相關元件的狀態和設定。它會處理從後端擷取設定、為了效能而快取設定，並將設定提供給像 CheckoutDonate 這樣的元件。

PaymentProvider

PaymentProvider 是 @blocklet/payment-react 函式庫的基石。它作為一個上下文提供者，必須包裝您的應用程式或相關的支付元件。它負責取得必要的設定、管理應用程式狀態，並為其所有子元件提供輔助函式和 API 客戶端。

Payment Kit SDK（Node.js）

@blocklet/payment-js 用於呼叫 Payment Kit 的 API。

API 參考

此 API 參考為 PaymentKit Node.js SDK 中可用的每個資源和方法提供了詳細的文件。每個資源都有一個專門的頁面，其中包含有關其方法、參數、回傳值和使用範例的全面資訊。

結帳會話

結帳會話代表顧客付款時的會話。它是收集付款詳細資訊以建立一次性付款或訂閱的主要機制。建立會話後，您會將顧客重新導向到一個安全的、託管的付款頁面。付款完成後，顧客會被重新導向回您的應用程式。

優惠券

優惠券是為您的產品和服務提供折扣的強大工具。優惠券物件包含特定折扣的資訊，例如百分比折扣或固定金額折扣。要使優惠券可兌換，您必須將其與一個或多個促銷代碼關聯。此 API 可讓您建立、管理和追蹤優惠券的使用情況。

信用額度授權

「信用額度授權」物件用於向您的客戶發放信用額度，這些信用額度可以應用於未來的發票，特別是在基於用量或基於信用額度的計費模型中。每次授權都會追蹤總金額、剩餘餘額、狀態以及任何特定的適用性規則。

點數交易

點數交易物件記錄了客戶點數餘額的每一次變動。這包括授予、消耗、調整和到期。您可以使用此 API 來檢索客戶點數活動的詳細歷史記錄。

客戶

客戶物件可讓您建立和管理您的業務所服務的客戶。它們儲存了聯絡方式、地址和帳單歷史等基本資訊，這些資訊是建立訂閱和處理付款的基礎。

發票

發票 API 可讓您建立、管理和完成發票。它提供了處理各種計費情境的全面功能，包括一次性付款、定期訂閱和基於信用的計費。您可以擷取詳細的發票資訊、應用折扣、管理質押操作以及搜尋歷史記錄。

Meter 事件

Meter 事件是您回報給特定 Meter 的使用記錄。每個事件代表客戶執行的可量化操作，可用於在使用量計費或點數計費模型中從其餘額中扣除點數。在回報事件之前，您必須先建立一個 Meter。

計量表

計量表用於定義和追蹤基於點數計費的使用量。它們代表您計費的特定功能或資源，例如 API 呼叫、資料儲存或計算時間。每個計量表都會匯總發送給它的使用事件。

支付貨幣

支付貨幣 API 可讓您管理接受支付的貨幣。這包括標準的區塊鏈代幣（如 ERC-20 或 ArcBlock 原生代幣）以及用於實現基於點數計費系統的自訂點數貨幣。

付款意圖

付款意圖 (Payment Intent) 是一個物件，代表您向客戶收款的意圖，並追蹤付款流程的生命週期。它是 PaymentKit API 中的核心物件，控制著從客戶到您的資金流動。付款意圖可以與結帳階段關聯，用於面向使用者的付款流程，或直接用於伺服器端操作。

付款連結

付款連結是一個可分享、可重複使用的頁面，用於銷售產品或服務。您可以為一組特定的產品和價格建立一個連結，並透過各種管道與多個客戶分享。這樣無需建立完整的結帳流程，即可快速輕鬆地收款。

付款方式

Payment Method 物件代表客戶可以支付的不同方式，例如使用 Stripe（信用卡、銀行帳戶）或透過各種加密貨幣網路。此 API 可讓您設定、管理和列出可供客戶使用的付款方式。

價格

價格物件定義了特定產品的收費金額和頻率。它將價格金額和貨幣與產品關聯起來。例如，一個產品可能有多個價格，每個價格使用不同的貨幣或有不同的計費週期。

產品

產品物件代表您提供給客戶的商品、服務或數位點數。您可以將它們視為您目錄中的項目。每個產品可以有一個或多個相關聯的價格。

促銷代碼

促銷代碼是客戶在結帳時可以輸入以獲得折扣的特定、面向用戶的代碼。每個促銷代碼都連結到一個父級優惠券，該優惠券定義了實際的折扣（例如，八折、折價 10 美元）。這種兩層結構允許您創建多個指向同一個基礎折扣的唯一代碼，從而輕鬆追蹤不同的行銷活動或分發管道。

退款

退款物件代表將先前費用的款項退還給顧客。您可以建立新的退款、擷取現有退款的詳細資訊，以及列出所有退款以供會計之用。建立退款時，其初始狀態為 pending，並將以非同步方式處理。

設定

設定 API 可讓您管理 PaymentKit 中的各種組態，例如建立捐贈小工具或設定通知處理程式。每個設定都是一個可設定的資源，由其 type 和 mountLocation 識別。

訂閱項目

訂閱項目代表客戶訂閱的特定產品和價格。它們是訂閱的組成部分，對於管理週期性計費至關重要，尤其是對於計量用量的方案。

Webhook 端點

Webhook 端點允許 PaymentKit 向您的伺服器發送非同步事件通知。這對於處理成功付款、訂閱更新或扣款失敗等事件至關重要。透過建立和管理 Webhook 端點，您可以確保您的應用程式與您的付款和客戶狀態保持同步。

核心概念

PaymentKit Node.js SDK 旨在處理各種計費情境。本節提供實作最常見支付工作流程的實用指南。無論您是設定簡單的一次性收費、管理定期訂閱，還是建立複雜的基於點數的系統，這些指南都將引導您了解關鍵概念和實作步驟。

基於點數的計費

基於點數的計費是一種彈性的、按用量付費的模型，非常適合使用量會變動的服務，例如 API 呼叫、資料儲存或計算時間。客戶不是支付固定的週期性費用，而是消耗他們已購買或被授予的點數。

點數儲值

PaymentKit 的點數計費系統允許客戶透過儲值來補充其點數餘額。您可以將點數貨幣設定為可儲值，從而啟用手動單次儲值和餘額低於設定閾值時的自動儲值。

折扣

PaymentKit 提供了一套使用優惠券 (Coupons) 和促銷代碼 (Promotion Codes) 的彈性折扣系統。這讓您可以為顧客提供各種類型的折扣，例如百分比折扣、固定金額折扣和限時優惠。

單次付款

PaymentKit 提供多種彈性方式來處理商品或服務的單次收費。本指南將引導您了解 Node.js SDK 中可用的三種主要方法，幫助您選擇最適合您特定需求的方法。

Webhooks

Webhook 是與 PaymentKit 建立可靠且可擴展整合的重要機制。您無需持續輪詢 API 以獲取狀態變更，而是可以設定一個 Webhook 端點，當您的帳戶中發生特定事件時，PaymentKit 將會向您指定的 URL 發送即時的 HTTP POST 通知。

環境

PaymentKit SDK 有兩種不同的運作模式：正式模式 (Live Mode) 用於處理真實交易，測試模式 (Test Mode) 用於開發和測試。每個 API 請求都在這兩種環境之一中執行。預設情況下，SDK 會在正式模式下初始化。在開發過程中，使用測試模式至關重要，這樣可以在不影響正式資料

入門指南

本指南將引導您完成在專案中啟動並執行 PaymentKit Node.js SDK 的基本步驟。只需幾分鐘，您就可以安裝 SDK，為測試環境進行設定，並進行您的第一次 API 呼叫。

概覽

PaymentKit Node.js SDK 為 PaymentKit REST API 提供了一個便利的封裝，讓您能夠直接在您的 Node.js 應用程式中建構功能強大且靈活的支付體驗。無論您是處理一次性購買、管理週期性訂閱，還是實施複雜的基於點數的計費模型，這個 SDK 都能以其簡潔、現代化且完

SDK 架構

The PaymentKit Node.js SDK 建立在模組化、以資源為導向的架構之上。這種設計確保了與 PaymentKit API 不同部分的互動是一致、可預測且穩健的。其核心是，SDK 使用一個中央實用程式為每個 API 資源（如客戶、產品等）生成方法，該實用程式處理與底層 Payment

Web Device

用 ARC Web Device 建構靜態站點的開發者文件。

AUP layout boundary

Use AUP as source-first page layout input, while keeping direct static-tree rendering separate from layout component composition.

Author a site

Web Device documentation draft: configure, compose, and extend an existing site.

Component resolution

Find the component that the target runtime actually resolves; do not treat a historical component name as a stable universal catalog.

Layout components

Navigation hub for default-theme and site layout components — one page per unit; not a multi-component reference body.

Use and override components

Put reusable Web presentation in components, then override deliberately at the theme or site layer.

`access-gate`

Web Device layout component `access-gate`: purpose, boundaries, author entry, evidence, and sample honesty.

`content-card`

Web Device layout component `content-card`: purpose, boundaries, author entry, evidence, and sample honesty.

`detail-content`

Web Device layout component `detail-content`: purpose, boundaries, author entry, evidence, and sample honesty.

`detail-sidebar`

Web Device layout component `detail-sidebar`: purpose, boundaries, author entry, evidence, and sample honesty.

`event-card`

Web Device layout component `event-card`: purpose, boundaries, author entry, evidence, and sample honesty.

`event-hero`

Web Device layout component `event-hero`: purpose, boundaries, author entry, evidence, and sample honesty.

`hero-banner`

Web Device layout component `hero-banner`: purpose, boundaries, author entry, evidence, and sample honesty.

`news-ticker`

Web Device layout component `news-ticker`: purpose, boundaries, author entry, evidence, and sample honesty.

`page-sections`

Web Device layout component `page-sections`: purpose, boundaries, author entry, evidence, and sample honesty.

`page-stack`

Web Device layout component `page-stack`: purpose, boundaries, author entry, evidence, and sample honesty.

`platform-stack`

Web Device layout component `platform-stack`: purpose, boundaries, author entry, evidence, and sample honesty.

`portal-footer`

Web Device layout component `portal-footer`: purpose, boundaries, author entry, evidence, and sample honesty.

`portal-header`

Web Device layout component `portal-header`: purpose, boundaries, author entry, evidence, and sample honesty.

`post-hero`

Web Device layout component `post-hero`: purpose, boundaries, author entry, evidence, and sample honesty.

`product-frame`

Web Device layout component `product-frame`: purpose, boundaries, author entry, evidence, and sample honesty.

`product-frame-gallery`

Web Device layout component `product-frame-gallery`: purpose, boundaries, author entry, evidence, and sample honesty.

`product-hero`

Web Device layout component `product-hero`: purpose, boundaries, author entry, evidence, and sample honesty.

`product-showcase`

Web Device layout component `product-showcase`: purpose, boundaries, author entry, evidence, and sample honesty.

`related-content`

Web Device layout component `related-content`: purpose, boundaries, author entry, evidence, and sample honesty.

`site-home`

Web Device layout component `site-home`: purpose, boundaries, author entry, evidence, and sample honesty.

site `container-members`

Site layout component `container-members` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `content-card`

Site layout component `content-card` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `editorial-feed`

Site layout component `editorial-feed` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `event-detail`

Site layout component `event-detail` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `globe`

Layout component `globe`: COBE WebGL globe as figure, scene, or backdrop. Copy the AUP, set variant and optional markers. Not the AUP globe primitive.

site `glossary-index`

Site layout component `glossary-index` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `landing-hero`

Site layout component `landing-hero` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `landing-shell`

Site layout component `landing-shell` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `leaf-shadow`

Layout component `leaf-shadow`: looping gobo overlay (video or procedural canvas) with mix-blend-multiply. Set src to a 100–400 KB clip; use gobo-loop to mint new clips from a scene sentence.

site `object-card`

Site layout component `object-card` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `page-breadcrumb`

Site layout component `page-breadcrumb` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `period-index`

Site layout component `period-index` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `product-meta`

Site layout component `product-meta` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `related-objects`

Site layout component `related-objects` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `site-footer`

Site layout component `site-footer` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `term-meta`

Site layout component `term-meta` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

site `topic-meta`

Site layout component `topic-meta` under `.web/components`: purpose, boundaries, evidence, and sample honesty.

`tag-list`

Web Device layout component `tag-list`: purpose, boundaries, author entry, evidence, and sample honesty.

`tech-hero`

Web Device layout component `tech-hero`: purpose, boundaries, author entry, evidence, and sample honesty.

`technology-card`

Web Device layout component `technology-card`: purpose, boundaries, author entry, evidence, and sample honesty.

Restrict who can read a page

Declare a collection default, tighten individual records with access, and check the serve-time gate before you publish.

Content access reference

Fields, resolution order, admit rules, HTTP headers, and discovery boundaries for the Web Device serve-time access gate.

Content objects, metadata, and locales

Keep each item as a directory-shaped object and manage body and metadata with an explicit read order.

Web Device Content Markdown

Separate Markdown in content items from an AUP text primitive and .web components, then start from verified source-plus-rendered examples.

Content site

Add a content collection by preserving directory-shaped objects and declaring an explicit list/detail presentation contract.

Custom component

Add one complete site component, verify its resolver contract, then compose it from a page rather than copying presentation trees.

Customize a theme and tokens

Customize one site-owned token layer first; treat local component overlays as a separate, explicitly verified mechanism.

Diagnose a site

Start with the narrowest failing boundary, then distinguish source errors, build errors, and a stale or incorrect local preview.

Directory and file conventions reference

Locate each public Web Device concern by responsibility, not by a copied historical tree.

Build a first site

Create the smallest static site that Web Device can render directly on your machine.

Get started

Web Device documentation draft: move from scope to a first site that runs locally.

Hero lab · webgl-hero backgrounds

Working catalog of landing-hero heroVisual candidates built on the webgl-hero widget, with exact config and honest verdicts.

In-page review mode

Open a rendered Web Device page with ?review=1, leave text-anchored feedback next to the content item, and keep two-level status for page approval and item processing.

Install ARC CLI

Install the current ARC release and confirm that your shell can run arc.

Markdown directives & structures

Navigation hub for content-reader MD directives and structures — one page per unit; not a multi-unit reference body.

Use cards in Markdown

Organize documentation entry points with link-card, info-card, and card-group, then inspect their read-only rendered result in place.

Embed external and internal content in Markdown

Write a supported external or same-site Markdown embed, then inspect the actual frame rendered on this page — source and live result together.

Write tables and callouts in Markdown

Place GFM tables and GitHub-style callouts in a Web Device content item, then inspect their actual rendered output on the same page.

Write and embed Markdown slides

Turn one Markdown content record into a readable deck, mount its player with a named layout, and embed it as a same-site 16:9 player — source and live player on this page.

Write step-by-step guides in Markdown

Use the steps and step directives to organize a read-only tutorial, then inspect the actual numbered result and nesting rule.

`:::action-card`

Place navigation choices in an action-card without promising exec or data writes.

`::::card-group`

Group navigation cards in a document grid and verify fence depth plus real render.

`::embed`

Embed a supported URL as a sandboxed frame or media block and document refusal fallbacks.

fenced code

Web Device Markdown structure `fenced-code`: purpose, boundaries, author entry, evidence, and sample honesty.

Generic MD directive (incl. `::input`)

Web Device Markdown directive `generic-directive`: purpose, boundaries, author entry, evidence, and sample honesty.

GFM admonition

Place GitHub-style callouts in content Markdown and inspect their real document render on the same page.

GFM table

Place pipe tables in content Markdown and inspect their real document render on the same page.

heading

Web Device Markdown structure `heading`: purpose, boundaries, author entry, evidence, and sample honesty.

image (inline)

Web Device Markdown structure `image`: purpose, boundaries, author entry, evidence, and sample honesty.

`:::info-card`

Place a non-interactive info card and inspect its read-only body on the same page.

`::link-card`

Organize a navigation entry with link-card and inspect its read-only rendered result in place.

list

Web Device Markdown structure `list`: purpose, boundaries, author entry, evidence, and sample honesty.

paragraph

Web Device Markdown structure `paragraph`: purpose, boundaries, author entry, evidence, and sample honesty.

raw HTML

Web Device Markdown structure `raw-html`: purpose, boundaries, author entry, evidence, and sample honesty.

`slides: true` front matter

Mark a content record as slides, split on HR boundaries, and link the live slides demo honestly.

`:::step`

Nest a single step body under steps; full live sample lives with the steps container.

`::::steps`

Author a static numbered tutorial with steps/step fences and inspect the real document render.

thematicBreak / HR

Use horizontal rules as separators; under slides: true they become slide boundaries.

Folder-backed media gallery (`::gallery`)

Put a media folder next to a content item and present it with layout, density, and optional lightbox — samples for every mode live on this page.

Immersive video gallery (Expose-style)

Pair a cover still with a short video in a folder-backed ::gallery so stage/expose/story plates can fall back to the cover, then play a muted seamless loop.

Immersive plates

Minimal information site

Use the verified first-site path to establish a small information site before adding a content collection or theme overlay.

Web Device

Build a static site with Web Device from AFS-native pages, content, and site configuration.

Page variants

Declare several finished renders of one page URL, compare them on the existing ?review=1 HUD, and keep visitor assignment separate from the authoring choice.

Build a page with AUP

Compose site components in a page layout and understand ARC's current layout lookup order.

Compose pages and layouts

Give each route a layout boundary, then keep reusable presentation in Web components and reader data in content objects.

Preview, build, and publish

Keep local acceptance, build artifacts, and formal publishing as three separate stages.

Publish and maintain

Web Device documentation draft: preview, build, publish, check, and diagnose a site.

Recipes

Task-oriented site and AUP composition paths that only link to canonical unit pages and verified guides — no re-documented component APIs.

Recipe: bind source to layout

Declare a content source, then bind it into a layout component — sequence of guide and unit pages only.

Recipe: collection list page

Build a list page over a content collection by linking source binding and layout component unit pages — no prop tables here.

Recipe: docs board

Wire a documentation board shell from surface and component unit pages — contracts stay on those pages.

Recipe: first site

Compose a minimal Web Device site by chaining verified getting-started steps with layout and AUP unit pages — no API re-documentation.

Recipe: slides in an article

Turn a Markdown article into slides by chaining MD structure units and the deck widget unit — no re-documented APIs.

Reference

Web Device documentation: directory, syntax, component, surface, Markdown, and version contracts.

Requirements and scope

Use ARC 2.0.0-beta.25 to verify a minimal Web Device site from one local blocklet.

Routes and locales reference

Map declared pages and content to route families, then add locale variants without duplicating a site tree.

Routes, navigation, and locales

Derive paths from declared pages and content, and treat locale as a view of one site rather than a copied site.

Run, check, and inspect

Check, build, and directly run a local blocklet, then verify its Web Device page in a browser.

Bookmark and note (save capability)

Declare page bookmark and selection notes on blocklet.yaml save:. Default on, hidden until login, floating chrome or page buttons.

SEO, links, and accessibility

Use generated SEO and link checks as a floor, then finish with human accessibility inspection.

Showcase mapping

Map showcase-dsl / showcase pages to AUP primitive and widget unit pages, and run the showcase blocklets locally — not a hosted full showcase.

Site-wide configuration

Use .web/site.yaml to declare locale, presentation, SEO, template, and theme selection.

Site configuration reference

Use `site.yaml` for site-level scalar configuration and retain separate files for tokens, redirects, and assets.

Understand a site directory

Use pages, content, and .web to separate page entry points, content objects, and site capability.

Slide lab · ceiling

Speaker-led ceiling sample: one decoration layer (AIGC plates + shells), disciplined type/color/paper, boards and marks — Path A without free HTML.

Slide lab · coolbackgrounds

Three coolbackgrounds-inspired surfaces on porcelain paper: topo-soft, facet-soft, horizon-band.

Slide lab · dune

guizang-inspired dune pack: sand paper, charcoal type, topo-soft default.

Slide lab · editorial

Experimental editorial deck with boards, tones, and ink theme. Path A: AUP dual-mode with real composition.

Slide lab · grid-dense

Experimental denser deck: short grid media, compact compare, tight statements. Still overflow-safe — dense is not cluttered.

Slide lab · kraft

guizang-inspired kraft paper theme: warm stock, serif display, paper-grain default.

Slide lab · shell-demo

Experimental shell-demo deck: one live shell per page (chart, map, calendar). Boundary prose stays off the visual pages.

Slide lab · surface

Speaker-led demo of deckSurface: curated CSS abstract backgrounds as the default decoration layer. Zero image assets.

Slide lab · visual-first

Experimental visual-first deck: single plate, mosaic, grid, sized stage. Tests media-fill discipline inside the 16 by 9 player.

Web Device Slides demo

A small, runnable Markdown deck used by the Web Device Slides guide.

Web Device Markdown Slides at a Glance

Why Markdown Slides keeps a presentation and readable page in the same content record.

Source-binding reference

Reference the four-field source contract without turning a page query into a global variable.

Bind content to a page

Declare a content source first, then hand it to a page layout by its $source name.

Surfaces

Navigation hub for Web Device surface packages — one page per surface; not a multi-surface reference body.

`comments-surface` surface

Web Device surface `comments-surface`: purpose, boundaries, author entry, evidence, and sample honesty.

`docs-page` surface

Web Device surface `docs-page`: purpose, boundaries, author entry, evidence, and sample honesty.

`in-page-toc` surface

Web Device surface `in-page-toc`: purpose, boundaries, author entry, evidence, and sample honesty.

`pagination` surface

Web Device surface `pagination`: purpose, boundaries, author entry, evidence, and sample honesty.

`search-page` surface

Web Device surface `search-page`: purpose, boundaries, author entry, evidence, and sample honesty.

Theme and token reference

Reference the token and theme boundary without confusing palette/tone with component-overlay selection.

Themes and tokens

Use tokens for stable visual vocabulary and keep theme-library choice distinct from component overlays.

Understand a site

Web Device documentation draft: understand an existing site's directories, pages, content, routes, and locales.

Version compatibility

Read every command and behavior claim against the ARC version that actually produced its evidence.

Web3 Kit

建構 Web3 應用的一組現成模組。

How to install Point Up

Point Up does not contain any practical business logic; it merely offers the most basic and purely points-related capabilities. As a result, its use c

Rules for customizing badges

Point Up also supports the configuration of customized badge rules. The context for these badge rules is that when we want users to perform certain sp

In the Virtual Gift Card

If you have Virtual Gift Card installed in your service

In the DiscussKit

If DiscussKit is installed in your service

How to use components from Store?

Pages Kit is designed with extensibility in mind. You can use custom components from Blocklet Store to extend its capabilities.

By calling through code

To use Point Up through configuration as mentioned above, the corresponding Blocklet must support the capability of Point Up. Implementing this capabi

By configuring way

Some Blocklets now support the integration of Point Up's point system through configuration. Below are several common types of Blocklets.

AD Kit (Beta)

This blocklet is in beta and is not recommended for production use

AI Kit

Overview

Daily Attendance

Overview

Discuss Kit

Overview

How to bookmark a website

If you come across a website and content that you like, and want to bookmark it, Discuss Kit's Bookmark module can help you complete this task more ef

Discuss Kit

- How to use the Blog Module

How to use the Blog Module

If you encounter something happy and want to record it, then the Blog Module of Discuss Kit can help you accomplish this!

Preference Setting

I hope this document can help everyone understand how to set preferences for Discuss Kit.

Rules for using points

Access the Point Up management console, navigate to the "Usage Points Rules" tab, and click the add button on the page to begin creating your first us

Pages Kit

- Custom Component

How to use the Doc Module

If you encounter a scenario where you need to provide documents to other users, then the Doc Module of Discuss Kit can help you accomplish this task!

Lucky Draw

Overview

How to configure point rules

Point Up supports various types of points rules, which can be configured as per the documentation below.

Rules for earning points

Open the management console of Point Up, switch to the "Earning Points Rules" tab, and then click the add button on the page to start adding your firs

Pages Kit

Overview

Built-in Package List

React

Custom Component

- How to use third-party dependencies (CDN)

How to use third-party dependencies (CDN)

Introduction

Point Up

Overview

Promotion Kits

Overview

In the Lucky Draw

In the previous section, we introduced two ways to configure the use of Point Up, both allowing users to earn points within our services. The introduc

How to use the point rules

On the ArcBlock platform, a complex service is always composed of several smaller Blocklets, and Point Up is no exception. A service based on the Bloc

Token Prize Pool

Overview

Tweet Token (Share 2 Win)

Overview

Rules of the points level

Point Up also supports configuring different level rules. When users accumulate points that meet these level criteria, they will receive a correspondi

Virtual Gift Card

Overview

Vote Kit

Overview

Waiting List

Overview

FAQs

Overview

Getting Started

Overview

How To Guides

WIP

Reference Guide

WIP

Sample Projects

WIP

Welcome

Overview

ArcBlock 白皮書 V1

ArcBlock 技術白皮書：平台架構與核心元件。

ArcBlock Technical White Paper

Version 1.0 (2017.12)