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

​
概要

Adrop React Native SDKを使用すると、React Nativeアプリでさまざまな広告フォーマットを簡単に連携できます。

​
対応広告フォーマット

フォーマット説明
バナー広告画面の一部に表示される長方形の広告
ネイティブ広告アプリコンテンツと自然に調和する広告
インタースティシャル広告全画面を覆う広告
リワード広告報酬を提供する全画面広告
ポップアップ広告ポップアップ形式で表示される広告

​
必要要件

​
React Native

  • React Native 0.71 以上

​
Android

  • APIレベル 23 (Android 6.0) 以上
  • compileSdkVersion 34
  • Kotlin 2.1.0 以上
  • Gradle 7.6.3 以上

​
iOS

  • iOS 13.0 以上
  • Swift 5.0 以上

​
インストール

​
1. パッケージインストール

npm install adrop-ads-react-native

​
2. Android設定

android/app/build.gradleにKotlinプラグインを追加します。
android/app/build.gradle
apply plugin: "kotlin-android"

​
3. iOS設定

ios/Podfileを修正します。
ios/Podfile
use_frameworks!
Podをインストールします。 
cd ios && pod install --repo-update && cd ..

​
初期化

アプリ起動時にSDKを初期化します。通常はApp.tsxまたはindex.jsで呼び出します。
App.tsx
import { Adrop } from 'adrop-ads-react-native';

// アプリ起動時に初期化
Adrop.initialize(false); // false: テストモード、true: プロダクションモード

​
初期化オプション

Adrop.initialize(
  production,        // boolean: プロダクションモードかどうか
  targetCountries,   // string[]?: ターゲット国コード配列 (オプション)
  useInAppBrowser    // boolean?: iOSアプリ内ブラウザ使用有無 (オプション)
);
パラメータ
パラメータタイプ必須説明
productionbooleanYtrue: プロダクションモード、false: テストモード
targetCountriesstring[]N広告を表示する国コード (例: ['KR', 'US'])
useInAppBrowserbooleanNiOSでアプリ内ブラウザを使用するかどうか (デフォルト: false)
例 
// 基本初期化 (テストモード)
Adrop.initialize(false);

// プロダクションモード + 特定国ターゲティング
Adrop.initialize(true, ['KR', 'JP', 'US']);

// プロダクションモード + iOSアプリ内ブラウザ使用
Adrop.initialize(true, undefined, true);

​
テーマ設定

広告UIテーマを設定します。 
import { Adrop, AdropTheme } from 'adrop-ads-react-native';

// テーマ設定
Adrop.setTheme(AdropTheme.auto);  // システム設定に従う
Adrop.setTheme(AdropTheme.light); // ライトモード
Adrop.setTheme(AdropTheme.dark);  // ダークモード
テーマ説明
AdropTheme.autoシステム設定に応じて自動切り替え
AdropTheme.lightライトモード
AdropTheme.darkダークモード

​
ユーザー識別子設定

ターゲティング広告のためにユーザー識別子(UID)を設定します。 
import { Adrop } from 'adrop-ads-react-native';

Adrop.setUID('user_123');
UIDはSHA-256でハッシュ化されて送信されます。メールアドレス、電話番号などの個人情報を直接渡さないでください。

​
テストユニットID

開発とテスト時には以下のテストユニットIDを使用してください。
フォーマットテストユニットID
バナー (320x50)PUBLIC_TEST_UNIT_ID_320_50
バナー (320x100)PUBLIC_TEST_UNIT_ID_320_100
ネイティブPUBLIC_TEST_UNIT_ID_NATIVE
インタースティシャル広告PUBLIC_TEST_UNIT_ID_INTERSTITIAL
リワード広告PUBLIC_TEST_UNIT_ID_REWARDED
ポップアップ広告PUBLIC_TEST_UNIT_ID_POPUP
import { Adrop } from 'adrop-ads-react-native';

// バナー広告テスト
const testBannerUnitId = Adrop.PUBLIC_TEST_UNIT_ID_320_50;
プロダクション配布前に必ず実際のユニットIDに置き換えてください。

​
エラーコード

SDKで発生する可能性のあるエラーコードです。
エラーコード説明
ERROR_CODE_NETWORKネットワークエラー
ERROR_CODE_INTERNAL内部エラー
ERROR_CODE_INITIALIZESDK初期化エラー
ERROR_CODE_INVALID_UNIT無効なユニットID
ERROR_CODE_NOT_TARGET_COUNTRYターゲット国ではない
ERROR_CODE_AD_INACTIVE非アクティブ広告
ERROR_CODE_AD_NO_FILL表示できる広告なし
ERROR_CODE_AD_LOAD_DUPLICATED重複ロードリクエスト
ERROR_CODE_AD_LOADINGロード進行中
ERROR_CODE_AD_EMPTY空の広告
ERROR_CODE_AD_SHOWNすでに表示された広告
ERROR_CODE_AD_HIDE_FOR_TODAY今日は非表示に設定された広告
ERROR_CODE_LANDSCAPE_UNSUPPORTED横向きモード非対応
import { AdropErrorCode } from 'adrop-ads-react-native';

// エラー処理例
if (errorCode === AdropErrorCode.adNoFill) {
  console.log('表示できる広告がありません。');
}

​
トラブルシューティング

​
iOSビルドエラー

Swiftバージョン互換性の問題が発生した場合、ios/Podfileのpost_installブロックに以下を追加してください。
ios/Podfile
post_install do |installer|
  installer.pods_project.targets.each do |target|
    target.build_configurations.each do |config|
      config.build_settings['BUILD_LIBRARY_FOR_DISTRIBUTION'] = 'YES'
    end
  end
end

​
Androidビルドエラー

Kotlinバージョンが合わない場合、android/build.gradleでKotlinバージョンを確認してください。
android/build.gradle
buildscript {
    ext {
        kotlinVersion = '2.1.0'
    }
}

​
次のステップ

バナー広告

バナー広告を実装する

ネイティブ広告

ネイティブ広告を実装する

インタースティシャル広告

インタースティシャル広告を実装する

リワード広告

リワード広告を実装する