Thiết kế website giá rẻ

Question

I’m working on integrating AdMob into my React Native app using the react-native-google-mobile-ads library. I’ve set up everything according to the documentation, but I’m encountering a couple of issues.

Setup
AdMob Account: I created an AdMob account and obtained ad unit IDs for interstitial and banner ads.
App ID: Added the AdMob App ID to the app.json file.
Code
Here’s the relevant part of my code where I set up the interstitial and banner ads:

import React, { useEffect, useState } from 'react';
import { Button, Alert, View } from 'react-native';
import {
  BannerAd,
  BannerAdSize,
  InterstitialAd,
  AdEventType,
  MobileAds,
  TestIds,
} from 'react-native-google-mobile-ads';

// Set up ad unit ID
const adUnitId = __DEV__ ? TestIds.INTERSTITIAL : 'ca-app-pub-7083880807910504/7362498272';

// Create an InterstitialAd instance
const interstitial = InterstitialAd.createForAdRequest(adUnitId, {
  keywords: ['fashion', 'clothing'],
});

const App = () => {
  const [loaded, setLoaded] = useState<boolean>(false);
  const [retryCount, setRetryCount] = useState<number>(0);
  const [maxRetries, setMaxRetries] = useState<number>(5);

  useEffect(() => {
    const loadAd = () => {
      interstitial.load();
    };

    const handleLoaded = () => {
      console.log('Ad Loaded');
      setLoaded(true);
      setRetryCount(0);
    };

    const handleError = (error: any) => {
      console.error('Ad Failed to Load:', error);
      if (error.code === 'no-fill' && retryCount < maxRetries) {
        const nextRetryCount = retryCount + 1;
        const delay = Math.min(30000, 1000 * 2 ** nextRetryCount);
        setRetryCount(nextRetryCount);
        setTimeout(loadAd, delay);
      } else {
        console.log('Ad failed to load after max retries');
      }
    };

    const handleClosed = () => {
      console.log('Ad Closed');
      setLoaded(false);
      loadAd();
    };

    const unsubscribeLoaded = interstitial.addAdEventListener(AdEventType.LOADED, handleLoaded);
    const unsubscribeError = interstitial.addAdEventListener(AdEventType.ERROR, handleError);
    const unsubscribeClosed = interstitial.addAdEventListener(AdEventType.CLOSED, handleClosed);

    loadAd();

    return () => {
      unsubscribeLoaded();
      unsubscribeError();
      unsubscribeClosed();
    };
  }, [retryCount, maxRetries]);

  const showInterstitial = () => {
    if (loaded) {
      interstitial.show();
      setLoaded(false);
    } else {
      console.log('Interstitial ad not loaded yet');
      Alert.alert('Ad Not Ready', 'Please try again later.');
    }
  };

  const showAdInspector = async () => {
    try {
      await MobileAds().openAdInspector();
    } catch (error: any) {
      console.error('Failed to open Ad Inspector:', error);
      Alert.alert('Error', 'Failed to open Ad Inspector.');
    }
  };

  return (
    <View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
      <Button title="Show Interstitial Ad" onPress={showInterstitial} />
      <Button title="Open Ad Inspector" onPress={showAdInspector} />
      <BannerAd
        unitId={__DEV__ ? TestIds.BANNER : 'ca-app-pub-7083880807910504/1234567890'}
        size={BannerAdSize.FULL_BANNER}
        requestOptions={{
          requestNonPersonalizedAdsOnly: true,
        }}
        onAdFailedToLoad={(error) => console.error('Banner Ad Failed to Load:', error)}
      />
    </View>
  );
};

export default App;

Issues : Banner Ad Failed to Load: [Error: [googleMobileAds/error-code-no-fill] The ad request was successful, but no ad was returned due to lack of ad inventory.]
Banner Ads: Banner ads are not showing, and I’m not sure if there’s a problem with the unit ID or the setup.
Steps Taken
Verified ad unit IDs.
Added AdMob App ID to app.json.
Checked if the ad units are set up correctly in the AdMob console.
Can someone help me troubleshoot these issues? Any advice on how to resolve the RequestOptions error and ensure that the ads display correctly would be greatly appreciated.

Thanks in advance!

Danh mục