Skip to content

Intégration Reward et Interstitial

Prérequis

Installation

Vous avez deux options pour intégrer le SDK AdsGram.

Insérer le script

Placez le script sad.min.js dans la balise <head> en utilisant ce code :

html
<script src="https://sad.adsgram.ai/js/sad.min.js"></script>

Installer via npm pour React et Vue.

Plus d'informations sur l'intégration depuis les packages dans la documentation pour React et Vue.

bash
npm install @adsgram/react
bash
npm install @adsgram/vue

Initialiser le SDK AdsGram

js
const AdController = window.Adsgram.init({ blockId: "your-block-id" });

IMPORTANT

L'initialisation n'est requise que pour les formats Rewarded et Interstitial. Pour le format Task, l'initialisation n'est pas nécessaire.
Pour les exemples d'intégration du format Task, consultez Intégration Task.

Plus d'informations sur la fonction init dans la section Référence API.

your-block-id — vous l'obtenez depuis votre compte sur https://partner.adsgram.ai
Instructions détaillées sur la façon d'obtenir le blockId dans la section Obtenir un blockId

Afficher la bannière

INFO

Ci-dessous se trouvent des exemples de code pour le format Rewarded. Ces exemples sont également pertinents pour le format Interstitial. La seule différence est que la promesse AdController.show() se résout pour les publicités qui ont été visionnées jusqu'au bout, ainsi que pour celles qui ont été fermées. Un exemple simple est disponible ici

Dans la plupart des cas, le code ci-dessous est utilisé dans le gestionnaire de clic.
Pour des exemples de code avec vanilla js, React, Unity, consultez la section Exemples de code.

js
AdController.show().then((result) => {
    // user watch ad till the end or close it in interstitial format
    // your code to reward user for rewarded format
}).catch((result) => {
    // user get error during playing ad
    // do nothing or whatever you want
})
ts
AdController.show().then((result: ShowPromiseResult) => {
    // user watch ad till the end or close it in interstitial format
    // your code to reward user for rewarded format
}).catch((result: ShowPromiseResult) => {
    // user get error during playing ad or skip ad
    // do nothing or whatever you want
})

result a les types suivants :

ts
interface ShowPromiseResult {
    done: boolean; // true if user watch till the end or close it in interstitial format, otherwise false
    description: string; // event description
    state: 'load' | 'render' | 'playing' | 'destroy'; // banner state
    error: boolean; // true if event was emitted due to error, otherwise false
}

INFO

La showPromise est résolue si l'utilisateur regarde la publicité jusqu'au bout ou la ferme dans le format interstitial, sinon elle est rejetée.

TIP

Enchaînez la promesse avec finally si vous devez ajouter une action supplémentaire après la fin de la lecture de la publicité, son ignorance ou une erreur.

Félicitations, vous venez d'afficher votre première publicité avec AdsGram !

Plus d'informations