メインコンテンツへスキップ

はじめに

このガイドでは、Node.js アプリケーションで基本的な DID Connect セッションをセットアップするための、最小限のステップバイステップの例を提供します。このチュートリアルを終える頃には、DID ウォレットを介してユーザーのプロフィール情報を要求できるサーバーが動作するようになります。

1. インストール

まず、必要なパッケージをインストールする必要があります。このライブラリは、Express.js のようなウェブサーバーフレームワークで動作するように設計されています。また、セッショントークンを管理するためのストレージアダプターも必要になります。

必要なパッケージをインストール

bash
# npm を使用
npm install express @arcblock/did-connect-js @arcblock/did-connect-storage-nedb @ocap/wallet

# pnpm を使用
pnpm install express @arcblock/did-connect-js @arcblock/did-connect-storage-nedb @ocap/wallet
  • express: ウェブサーバーフレームワーク。
  • @arcblock/did-connect-js: DID Connect セッションを処理するためのメインライブラリ。
  • @arcblock/did-connect-storage-nedb: セッショントークン用のシンプルなファイルベースのストレージアダプター。他のアダプターも利用可能です。
  • @ocap/wallet: DID ウォレットを作成・管理するためのライブラリ。アプリケーションのアイデンティティを作成するために使用します。

2. サーバーの初期化

次に、index.js ファイルで DID Connect のコアコンポーネントをセットアップしましょう。主に扱う2つのクラスは WalletAuthenticatorWalletHandlers です。

  • WalletAuthenticator: アプリケーションのアイデンティティを管理し、認証リクエストの作成と署名を行います。
  • WalletHandlers: DID Connect セッションのライフサイクル全体を処理するための Express.js ミドルウェアのセットを提供します。

以下が初期設定です:

index.js

javascript
const express = require('express');
const { fromRandom } = require('@ocap/wallet');
const SimpleStorage = require('@arcblock/did-connect-storage-nedb');
const { WalletAuthenticator, WalletHandlers } = require('@arcblock/did-connect-js');

// 1. アプリケーション用のウォレットを作成
// このウォレットはアプリケーションのアイデンティティを表します。
// 実際のアプリケーションでは、このウォレットを永続化して再利用する必要があります。
const wallet = fromRandom();

// 2. WalletAuthenticator を設定
const authenticator = new WalletAuthenticator({
  wallet, // アプリケーションのウォレット
  baseUrl: 'http://localhost:3000', // アプリケーションの公開 URL
  appInfo: {
    name: 'My First DID Connect App',
    description: 'DID Connect をデモするためのシンプルなアプリ。',
    icon: 'https://arcblock.oss-cn-beijing.aliyuncs.com/images/wallet-round.png', // アプリのロゴへの URL
  },
  chainInfo: {
    host: 'https://babel.arcblock.io/api',
    id: 'babel',
  },
});

// 3. WalletHandlers を設定
const handlers = new WalletHandlers({
  authenticator,
  tokenStorage: new SimpleStorage({ dbPath: './auth.db' }), // セッショントークンのストレージ
});

// 4. Express アプリを作成
const app = express();

// baseUrl を明示的に設定しない場合、動的な推論にこれが必要です
app.set('trust proxy', true);

// ... 次のステップでハンドラをアタッチ

// 5. サーバーを起動
const port = 3000;
app.listen(port, () => {
  console.log(`サーバーが http://localhost:${port} で起動しました`);
  console.log(`アプリケーション DID: ${wallet.toAddress()}`);
});

3. 接続の処理

オーセンティケーターとハンドラーが設定されたら、最後のステップは DID Connect エンドポイントを Express アプリにアタッチすることです。これは handlers.attach() メソッドを使用して行い、要求する特定のクレームと認証成功時に実行するコールバックを定義します。

app.listen() の前に、次のコードを index.js ファイルに追加します:

index.js

javascript
// DID Connect セッションハンドラをアタッチ
handlers.attach(app, {
  // この認証アクションの一意の名前
  action: 'profileLogin',

  // ユーザーに要求したい情報を定義
  claims: {
    profile: () => ({
      fields: ['fullName', 'email'],
      description: 'サインインするために、あなたの名前とメールアドレスを提供してください。',
    }),
  },

  // このコールバックは、ユーザーがウォレットでリクエストを承認した後に実行されます
  onAuth: async ({ userDid, claims }) => {
    // `userDid` は接続されたユーザーの DID です。
    // `claims` はユーザーが提出した情報を含む配列です。
    const profile = claims.find((x) => x.type === 'profile');
    console.log('ログイン成功!');
    console.log('ユーザー DID:', userDid);
    console.log('ユーザー プロフィール:', profile);
  },
});

4. 完全なコード

以下が、index.js ファイルの完全な実行可能なコードです。これを保存して直接実行できます。

index.js

javascript
const express = require('express');
const { fromRandom } = require('@ocap/wallet');
const SimpleStorage = require('@arcblock/did-connect-storage-nedb');
const { WalletAuthenticator, WalletHandlers } = require('@arcblock/did-connect-js');

// 1. アプリケーション用のウォレットを作成
const wallet = fromRandom();

// 2. WalletAuthenticator を設定
const authenticator = new WalletAuthenticator({
  wallet,
  baseUrl: 'http://localhost:3000',
  appInfo: {
    name: 'My First DID Connect App',
    description: 'DID Connect をデモするためのシンプルなアプリ。',
    icon: 'https://arcblock.oss-cn-beijing.aliyuncs.com/images/wallet-round.png',
  },
  chainInfo: {
    host: 'https://babel.arcblock.io/api',
    id: 'babel',
  },
});

// 3. WalletHandlers を設定
const handlers = new WalletHandlers({
  authenticator,
  tokenStorage: new SimpleStorage({ dbPath: './auth.db' }),
});

// 4. Express アプリを作成し、ハンドラをアタッチ
const app = express();
app.set('trust proxy', true);

handlers.attach(app, {
  action: 'profileLogin',
  claims: {
    profile: () => ({
      fields: ['fullName', 'email'],
      description: 'サインインするために、あなたの名前とメールアドレスを提供してください。',
    }),
  },
  onAuth: async ({ userDid, claims }) => {
    const profile = claims.find((x) => x.type === 'profile');
    console.log('ログイン成功!');
    console.log('ユーザー DID:', userDid);
    console.log('ユーザー プロフィール:', profile);
  },
});

// 5. サーバーを起動
const port = 3000;
app.listen(port, () => {
  console.log(`サーバーが http://localhost:${port} で起動しました`);
  console.log(`アプリケーション DID: ${wallet.toAddress()}`);
});

次に、アプリケーションを実行します:

bash
node index.js

これで、バックエンドが DID Connect セッションを処理する準備が整いました。フローを完了するには、QR コードを表示するためのフロントエンドが必要です。簡単なテストには、DID Connect UX ライブラリを使用するか、ウェブアプリケーションに統合することができます。

次のステップ

おめでとうございます!基本的な DID Connect サーバーのセットアップに成功しました。これで、より高度な機能を探求できます。