---
title: 初期化
canonical: https://developer.unico.io/ja/dual-api/developers/sdks-and-tools/web/web-sdk/initialization
locale: ja
generated_by: markdown-export
---

## 初期化のタイミング

できるだけ早い段階でSDKを初期化してください — 通常、キャプチャフレームを含むページまたはコンポーネントが読み込まれるときです。キャプチャボタンのクリック時に初期化**しない**理由の詳細については、[ベストプラクティス](/dual-api/developers/sdks-and-tools/web/web-sdk/resources)を参照してください。

## 認証情報の埋め込み

Onboardingチームから提供された認証情報を使用して`UnicoConfig`クラスを実装します：

```javascript
import { UnicoConfig } from "unico-webframe"

const config = new UnicoConfig()
  .setHostname("<YOUR_HOSTNAME>")
  .setHostKey("<YOUR_HOST_KEY>");
```

## ビルダーのインスタンス化

`UnicoCheckBuilder`の新しいインスタンスを作成します：

```javascript
const unicoCameraBuilder = new UnicoCheckBuilder();
```

## リソースパスの設定

追加ファイルのパスを指定します（プロジェクトに追加されている場合）：

```javascript
unicoCameraBuilder.setResourceDirectory("/resources");
```

AIモデルファイルのパスを指定します（スマートカメラモードでのみ必要）：

```javascript
unicoCameraBuilder.setModelsPath("https://yoursite.com/models");
```

:::info[3.18.0以降の自動フェッチ]
バージョン3.18.0以降、SDKは追加リソースを自動的にフェッチできます — `setResourceDirectory`を実装せず、[CSP設定](/dual-api/developers/sdks-and-tools/web/web-sdk/installation)が正しく適用されていることを確認してください。
:::

## CSSリセットの設定（オプション）

デフォルトでは、SDKはコンポーネント全体の視覚的な一貫性を確保するためにCSSリセットを適用します。アプリケーションのCSSスタイルを保持するには、この機能を無効にします：

```javascript
unicoCameraBuilder.disableCssReset();
```

## 環境の選択

**サンドボックス**と**本番環境**の選択は初期化時に行います。`SDKEnvironmentTypes`列挙型を使用します：

- `SDKEnvironmentTypes.PROD` — 本番環境
- `SDKEnvironmentTypes.UAT` — ステージング環境

```javascript
import {
  UnicoCheckBuilder,
  SDKEnvironmentTypes
} from "unico-webframe"

unicoCameraBuilder.setEnvironment(SDKEnvironmentTypes.UAT);
```

:::info
設定されていない場合、Web SDKはデフォルトで本番環境を使用します。
:::

利用可能な環境タイプの完全なリストについては、[APIリファレンス > 初期化API](/dual-api/developers/sdks-and-tools/web/web-sdk/api-reference/initialization-api)を参照してください。

## ライフサイクル

バックエンドとのSDK認証には数秒かかります。ユーザーがキャプチャボタンをクリックしたときではなく、**早めに初期化**してください — そうしないと、クリックからカメラが開くまでの間にラグが生じます。