Third-Party Services - Google AdMob

AdMob

 

 

✅ 설치 및 테스트

---

npm install react-native-google-mobile-ads

 

 

<app.json>

루트에 test id를 적어준다.

"react-native-google-mobile-ads": {
    "android_app_id": "ca-app-pub-3940256099942544~3347511713",
    "ios_app_id": "ca-app-pub-3940256099942544~1458002511"
},

 

 

Initialize

<index.tsx>

import mobileAds, { MaxAdContentRating } from "react-native-google-mobile-ads";

async function initAds() {
    await mobileAds().setRequestConfiguration({
    testDeviceIdentifiers: ["EMULATOR"],
    maxAdContentRating: MaxAdContentRating.PG,
	});

	await mobileAds().initialize();
}

initAds();

 

Banner

import {
BannerAd,
BannerAdSize,
TestIds,
} from "react-native-google-mobile-ads";

BannerAd unitId={TestIds.BANNER} size={BannerAdSize.BANNER} />

 

 

특정 동작 시 전체화면으로 광고 보여주기

import {
AdEventType,
InterstitialAd,
TestIds,
} from "react-native-google-mobile-ads";

  const onSubmit = () => {
    if (selectedEmotion === "" || feelings === "") {
      return Alert.alert(
        "이모지와 내용 모두 적어주세용.",
        "안 적으면 아쉽게 된거죵",
      );
    }
    realm?.write(() => {
      realm.create("Feeling", {
        _id: Date.now(),
        emotion: selectedEmotion,
        message: feelings,
      });
    });

    const interstitialAd = InterstitialAd.createForAdRequest(
      TestIds.INTERSTITIAL,
      {
        requestAgent: "CoolAds",
      },
    );

    const unsubscribe = interstitialAd.addAdEventListener(
      AdEventType.LOADED,
      () => {
        interstitialAd.show();
      },
    );

    interstitialAd.addAdEventListener(AdEventType.CLOSED, () => {
      unsubscribe();
      goBack();
    });

    interstitialAd.load();
  };

 

 

Reward

import {
  AdEventType,
  RewardedAdEventType,
  RewardedInterstitialAd,
  TestIds,
} from "react-native-google-mobile-ads";

const onSubmit = () => {
    if (selectedEmotion === "" || feelings === "") {
      return Alert.alert(
        "이모지와 내용 모두 적어주세용.",
        "안 적으면 아쉽게 된거죵",
      );
    }

    const cleanup = () => {
      unsubscribeLoaded();
      unsubscribeRewarded();
      unsubscribeClosed();
    };

    const rewardedInterstitialAd = RewardedInterstitialAd.createForAdRequest(
      TestIds.REWARDED_INTERSTITIAL,
    );

    const unsubscribeLoaded = rewardedInterstitialAd.addAdEventListener(
      RewardedAdEventType.LOADED,
      () => rewardedInterstitialAd.show(),
    );

    const unsubscribeRewarded = rewardedInterstitialAd.addAdEventListener(
      RewardedAdEventType.EARNED_REWARD,
      () => {
        realm?.write(() => {
          realm.create("Feeling", {
            _id: Date.now(),
            emotion: selectedEmotion,
            message: feelings,
          });
        });
      },
    );

    const unsubscribeClosed = rewardedInterstitialAd.addAdEventListener(
      AdEventType.CLOSED,
      () => {
        cleanup();
        goBack();
      },
    );

    rewardedInterstitialAd.load();
  };