このガイドでは、Google Mobile Ads SDK for React Native を使用してメディエーションで Pangle のディスプレイ広告を読み込んで表示する方法を、ウォーターフォールと入札の統合を含めて説明します。また、広告ユニットのメディエーション設定に Pangle を追加する方法と、Pangle SDK とアダプタを React Native アプリに統合する方法についても説明します。
サポートされている統合と広告フォーマット
Pangle 用の AdMob メディエーション アダプタには、次の機能があります。
| 統合 | |
|---|---|
| 入札 | 1 |
| ウォーターフォール | |
| フォーマット | |
| アプリの起動 | 2 |
| バナー | 2 |
| インタースティシャル | |
| リワード | |
| リワード インタースティシャル | |
| ネイティブ | 2 |
1 利用可能な Pangle 入札広告ソースには、Pangle US、Pangle KR、Pangle ROW があります。
2 このフォーマットは、次の Pangle 入札広告ソースではサポートされていません: Pangle US。
前提条件
- 最新の Google Mobile Ads SDK for React Native バージョン。
- [Pangle US 入札の場合]: Pangle アダプタ バージョン N/A 以降を使用します。
- React Native フレームワーク バージョン 0.85.0 以降。
- Android にデプロイする場合
- Android API レベル 24 以降。
- iOS にデプロイする場合
- iOS のデプロイ ターゲット 13.0 以降。
- Google Mobile Ads SDK for React Native で構成された正常に動作する React Native プロジェクト。詳細については、Google Mobile Ads SDK for React Native を設定するをご覧ください。
gma-sdk-react-nativeフォルダからadaptersフォルダをダウンロードして解凍していることを確認します。adaptersフォルダがない場合は、Google Mobile Ads SDK for React Native をインストールするの手順 1、2、3 を行います。
- AdMob メディエーションを設定する
ステップ 1: Pangle の管理画面で構成を設定する
新しいアプリケーションを追加する
[Applications] タブに移動し、[Add App] ボタンをクリックします。

アプリケーションを作成する [オペレーティング システム] を選択し、フォームの残りの部分を入力します。[送信] をクリックします。
Android

iOS

アプリケーションのアプリ ID をメモします。
Android

iOS

広告プレースメントを作成する
アプリケーションが作成されたら、[Add] ボタンをクリックして広告プレースメントを作成します。
Android

iOS

入札
[広告フォーマット] と [広告プレースメント名] を選択し、[価格設定タイプ] として [アプリ内入札] を選択します。フォームの残りの部分に記入し、[送信] をクリックします。

広告プレースメントが作成されたら、広告プレースメント ID をメモしておきます。
Android

iOS

ウォーターフォール
[広告フォーマット]、[広告プレースメント名]、[グローバル CPM]([価格設定タイプ])を選択します。フォームの残りの部分に記入し、[送信] をクリックします。

広告プレースメントが作成されたら、広告プレースメント ID をメモしておきます。
Android

iOS

Pangle Reporting API キーを確認する
入札
このステップは、入札の統合には必要ありません。
ウォーターフォール
ページの左下にある [ユーザー ID] をメモします。

[Integrations] > [SDK & API] > [Pangle Reporting API 2.0] をクリックします。[Role ID] と [Security Key] をメモします。

app-ads.txt を更新する
アプリの認定販売者 app-ads.txt は、IAB Tech Lab が推進するイニシアチブで、承認されたチャネルでのみアプリ広告インベントリを販売できるようにするものです。広告収入の大幅な減少を防ぐためには、app-ads.txt ファイルを実装する必要があります。まだ設定していない場合は、アプリの app-ads.txt ファイルを設定します。
Pangle 用に app-ads.txt を実装するには、Pangle を app-ads.txt ファイルに追加する方法をご覧ください。
テストモードをオンにする
Pangle のテスト広告を有効にする方法については、Pangle のテスト広告を追加する方法ガイドの手順に沿って操作してください。
ステップ 2: AdMob の管理画面で Pangle のデマンドを設定する
広告ユニットのメディエーション設定を構成する
GDPR と米国の州規制の広告パートナー リストに Pangle DSP を追加する
欧州の規制に関する設定と米国の州の規制に関する設定の手順に沿って、AdMob 管理画面の欧州および米国の州の規制に関する広告パートナーのリストに Pangle DSP を追加します。
ステップ 3: Pangle SDK とアダプタをインポートする
プロジェクトのルート ディレクトリに、Pangle 用の Google Mobile Ads SDK for React Native メディエーション アダプタをインストールします。次の手順に沿って操作します。
Google Mobile Ads SDK for React Native アダプタの tar ファイルを
gma-sdk-react-native/adapters/pangle/ディレクトリからプロジェクトのlocal_packages/ディレクトリにコピーします。adaptersフォルダがない場合は、前提条件をご覧ください。mkdir -p local_packages cp EXTRACT_DIR/gma-sdk-react-native/adapters/pangle/gma-mediation-pangle-0.1.0.tgz local_packages/EXTRACT_DIR は、アーカイブを抽出したディレクトリのパスに置き換えます。
任意のパッケージ マネージャーを使用して、アダプタ パッケージをインストールします。
npm
npm install ./local_packages/gma-mediation-pangle-0.1.0.tgz毛糸
yarn add ./local_packages/gma-mediation-pangle-0.1.0.tgzAndroid 向けにビルドする場合は、プロジェクトの
androidディレクトリにあるbuild.gradleファイルに次のリポジトリを追加します。repositories { google() mavenCentral() maven { url = uri("https://artifact.bytedance.com/repository/pangle/") } }
ステップ 4: Pangle SDK にプライバシー設定を実装する
EU ユーザーからの同意と GDPR
Google の EU ユーザーの同意ポリシーに準拠するには、欧州経済領域(EEA)、英国、スイスのユーザーに対して特定の情報を開示し、Cookie などのローカル ストレージの使用(法律で義務付けられている場合)、および広告のパーソナライズを目的とした個人データの収集、共有、使用についてユーザーの同意を得る必要があります。このポリシーには、EU の e プライバシー指令と一般データ保護規則(GDPR)の要件が反映されています。パブリッシャー様には、同意がメディエーション チェーン内の各広告ソースに反映されていることを確認する責任があります。
Pangle React Native アダプタ バージョン 0.1.0 以降では、UMP SDK と、Google の追加同意仕様を統合する同意管理プラットフォームから Pangle SDK に GDPR 同意シグナルを渡すことができます。
米国のプライバシー関連州法
米国のプライバシー関連州法では、ユーザーが「個人情報」の「販売」をオプトアウトする権利を付与することが義務付けられています(用語は法律の定義に基づく)。「販売者」のホームページには、「個人情報を第三者に売却しない」ことを明記したリンクを目立つように表示することによってオプトアウトの手段を提供する必要があります。米国のプライバシー関連州法遵守ガイドでは、Google 広告の配信で制限付きデータ処理を有効にできますが、Google がこの設定をメディエーション チェーン内の各広告ネットワークに適用することはできません。そのため、メディエーション チェーン内で個人情報の販売に関与する可能性のある広告ネットワークを特定し、各ネットワークのガイダンスに沿って州法を遵守する必要があります。
次のサンプルコードは、同意情報を Pangle SDK に渡す方法を示しています。Google Mobile Ads SDK for React Native を初期化する前に同意情報を設定して、Pangle SDK に適切に転送されるようにします。
import {
PangleMediation,
PanglePAConsentType,
} from '@google/gma-mediation-pangle';
// ...
PangleMediation.setPAConsent(PanglePAConsentType.CONSENT);
詳細と各メソッドで指定できる値については、Pangle の統合ガイドをご覧ください。
ステップ 5: 必要なコードを追加する
Android
Pangle の統合に追加のコードは必要ありません。
iOS
SKAdNetwork の統合
Pangle のドキュメントに沿って、プロジェクトの Info.plist ファイルに SKAdNetwork ID を追加します。
ステップ 6: 実装をテストする
テスト広告を有効にする
AdMob 用のテストデバイスを登録し、Pangle の管理画面でテストモードを有効にしてください。
テスト広告を確認する
Pangle からテスト広告を受信していることを確認するには、Pangle(ウォーターフォール)、Pangle US SDK(入札)、Pangle KR SDK(入札)、Pangle ROW SDK(入札)の広告ソースを使用して、広告インスペクタで単一の広告ソースのテストを有効にします。
エラーコード
アダプタが Pangle から広告を受信できなかった場合は、次のクラスの ResponseInfo を使用して、広告レスポンスから根本原因のエラーを確認できます。
Android
com.pangle.ads
com.google.ads.mediation.pangle.PangleMediationAdapter
iOS
GADMediationAdapterPangle
広告の読み込みに失敗した場合に Pangle アダプタがスローするコードとメッセージは次のとおりです。
Android
| エラーコード | ドメイン | 理由 |
|---|---|---|
| 101 | com.google.ads.mediation.pangle | サーバー パラメータが無効です(アプリ ID またはプレースメント ID がないなど)。 |
| 102 | com.google.ads.mediation.pangle | リクエストされた広告サイズが、Pangle でサポートされているバナーサイズと一致しません。 |
| 103 | com.google.ads.mediation.pangle | Pangle SDK は、子供ユーザーをサポートしていません。 |
| -1-60000 | com.pangle.ads | Pangle SDK がエラーを返しました。詳しくは、Pangle のドキュメントをご覧ください。 |
iOS
| エラーコード | ドメイン | 理由 |
|---|---|---|
| 101 | com.google.mediation.pangle | サーバー パラメータが無効です(アプリ ID またはプレースメント ID がないなど)。 |
| 102 | com.google.mediation.pangle | リクエストされた広告サイズが、Pangle でサポートされているバナーサイズと一致しません。 |
| 104 | com.google.mediation.pangle | Pangle SDK は、子供ユーザーをサポートしていません。 |
| -1-60000 | Pangle SDK によって送信されたエラーコード | Pangle SDK がエラーを返しました。詳しくは、Pangle のドキュメントをご覧ください。 |
バージョン 0.1.0
- 初回リリース。
- Pangle Android アダプタ バージョン 8.3.0.3.0 をサポートします。
- Pangle iOS アダプタ バージョン 8.2.1.0.0 をサポートします。
- Google Mobile Ads React Native プラグイン バージョン 0.1.0 でビルドおよびテスト済みです。