הגדרת מודעות מעברון

מודעות מעברון הן מודעות במסך מלא שמופיעות בנקודות מעבר באפליקציה, למשל בין מסכים או במהלך ההשהיה בין שלבים במשחק. המשתמשים יכולים ללחוץ על המודעה כדי לעבור ליעד, או לסגור את המודעה ולחזור לאפליקציה. פרטים נוספים זמינים בהנחיות למודעות מעברון ובמקרה לדוגמה.

כדי למנוע עיכוב בהצגת המודעות ולוודא שהמודעה זמינה כשהמעבר מתרחש, Google Mobile Ads SDK for React Native משתמש בטעינת מודעות מראש כדי לנהל את הטעינה ברקע, את השמירה במטמון ואת חידוש המלאי במאגר הנתונים הזמני.

במדריך הזה מוסבר איך לשלב מודעות מעברון באפליקציית React Native.

דרישות מוקדמות

לפני שממשיכים, צריך לבצע את הפעולות הבאות:

Android 

ca-app-pub-3940256099942544/1033173712

iOS 

ca-app-pub-3940256099942544/4411468910

הסבר על טעינת מודעה מראש

טעינת מודעות מראש ב-Google Mobile Ads SDK for React Native מאפשרת לטעון מודעות ולשמור אותן במטמון באופן אוטומטי.

היתרונות של טעינת מודעות מראש:

  • ניהול קובצי עזר: שמירה על קובצי העזר עד להצגת המודעות.
  • טעינה מחדש אוטומטית: טעינה של מודעה חדשה כשאחת מהמודעות נשלפת מהמטמון.
  • ניסיונות חוזרים מנוהלים: טעינה של מודעה חדשה אם טעינת המודעה הקודמת נכשלה.
  • טיפול בתפוגה: רענון המודעות לפני שהתוקף שלהן פג.
  • אופטימיזציה של המטמון: אופטימיזציה של סדר המטמון כדי להציג את המודעה בעלת העדיפות הגבוהה ביותר.

כדי לטעון מודעות באופן ידני, עיינו במדריך טעינה של מודעת מעברון אחת.

התחלת הטעינה מראש

כדי להתחיל לטעון מראש מודעות, מפעילים את השיטה InterstitialAdPreloader.start ומעבירים את הערך של preloadId, את הגדרות התצורה ואת פונקציות ה-callback של האירועים כדי לעקוב אחרי שינויים במצב המאגר:

export function startPreloader(
  adUnitId: string,
  preloadId: string,
  customPreloadCallback?: PreloadCallback,
): boolean {
  try {
    const started = InterstitialAdPreloader.start(
      preloadId,
      {
        request: {adUnitId},
        bufferSize: 2,
      },
      {
        // Called when an ad is preloaded into the buffer.
        onAdPreloaded: (metadata) => {
          console.log(`Interstitial ad preloaded for ${metadata.preloadId}`);
          customPreloadCallback?.onAdPreloaded?.(metadata);
        },
        // Called when an ad fails to preload.
        onAdFailedToPreload: (error: LoadAdError) => {
          console.error('Failed to preload interstitial ad:', error.message);
          customPreloadCallback?.onAdFailedToPreload?.(error);
        },
        // Called when all preloaded ads in the buffer have been shown.
        onAdsExhausted: () => {
          console.log('Preload buffer exhausted for interstitial ads.');
          customPreloadCallback?.onAdsExhausted?.();
        },
      },
    );
    return started;
  } catch (error) {
    console.error('Error starting interstitial ad preloader:', error);
    return false;
  }
}

מזהה טעינה מראש הוא מחרוזת שמזהה באופן ייחודי הגדרה של טעינת מודעות מראש. אם אתם משתמשים במזהה יחידת מודעות להגדרה אחת של טעינה מראש באפליקציה, השתמשו במזהה יחידת המודעות הזה כמזהה הטעינה מראש. אם האפליקציה דורשת כמה טעינות מראש לאותו מזהה יחידת מודעות, צריך להעביר מחרוזות נפרדות לכל מזהה של טעינה מראש.

כשהאפליקציה שולפת מודעה שנטענה מראש מהמאגר, Google Mobile Ads SDK for React Native מבקשת מודעה חלופית ברקע כדי למלא מחדש את המאגר. אם לא נשארו מודעות שנטענו מראש במאגר, Google Mobile Ads SDK for React Native מפעיל את פונקציית ה-callback‏ onAdsExhausted.

מגבלות על טעינה מראש למטמון

‫Google Mobile Ads SDK for React Native אוכפת מגבלה על המספר הכולל של מודעות שנטענות מראש בכל האפליקציה, בכל יחידות המודעות ומזהי הטעינה מראש:

  • מגבלת ברירת המחדל: Google שומרת בזיכרון עד שש מודעות שנטענו מראש. המגבלה הזו משותפת לכל הפורמטים ולכל המזהים של הטעינה מראש.
  • מאגר מומלץ: שתי מודעות שנטענות מראש לכל מזהה טעינה מראש.

אם האפליקציה מגיעה למגבלה שחלה על כל האפליקציה, בקשות ברקע למודעות שנטענו מראש מושהות עד שהמודעות הקיימות נשלפות מהמטמון או נמחקות. בנוסף, הטעינה מראש מושהית באופן זמני בזמן שמודעה במסך מלא מוצגת באופן פעיל על המסך.

דגימה והצגה של המודעה

לפני שמציגים מודעה, צריך לוודא שיש מודעה זמינה על ידי הפעלת ה-method‏ InterstitialAdPreloader.isAdAvailable. כדי לאחזר את המודעה, צריך לבצע קריאה ל-method‏ InterstitialAdPreloader.pollAd.

כדי להאזין לאירועי הצגה, כמו סגירת מודעות או כשלים בהצגה, מגדירים את המאפיין adEventCallback במופע של המודעה לפני שקוראים ל-method‏ show.

בדוגמה הבאה, המערכת בודקת אם יש מודעה זמינה ומאזינה לאירועי הצגה במסך מלא לפני שהיא מציגה את המודעה:

export function showPreloadedAd(
  preloadId: string,
  customAdEventCallback?: FullScreenAdEventCallback,
) {
  if (InterstitialAdPreloader.isAdAvailable(preloadId)) {
    const ad = InterstitialAdPreloader.pollAd(preloadId);
    if (ad) {
      ad.adEventCallback = {
        // Called when the ad is presented on screen.
        onAdShowedFullScreenContent: () => {
          console.log('Preloaded interstitial ad showed full screen content.');
          customAdEventCallback?.onAdShowedFullScreenContent?.();
        },
        // Called when the ad is closed by the user.
        onAdDismissedFullScreenContent: () => {
          console.log('Preloaded interstitial ad dismissed.');
          customAdEventCallback?.onAdDismissedFullScreenContent?.();
          ad.destroy();
        },
        // Called when presentation fails.
        onAdFailedToShowFullScreenContent: (error) => {
          console.error('Preloaded interstitial ad failed to show:', error);
          customAdEventCallback?.onAdFailedToShowFullScreenContent?.(error);
          ad.destroy();
        },
        // Called when an impression is recorded.
        onAdImpression: () => {
          console.log('Preloaded interstitial ad recorded an impression.');
          customAdEventCallback?.onAdImpression?.();
        },
        // Called when the user taps the ad.
        onAdClicked: () => {
          console.log('Preloaded interstitial ad was clicked.');
          customAdEventCallback?.onAdClicked?.();
        },
        // Called when the ad is estimated to have earned money.
        onAdPaid: (adValue) => {
          console.log(
            `Preloaded interstitial ad paid: ${adValue.amountMicros}` +
              ` ${adValue.currencyCode}`,
          );
          customAdEventCallback?.onAdPaid?.(adValue);
        },
      };
      ad.show();
    }
  } else {
    console.log('No preloaded interstitial ad available in buffer.');
  }
}

כדי לפנות זיכרון ומשאבים, צריך להפעיל את ה-method‏ ad.destroy בקריאות החוזרות (callbacks) של onAdDismissedFullScreenContent ו-onAdFailedToShowFullScreenContent.

קוראים את פרטי התשובה

כדי לבדוק את פרטי התגובה של המודעה הבאה שנטענה מראש בלי להסיר את המודעה מהמטמון, מפעילים את ה-method‏ InterstitialAdPreloader.peekAdResponseInfo:

export function peekPreloadedAdResponseInfo(preloadId: string) {
  if (InterstitialAdPreloader.isAdAvailable(preloadId)) {
    const responseInfo = InterstitialAdPreloader.peekAdResponseInfo(preloadId);
    if (responseInfo) {
      console.log('Next preloaded ad response info:', responseInfo);
    }
  }
}

אם יש מודעה זמינה, השיטה peekAdResponseInfo מחזירה אובייקט ResponseInfo שמכיל מידע על מקור המודעות שנטען ועל מתאמי הרשת.

מחיקת משאבים

אם אתם לא צריכים יותר להציג מודעות למזהה טעינה מראש ספציפי בשאר הסשן, אתם יכולים להפעיל את ה-method‏ InterstitialAdPreloader.destroy. התהליך הזה מפסיק את הטעינה מראש של מזהה הטעינה מראש הזה ומשחרר מהזיכרון מודעות שנטענו מראש ולא נעשה בהן שימוש.

הדוגמה הבאה מפסיקה את הטעינה מראש:

export function destroyPreloader(preloadId: string) {
  InterstitialAdPreloader.destroy(preloadId);
}

אחרי שהמשתמש סוגר את המודעה או אם המודעה לא מוצגת, צריך להשמיד מופעים ספציפיים של מודעות שנדגמו. פרטים נוספים זמינים במאמר דגימה והצגה של המודעה.

לצפייה בדוגמה המלאה

הרכיב לדוגמה הבא מתחיל לטעון מראש בזמן ההרכבה, עוקב אחרי מספר המודעות הזמינות ומספק אמצעי בקרה להצגת מודעות מעברון שנטענו מראש:

export function InterstitialScreen() {
  const [numAdsAvailable, setNumAdsAvailable] = useState<number>(0);
  const [status, setStatus] = useState<string>('Initializing Preloader...');

  const refreshAdCount = () => {
    const count = InterstitialAdPreloader.getNumAdsAvailable(PRELOAD_ID);
    setNumAdsAvailable(count);
  };

  useEffect(() => {
    // Start preloading interstitial ads on component mount
    startPreloader(INTERSTITIAL_AD_UNIT_ID, PRELOAD_ID, {
      onAdPreloaded: () => {
        refreshAdCount();
        setStatus('Ad preloaded and ready!');
      },
      onAdFailedToPreload: (error) => {
        setStatus(`Preload failed: ${error.message}`);
      },
      onAdsExhausted: () => {
        refreshAdCount();
        setStatus('Preload buffer exhausted.');
      },
    });
    setStatus('Preloader started.');

    // Clean up preloader resources on component unmount
    return () => {
      destroyPreloader(PRELOAD_ID);
    };
  }, []);

  const handleShow = () => {
    showPreloadedAd(PRELOAD_ID, {
      onAdDismissedFullScreenContent: () => {
        setStatus('Ad dismissed.');
      },
      onAdFailedToShowFullScreenContent: (error) => {
        setStatus(`Failed to show ad: ${error.message}`);
      },
    });
    setStatus('Showing preloaded ad...');
    refreshAdCount();
  };

  return (
    <View style={styles.container}>
      <Text style={styles.title}>Preload Interstitial Ads</Text>
      <Text style={styles.status}>Status: {status}</Text>
      <Text style={styles.status}>Ads Available: {numAdsAvailable}</Text>
      <View style={styles.buttonGroup}>
        <Button
          title="Show Preloaded Ad"
          onPress={handleShow}
          disabled={numAdsAvailable === 0}
        />
      </View>
    </View>
  );
}

מחליפים את מה שכתוב בשדות הבאים:

  • ‫INTERSTITIAL_AD_UNIT_ID במזהה יחידת המודעות.
  • ‫PRELOAD_ID במזהה של הטעינה מראש.

השלבים הבאים

אחרי שמשלבים מודעות מעברון, כדאי לעיין בנושאים הבאים: