設定原生廣告

原生廣告提供個別廣告素材資源,例如廣告標題、圖片和提示文字,您可以設定樣式和排列方式,配合應用程式的視覺設計。為處理點擊追蹤、曝光和媒體播放,Google Mobile Ads SDK for React Native 提供下列元件:

如要進一步瞭解如何以符合規定的方式顯示原生廣告,請參閱「使用原生進階格式的原生廣告」一文。

本頁說明如何載入單一和多則原生廣告、管理廣告記憶體和生命週期,以及在 Android 啟用影片廣告硬體加速功能。

必要條件

請先完成下列事項,再繼續操作:

僅適用於搭載 Android

格式 範例廣告單元 ID
原生 ca-app-pub-3940256099942544/2247696110
原生影片 ca-app-pub-3940256099942544/1044960115

iOS

格式 範例廣告單元 ID
原生 ca-app-pub-3940256099942544/3986624511
原生影片 ca-app-pub-3940256099942544/2521693316

載入廣告

如要載入原生廣告,請呼叫 NativeAd.load 方法,並傳入包含廣告單元 ID 的 NativeAdRequest 物件。這個方法會傳回 Promise,如果載入 NativeAd 物件,Promise 會解析;如果載入 LoadAdError 物件,Promise 會拒絕。

以下範例會載入單一原生廣告,成功時傳回載入的廣告,失敗時則記錄錯誤訊息:

export async function loadNativeAd(adUnitId: string): Promise<NativeAd | null> {
  try {
    const ad = await NativeAd.load({adUnitId});
    return ad;
  } catch (error) {
    const loadError = error as LoadAdError;
    console.error('Failed to load native ad:', loadError.message);
    return null;
  }
}

載入及管理原生廣告時,建議您採取下列做法:

  • 限制載入的廣告:原生廣告素材資源會耗用記憶體。只載入使用者即將看到的廣告 (例如接下來的一到兩個廣告刊登位置),而不是一次載入大量廣告。
  • 清除未掛接的廣告:從畫面中移除或替換廣告,或卸載包含廣告的元件時,請呼叫 ad.destroy 方法。這個方法會釋出廣告使用的資源和記憶體。
  • 在一小時內顯示載入的廣告:原生廣告素材會在 60 分鐘後過期。如果載入的廣告在一小時內未顯示,請刪除該廣告並請求新的廣告。

(選用) 載入多則廣告

如要在單一請求中載入多則廣告,請呼叫 NativeAd.loadAds 方法,並傳入 NativeAdRequest 物件、要請求的廣告數量,以及 NativeAdLoadCallback 物件。要求最多可包含五則廣告。

以下範例會請求多個原生廣告,並使用回呼處理每個載入的廣告、載入錯誤和請求完成事件:

export function loadMultipleNativeAds(adUnitId: string, numAds: number): void {
  NativeAd.loadAds({adUnitId}, numAds, {
    // Called when an individual native ad finishes loading.
    onNativeAdLoad: (ad) => {
      console.log('Loaded native ad:', ad.headline);
    },
    // Called when an individual native ad fails to load.
    onAdFailedToLoad: (error) => {
      console.error('Failed to load native ad:', error.message);
    },
    // Called when all requested ads have finished loading.
    onAdLoadingCompleted: () => {
      console.log('All requested native ads finished loading.');
    },
  });
}

如果您在可捲動的動態饋給中顯示廣告,請預先載入廣告。這樣一來,使用者前往廣告時,廣告就會顯示。

啟用硬體加速功能

如要在 Android 的原生廣告檢視區塊中顯示影片廣告,請啟用硬體加速。

Android 預設會啟用硬體加速。應用程式可能會全域停用硬體加速。如果應用程式全面停用硬體加速,請為顯示廣告的 Activity 類別啟用這項設定。

如果啟用全域硬體加速後,應用程式無法正常運作,請針對個別活動控制硬體加速。如要啟用或停用硬體加速,請在 AndroidManifest.xml 檔案中,針對 application 和 activity 元素使用 android:hardwareAccelerated 屬性。

以下範例為應用程式全域啟用硬體加速,但對特定活動停用該功能:

<application android:hardwareAccelerated="true">
    <!-- For activities that use ads, hardwareAcceleration should be true. -->
    <activity android:hardwareAccelerated="true" />
    <!-- For activities that don't use ads, hardwareAcceleration can be false. -->
    <activity android:hardwareAccelerated="false" />
</application>

後續步驟

載入廣告後,請使用 NativeAdView 和 NativeAdMediaView 元件,在 React Native UI 中顯示廣告。詳情請參閱「顯示原生廣告」。