注: 以下の翻訳の正確性は検証されていません。AIPを利用して英語版の原文から機械的に翻訳されたものです。

既存のアプリケーションにオントロジー SDK パッケージを追加する

このページでは、既存のアプリケーションにオントロジー SDK パッケージを追加する手順を説明します。既存のアプリケーションがない場合は、新しいオントロジー SDK アプリケーションをセットアップするためのドキュメントを参照してください。

このガイドでは、パブリック OAuth を使用するクライアント向けアプリケーションにオントロジー SDK を追加する方法を説明します。サービスユーザーを使用するバックエンドサービスについては、サービスユーザーを使用して新しいオントロジー SDK TypeScript アプリケーションをセットアップするを参照してください。

1:前提条件

Developer Console アプリケーションを作成する

新しい Developer Console アプリケーションを作成するページに記載されている手順に沿って進めます。

トークンを設定する

ローカル環境でトークンをエクスポートします。以下はサンプルの個人用アクセストークンを使用した例ですが、Developer Console では有効期間がより長いトークンを生成できます。このトークンは個人用アクセストークンであるため、ソース管理にチェックインしないでください。

Copied!
1 export FOUNDRY_TOKEN=<YOUR-TOKEN-FROM-GETTING-STARTED-PAGE>

Node のバージョンを確認する

TypeScript SDK が動作するには Node 18以降が必要です。使用している Node のバージョンを確認するには、以下のコマンドを使用します。

Copied!
1 node --version

2:既存のプロジェクトにオントロジー SDK を追加する

NPM レジストリを設定する

以下のコードをリポジトリまたはユーザーの .npmrc ファイルに追加し、< > をアプリケーション固有の値に置き換えます。

//<REGISTRY-URL-FROM-OVERVIEW-PAGE>:_authToken=${FOUNDRY_TOKEN}
<PACKAGE-NAME>:registry=https://<REGISTRY-URL-FROM-OVERVIEW-PAGE>

パッケージのインストール時に404エラーが発生する場合、npm が Foundry レジストリではなく別のレジストリを使用している可能性があります。npm レジストリの設定をオーバーライドする設定がないか確認し、削除してください。

  1. npm config delete registry を実行し、プロジェクトの設定をオーバーライドする可能性がある、グローバルに設定された npm レジストリを削除します。
  2. プロジェクトまたはユーザーディレクトリ内のほかの .npmrc ファイルで、別のレジストリ URL が設定されていないことを確認します。
  3. .npmrc のレジストリ URL が、Developer Console の SDK の概要ページにある URL と一致していることを確認します。
  4. FOUNDRY_TOKEN 環境変数に有効なトークンが設定されていることを確認します。

任意:証明書を設定する

組織でネットワーク通信に証明書が必要な場合は、証明書の場所を Node に指定する必要がある場合があります。

Copied!
1 export NODE_EXTRA_CA_CERTS="/path/to/my.crt"

最新バージョンの SDK をインストールする

以下のコマンドを実行して SDK パッケージをインストールします。

Copied!
1 2 3 npm install <PACKAGE-NAME>@latest npm install @osdk/client@latest npm install @osdk/oauth@latest

Foundry クライアントを初期化して開発を開始する

以下のコードをアプリケーションに追加し、< > をパッケージ固有の値に置き換えます。

Copied!
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 import { createPublicOauthClient } from "@osdk/oauth"; import { createClient } from "@osdk/client"; import { <ANY-OBJECT-NAME> } from "<PACKAGE-NAME>"; import React, { useEffect } from "react"; const auth = createPublicOauthClient("<YOUR-CLIENT-ID>", "<YOUR-FOUNDRY-URL>", "<YOUR-REDIRECT-URL>"); const client: Client = createClient("<YOUR-FOUNDRY-URL>", "<YOUR-ONTOLOGY-RID>", auth); export default function SimpleReactComponent() { useEffect(() => { if (auth.getTokenOrUndefined()) { auth.refresh().catch(() => /** トークンを更新できない場合(たとえば、ユーザーがログインしていない場合)は、Foundry でログインフローを開始します ログインが完了すると、ユーザーは http://localhost:8080/auth/callback にリダイレクトされて戻ります **/ auth.signIn()) } else { client(<ANY-OBJECT-NAME>).fetchPage({ $pageSize: 10 }).then((object) => { console.log(object.data); }); } }, []); };

オントロジー SDK の React パッケージを使用する(任意)

アプリケーションで React を使用している場合は、以下のライブラリを使用できます。

@osdk/react

型付きフック、共有キャッシュ、アクション、関数、データ駆動型のカスタムインターフェースには、@osdk/react を使用します。

@osdk/react の最新バージョンをインストールします。

Copied!
1 npm install @osdk/react@latest

@osdk/react-components

オントロジーに対応した事前構築済みのインターフェース要素には、@osdk/react-components を使用します。このライブラリは @osdk/react を基盤としています。

@osdk/react-components の最新バージョンをインストールします。

Copied!
1 npm install @osdk/react-components@latest