> ## Documentation Index
> Fetch the complete documentation index at: https://docs.adrop.io/llms.txt
> Use this file to discover all available pages before exploring further.
# はじめに
> CDNを通じてAdrop Web SDKを連携する方法をご案内します。
## 概要
ビルドツールなしでCDNスクリプトを通じてAdrop Web SDKを連携できます。静的ウェブサイトやシンプルなHTMLページに適しています。
### サポートする広告フォーマット
* バナー広告
* ネイティブ広告（カスタムUI対応）
### 要件
* モダンブラウザ（Chrome、Firefox、Safari、Edge）
***
## インストール
HTMLドキュメントの``セクションにスクリプトを追加します。
```html theme={null}
```
特定バージョンを固定するには、`@latest`の代わりにバージョン番号を明示してください。
例：`@adrop/ads-web-sdk@1.0.1`
***
## 初期化
スクリプト読み込み後、SDKを初期化します。
```html theme={null}
```
### 初期化オプション (AdropConfig)
Ad Controlコンソールで発行されたアプリID
ユーザー識別子（ターゲティングに活用）
API認証キー（ユーザー属性更新時に必要）
デバッグログを有効化
媒体全体のバックフィルレンダリングモード。スロット単位のオプションが優先されます。詳細は[バックフィルレンダリングモード](/ja/sdk/web/backfill)ガイドを参照してください。（SDK 1.2.3+）
本番環境では`debug: false`に設定してください。
### インスタンスアクセス
初期化後、どこからでも`Adrop.instance()`でSDKにアクセスできます。
```javascript theme={null}
const adrop = Adrop.instance();
// SDKを使用
```
### 設定の動的変更
ログイン後にユーザーIDを設定するなど、ランタイムで設定を変更できます。
```javascript theme={null}
// Setterを使用
Adrop.instance().uid = 'USER_ID';
Adrop.instance().appKey = 'YOUR_APP_KEY';
// またはsetConfigを使用
Adrop.instance().setConfig({
uid: 'USER_ID',
appKey: 'YOUR_APP_KEY'
});
```
ターゲティング広告が正常に動作するには、広告枠レンダリング前に`uid`を設定してください。
***
## WebView設定（バックフィル広告用）
WebアプリがWebViewで実行され、バックフィル広告を表示する場合は、ネイティブアプリの設定が必要です。以下のプラットフォーム別ガイドをご参照ください。
Android WebView設定方法
iOS WebView設定方法
***
## 目次
バナー広告の実装
ネイティブ広告の実装
オーディエンス/コンテキストターゲティング
クラス、インターフェース、定数
React、CDNサンプルコード