시작하기 전에
중요: SDK 초기화 필수 배너 광고와 네이티브 광고는 반드시 SDK 초기화가 완료된 후에 렌더링되어야 합니다.
초기화 전 광고 컴포넌트를 렌더링하면 다음 에러가 발생합니다:
AdBannerView | NativeAdView is mounted before the initialization of the DaroM React Native module 전면 광고, 보상형 광고 등 다른 광고 형식도 SDK 초기화 이후에 로드해야 합니다.
React Native 프로젝트에 Daro SDK를 통합하기 전에 필요한 사항들을 확인하세요.
요구사항
안드로이드 minSdkVersion : 26
iOS 15.1 이상
앱 설정하기
연동하기 전에 에서 확인한 Non-Reward / Reward 카테고리에 따라 아래 단계를 진행해주세요.기존에 daro-m을 사용 중이라면, Reward 탭을 선택하여 daro-m 연동 가이드를 따라주세요.
npm 패키지 추가하기
터미널에서 npm 패키지를 추가합니다.
Android 프로젝트 설정하기
프로젝트 단위 빌드 설정
settings.gradle 파일에 maven repository 들을 추가합니다.
dependencyResolutionManagement {
repositoriesMode. set (RepositoriesMode.FAIL_ON_PROJECT_REPOS)
repositories {
.. .
maven { url = uri ( "https://artifact.bytedance.com/repository/pangle" ) }
maven { url = uri ( "https://verve.jfrog.io/artifactory/verve-gradle-release" ) }
maven { url = uri ( "https://cboost.jfrog.io/artifactory/chartboost-ads/" ) }
maven { url = uri ( "https://repo.premiumads.net/artifactory/mobile-ads-sdk/" ) }
maven { url = uri ( "https://repo.pubmatic.com/artifactory/public-repos" ) }
maven { url = uri ( "https://s3.amazonaws.com/smaato-sdk-releases/" ) }
maven { url = uri ( "https://android-sdk.is.com/" ) }
maven { url = uri ( "https://dl-maven-android.mintegral.com/repository/mbridge_android_sdk_oversea" ) }
}
}
build.gradle(root)에 daro 플러그인 추가
build.gradle(root) 파일에 daro 관련 플러그인을 추가합니다.
buildscript {
repositories {
google ()
mavenCentral ()
}
dependencies {
classpath ( "so.daro:daro-plugin:{version}" )
}
}
Daro SDK 추가
Daro SDK를 추가합니다.
dependencies {
.. .
implementation ( "so.daro:daro-a:{version}" )
.. .
}
android-daro-key.txt 파일 추가
android-daro-key.txt 파일을 추가합니다.
app/
└── android-daro-key.txt
android-daro-key.txt는 DARO 대시보드에서 다운받을 수 있습니다.
daroAppKey 설정
daroAppKey 를 설정합니다.
Show gradle.properties 에 설정하기
android.useAndroidX =true
android.enableJetifier =true
daroAppKey ={APP_KEY}
Show app 모듈 gradle에 직접 설정하기
app 모듈 build.gradle에 아래와 같이 설정합니다. buildscript {
extra[ "daroAppKey" ] = "APP_KEY"
}
daroAppKey는 DARO 대시보드에서 확인할 수 있습니다.
build.gradle(app)에 daro plugin 적용
build.gradle(app)에 daro plugin을 적용합니다.
plugins {
.. .
id ( "so.daro.a" )
.. .
}
proguard rule 추가히기
proguard rule을 추가합니다.
-keep class com.bytedance.sdk.** { *; }
-keepattributes Signature
-keep class net.pubnative.** { *; }
-keep class com.iab.omid.library.pubnativenet.** { *; }
-keep class com.amazon.** { *; }
-keep public class com.google.android.gms.ads.** {
public *;
}
-keep class com.iabtcf.** {*;}
-keep public class com.smaato.sdk.** { *; }
-keep public interface com.smaato.sdk.** { *; }
-keepclassmembers class * implements android.os.Parcelable {
public static final android.os.Parcelable$Creator *;
}
-keep class com.ironsource.adapters.** { *; }
-dontwarn com.ironsource.**
-dontwarn com.ironsource.adapters.**
-keepclassmembers class com.ironsource.** { public *; }
-keep public class com.ironsource.**
-keep class com.ironsource.adapters.** { *;
}
-keepclassmembers class com.applovin.sdk.AppLovinSdk {
static *;
}
-keep public interface com.applovin.sdk** {*; }
-keep public interface com.applovin.adview** {*; }
-keep public interface com.applovin.mediation** {*; }
-keep public interface com.applovin.communicator** {*; }
-keep class androidx.localbroadcastmanager.content.LocalBroadcastManager { *;}
-keep class androidx.recyclerview.widget.RecyclerView { *;}
-keep class androidx.recyclerview.widget.RecyclerView$OnScrollListener { *;}
-keep class * extends android.app.Activity
-flattenpackagehierarchy droom.daro.a
-keep public class droom.daro.** {
public protected *;
}
-keep interface droom.daro.** {
public protected *;
}
-keep,allowobfuscation,allowshrinking class kotlin.coroutines.Continuation
iOS 프로젝트 설정하기
iOS 15.1 이상
Xcode 14.0 이상
ios/PROJECT_NAME.xcworkspace 을 열고 ios-daro-key.txt 파일을 드래그 앤 드롭으로 추가합니다.
⚠️ SDK를 초기화하기 위해서는 ios-daro-key.txt 파일이 프로젝트에 반드시 포함되어야 합니다.
GADApplicationIdentifier, DaroAppKey 는 DARO 대시보드에서 ( AdMob Key, App Key ) 확인할 수 있습니다.
❗ Info.plist 의 SKAdNetworkItems 들을 앱의 Info.plist 에 복사해 넣어주세요.
등록하지 않으면 광고 네트워크가 전환 성과를 보고 받지 못해 광고 효율이 낮아집니다.
광고 퍼포먼스에 큰 영향을 주기때문에 꼭! 넣어주세요.
Info.plist 에 다음 ID들을 추가합니다.
< key > GADApplicationIdentifier </ key >
< string > /* Daro 대시보드에서 발급받은 Admob Key 추가 */ </ string >
< key > DaroAppKey </ key >
< string > /* Daro 대시보드에서 발급받은 Daro App Key 추가 */ </ string >
< key > SKAdNetworkItems </ key >
< array >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > cstr6suwn9.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 4fzdc2evr5.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 4pfyvq9l8r.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 2fnua5tdw4.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > ydx93a7ass.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 5a6flpkh64.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > p78axxw29g.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > v72qych5uu.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > ludvb6z3bs.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > cp8zw746q7.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 3sh42y64q3.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > c6k4g5qg8m.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > s39g8k73mm.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 3qy4746246.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > f38h382jlk.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > hs6bdukanm.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > v4nxqhlyqp.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > wzmmz9fp6w.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > yclnxrl5pm.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > t38b2kh725.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 7ug5zh24hu.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > gta9lk7p23.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > vutu7akeur.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > y5ghdn5j9k.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > n6fk4nfna4.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > v9wttpbfk9.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > n38lu8286q.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 47vhws6wlr.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > kbd757ywx3.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 9t245vhmpl.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > eh6m2bh4zr.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > a2p9lx4jpn.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 22mmun2rn5.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 4468km3ulz.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 2u9pt9hc89.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 8s468mfl3y.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > klf5c3l5u5.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > ppxm28t8ap.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > ecpz2srf59.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > uw77j35x4d.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > pwa73g5rt2.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > mlmmfzh3r3.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 578prtvx9j.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 4dzt52r2t5.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > e5fvkxwrpn.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 8c4e2ghe7u.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > zq492l623r.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 3rd42ekr43.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 3qcr597p9d.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > mj797d8u6f.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 55644vm79v.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 6yxyv74ff7.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 55y65gfgn7.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > cwn433xbcr.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > nu4557a4je.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > w7jznl3r6g.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 577p5t736z.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 6rd35atwn8.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 7bxrt786m8.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > 7fbxrn65az.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > dt3cjx1a9i.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > fz2k2k5tej.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > jk2fsx2rgz.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > r8lj5b58b5.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > tmhh9296z4.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > k6y4y55b64.skadnetwork </ string >
</ dict >
< dict >
< key > SKAdNetworkIdentifier </ key >
< string > qwpu75vrh2.skadnetwork </ string >
</ dict >
</ array >
SDK 초기화하기
아래 코드를 참고하여 SDK를 초기화합니다.
import { useState , useEffect } from "react" ;
import { initialize } from "react-native-daro" ;
function App () {
const [ isInitialized , setIsInitialized ] = useState ( false );
useEffect (() => {
initialize ()
. then (() => setIsInitialized ( true ))
. catch ( console . error );
}, []);
// 초기화 완료 후 광고 컴포넌트 렌더링
return (
< View >
{ isInitialized && (
< BannerAdView adUnitId = { adUnitId } />
) }
</ View >
);
}
베스트 프랙티스
SDK 초기화 관리
SDK를 효율적으로 관리하고 에러를 방지하기 위한 권장 사항입니다.
앱 시작 시 initialize() 호출
앱의 진입점(App.js 또는 index.js)에서 SDK를 초기화하세요
초기화 상태를 state로 관리
초기화 완료 여부를 추적하여 광고 렌더링 시점을 제어하세요
모든 배너 및 네이티브 광고 컴포넌트를 조건부 렌더링으로 보호
초기화가 완료되지 않은 상태에서 광고 컴포넌트가 렌더링되지 않도록 하세요