invertase / react-native-google-mobile-ads

React Native Google Mobile Ads enables you to monetize your app with AdMob.
https://docs.page/invertase/react-native-google-mobile-ads
Other
686 stars 139 forks source link

[🐛] The requested InterstitialAd has not loaded - iOS #205

Closed bastienlandry1 closed 1 year ago

bastienlandry1 commented 2 years ago

Issue

I am trying to setup an interstitial Ad on iOS. I am using ca-app-pub-3940256099942544/4411468910 for development and it works fine, both on simulator and real device. [ I am using an iPhone SE, iOS 15.0.2 to test].

When I am using the ad Unit Id from apps.admob.com website, it works fine on the simulator but it crashes on the real device. The error message is the following:

[Error: InterstitialAd.show() The requested InterstitialAd has not loaded and could not be shown.]

I tried to trigger manually the load and the show methods, but the ad did not load. I tried to use hooks, following the guide https://docs.page/invertase/react-native-google-mobile-ads/displaying-ads-hook, but I still couldn't succeed.

Notes:


Project Files

Javascript

ad.js:

export const BannerComponent = ({
  handleClose,
  showBanner,
  timestamp,
}: {
  handleClose: Function;
  showBanner: any;
  timestamp?: string;
}) => {
  const [loaded, setLoaded] = useState(false);
  useEffect(() => {
    const unsubscribe = interstitial.addAdEventsListener(
      ({ type, payload }) => {
        if (type === AdEventType.LOADED) {
          setLoaded(true);
        }
        if (type === AdEventType.CLOSED) {
          console.log("ad closed");
          setLoaded(false);

          //reload ad
          interstitial.load();
        }
      }
    );

    // Start loading the interstitial straight away
    interstitial.load();

    // Unsubscribe from events on unmount
    return unsubscribe;
  }, []);

  useEffect(() => {
    if (showBanner) {
      show();
    }
  }, [showBanner]);

  const show = async () => {
    try {
      await interstitial.show();
      interstitial.addAdEventListener(AdEventType.CLOSED, () => {
        handleClose();
      });
    } catch (e) {
      console.log("e", e);
      handleClose();
    }
  };

  return (
    <View style={styles.container}>{showBanner && <ActivityIndicator />}</View>
  );
};

package.json:

{...,
 "react-native-google-mobile-ads": "^7.0.1"}

wjaykim commented 2 years ago

Hi, make sure your ad has loaded before you show the ad to user. For example, if user presses button before the ad loads, just don't show the ad and continue app's next behavior. Or, take enough time before user can call a action that shows an ad.

bastienlandry1 commented 2 years ago

Hi, In fact, no matter how long I wait, the ad does not load. Since it works fine on iOS simulator and Android, I don't understand the issue.

wjaykim commented 2 years ago

Then check if the ad loading has failed. It could be the case.

leo0grau commented 1 year ago

@bastienlandry1 did you solve this ? i am have the same problem

bastienlandry1 commented 1 year ago

@leo0grau no; the issue is still there

github-actions[bot] commented 1 year ago

Hello 👋, to help manage issues we automatically close stale issues.

This issue has been automatically marked as stale because it has not had activity for quite some time.Has this issue been fixed, or does it still require attention?

This issue will be closed in 15 days if no further activity occurs.

Thank you for your contributions.