数字广告设置 React

为 React Native 应用设置 Google Ad Manager (GAM) 需要将 GAM SDK 集成到您的 React Native 项目中，创建广告单元，设置广告条目和创意，并在您的应用中展示广告。以下是设置 GAM 的分步指南，以帮助您为 React Native 设置 GAM。

步骤 1：创建 Google Ad Manager 账户

如果您没有 Google Ad Manager 账户，您需要通过访问 https://admanager.google.com 并注册来创建一个。

步骤 2：在 Google Ad Manager 中设置应用

1. 登录您的 Google Ad Manager 账户。
2. 在左侧侧边栏中单击“库存”。
3. 在“广告单元”下，单击“广告单元”。
4. 单击“+ 新广告单元”按钮。
5. 填写广告单元详细信息，包括名称、广告类型（例如，横幅、插页式）、大小和定向选项。
6. 保存广告单元，并注意广告单元 ID。

步骤 3：在您的 React Native 应用中集成 GAM SDK

1. 使用 npm 安装 Google Mobile Ads SDK for React Native。

   npm install react-native-google-mobile-ads --save

2. 使用 react-native link 或自动链接（React Native 0.60+）链接模块。

步骤 4：在您的应用中初始化 GAM SDK

在您的应用入口文件（例如 index.js 或 App.js）中导入并初始化 GAM SDK。

import { AppRegistry } from 'react-native';
import { GoogleMobileAds } from 'react-native-google-mobile-ads';

GoogleMobileAds.initialize();

步骤 5：请求和展示广告

1. 在您的 React Native 应用中创建横幅或插页式广告组件。

   import { BannerAd, TestIds, AdEventType } from 'react-native-google-mobile-ads';
   
   
   <BannerAd
       unitId={TestIds.BANNER}
       size={BannerAdSize.BANNER}
       onAdEvent={(event) => {
           if (event.type === AdEventType.LOADED) {
               // Ad has loaded
           }
       }
   } />

2. 用从 GAM 获得的实际广告单元 ID 替换 unitId。

其他步骤

• 使用提供的组件属性和事件监听器自定义广告的外观和行为。
• 对于插页式广告，使用 InterstitialAd 组件创建和展示插页式广告，并添加适当的事件监听器。
• 实现广告事件监听器来处理广告生命周期事件，例如广告加载、广告加载失败、广告点击等。

有关使用 React Native 设置 Google Ad Manager 的更详细信息和指南，请参阅 react-native-google-mobile-ads GitHub 仓库。您还可以检查我们的 github 示例。