마이그레이션 가이드

​

1. 대시보드 업데이트

• DARO 대시보드에서 전환할 앱을 확인하고 업데이트를 완료하세요.
• Android와 iOS 앱 각각의 Integration Key와 Ad Unit Key를 확인하세요.

​

2. 기존 키 파일과 설정 제거

• 프로젝트에서 daro-services.json, daro-service.json, daro-key.txt, android-daro-key.txt, ios-daro-key.txt와 이 파일들을 참조하는 설정을 제거하세요. Xcode에 등록된 파일 참조와 Copy Bundle Resources 항목도 확인하세요.
• android/gradle.properties와 빌드 스크립트에서 기존 daroAppKey 설정을 제거하세요.
• Expo config plugin을 사용했다면 daroAppKey, daroKeyFile, admobAppId를 모두 제거하세요.

​

3. DARO 연동 도구 설정

• react-native-daro-m을 사용했다면 제거하고 react-native-daro를 설치하세요.
• 기존 react-native-daro 사용자는 같은 패키지를 업데이트하세요.

npm uninstall react-native-daro-m
npm i [email protected]

• 두 패키지는 서로 다른 네이티브 SDK를 내려받으므로 함께 두지 마세요.
• Android 마이그레이션 가이드와 iOS 마이그레이션 가이드에 따라 새 SDK에 필요한 빌드 도구를 준비하세요.
• Expo 프로젝트는 시작하기의 config plugin을 사용합니다.
• React Native CLI 프로젝트는 같은 문서의 수동 설정을 따르세요.
• 기존 플러그인을 새 플러그인과 함께 적용하지 마세요.

​

4. Integration Key 및 앱 설정

• 대시보드에서 플랫폼별 앱의 Integration Key를 받아 설정하세요.
• Android와 iOS에는 각각 해당 앱의 키를 사용합니다.
• Expo config plugin은 플랫폼마다 키 하나만 받습니다.

{
  "expo": {
    "plugins": [
      [
        "react-native-daro",
        {
          "ios": {
            "daroAppKey": "기존 iOS APP KEY",
            "daroKeyFile": "./ios-daro-key.txt",
            "admobAppId": "ca-app-pub-xxxxxxxx~xxxxxxxx"
          },
          "android": {
            "daroAppKey": "기존 Android APP KEY",
            "daroKeyFile": "./android-daro-key.txt"
          }
        }
      ]
    ]
  }
}

{
  "expo": {
    "plugins": [
      [
        "react-native-daro",
        {
          "ios": {
            "daroIntegrationKey": "발급받은 iOS INTEGRATION KEY"
          },
          "android": {
            "daroIntegrationKey": "발급받은 Android INTEGRATION KEY"
          }
        }
      ]
    ]
  }
}

• 설정을 바꾼 뒤 npx expo prebuild를 실행하세요.
• 수동 연동은 시작하기의 플랫폼별 설정을 따르고, iOS는 ios/ 디렉터리에서 pod install을 실행하세요.

​

5. app-ads.txt 업데이트

• app-ads.txt 설정 가이드에 따라 대시보드에서 제공하는 최신 내용을 게시하세요.
• 대시보드에 등록한 웹사이트에서 파일에 접근할 수 있는지 확인하세요.

​

6. SDK 의존성과 코드 변경

​

import 경로 변경

• react-native-daro-m에서 가져오던 import 경로를 모두 바꾸세요.

// 변경 전
import { AdBannerView, AdFormat, initialize } from "react-native-daro-m";

// 변경 후
import { AdBannerView, AdFormat, initialize } from "react-native-daro";

​

placement 제거

• 광고 생성 인자와 배너·네이티브 컴포넌트의 placement가 제거되었습니다.

// 변경 전
<AdBannerView
  style={styles.bannerView}
  adFormat={AdFormat.BANNER}
  adUnitId={BANNER_AD_UNIT_ID}
  placement="main_bottom"
/>

// 변경 후
<AdBannerView
  style={styles.bannerView}
  adFormat={AdFormat.BANNER}
  adUnitId={BANNER_AD_UNIT_ID}
/>

​

정적 광고 API에서 Hook 또는 인스턴스 API로

• 인터스티셜·리워드·라이트 팝업의 정적 API(InterstitialAd.loadAd 등)는 DARO 2.0 SDK에서도 같은 형태로 동작하지만 deprecated입니다.
• 한 번에 옮기지 않아도 앱은 빌드되므로 포맷별로 나누어 전환할 수 있습니다.

import { InterstitialAd } from "react-native-daro-m";

InterstitialAd.addAdLoadedEventListener(() => {
  InterstitialAd.showAd(INTERSTITIAL_AD_UNIT_ID);
});

InterstitialAd.loadAd(INTERSTITIAL_AD_UNIT_ID);

import { Button } from "react-native";
import { useInterstitialAd } from "react-native-daro";

function InterstitialAdButton() {
  const { isLoaded, load, show } = useInterstitialAd(INTERSTITIAL_AD_UNIT_ID, {
    onLoadFailed: (error) => console.log(error.message),
  });

  return (
    <Button
      title={isLoaded ? "광고 보기" : "광고 불러오기"}
      onPress={() => (isLoaded ? show() : load())}
    />
  );
}

• 컴포넌트 밖에서 광고를 관리한다면 인스턴스 API를 사용하세요.
• 리스너를 등록하면 해제 함수를 돌려줍니다.

import { AdEventType, InterstitialAd } from "react-native-daro";

const ad = InterstitialAd.createForAdRequest(INTERSTITIAL_AD_UNIT_ID);
const removeLoadedListener = ad.addAdEventListener(AdEventType.LOADED, () => {
  ad.show();
});

ad.load();

// 더 이상 사용하지 않을 때
removeLoadedListener();
ad.removeAllListeners();

​

초기화 순서

• initialize()가 끝난 뒤에만 광고를 로드하고 배너·네이티브 컴포넌트를 렌더링하세요.
• 동의 상태를 설정하는 앱은 setGdpr, setCcpa, setCoppa를 initialize() 전에 호출하세요. 아동 대상 앱의 setCoppa는 초기화 요청부터 적용되어야 합니다.

​

광고 포맷별 확인

​

전환 후 추가로 사용할 수 있는 기능

• react-native-daro-m에서는 제공하지 않던 네이티브 광고를 사용할 수 있습니다.
• 광고 콜백의 AdInfo에 mediationPlatform과 adNetwork가 추가되어 어떤 디맨드가 광고를 채웠는지 확인할 수 있습니다. 기존 필드는 그대로 유지됩니다.
• 네이티브 광고는 adChoicesPosition으로 AdChoices 아이콘의 선호 위치를 지정할 수 있습니다.

​

배포 전 확인

• Android와 iOS 앱을 각각 다시 빌드하고 실제 기기에서 사용하는 모든 광고 형식의 로드, 노출, 닫힘과 콜백을 확인하세요.
• 리워드 비디오 광고를 사용한다면 보상 콜백을 함께 확인하세요.
• 2.0.0 미만의 레거시 SDK를 사용하는 배포 버전에는 기존 Ad Unit ID를 유지하세요.