3
votes

Peu importe ce que je fais, Google Ads ne peut pas être diffusé dans React

J'ai suivi cet exemple:

https://www.jamesbaum.co.uk/blether/using-google-adsense-with-react/

J'ai ce composant:

<!-- /164808479/Leaderboard -->
        <div id='div-gpt-ad-1536172937182-0' style='height:90px; width:728px;'>
            <script>
                googletag.cmd.push(function() { googletag.display('div-gpt-ad-1536172937182-0'); });
            </script>
        </div>

javascript reactjs adsense

4 commentaires

Mais l'url src est différente, non? //pagead2.googlesyndication.com/pagead/js/adsbygoogle.js vs https://www.googletagservices.com/tag/js/gpt.js ?

Eh bien, oui, j'ai pris celui-là de l'exemple React Google Ads vers lequel j'ai mis le lien en haut de mon message.

D'ACCORD. Alors, pourquoi pensez-vous qu'il utilise la même API Google? Emphase: Pourquoi affirmez-vous que vous comparez des pommes aux pommes?

Je suivais l'exemple du lien vers la lettre, en remplaçant notre emplacement et notre identifiant par celui que nous utilisons dans notre ancienne implémentation. Il semble cependant qu'il existe un décalage flagrant entre les services et la façon dont ils sont utilisés dans notre ancienne application et l'exemple de ce type. J'essaierai de niveler les règles du jeu à ce sujet et de mettre en œuvre nos propres liens API Google.

3 Réponses :

1
votes

Vous avez juste besoin d'attendre, lorsque vous implémentez Adsense pour la première fois, il donnera cette erreur. Il a fallu attendre le lendemain matin pour Adsense pour commencer à afficher des annonces. J'ai mis en œuvre leur type d'annonce responsive.

c / o https://stackoverflow.com/a/38351709/109941

2 commentaires

Nous utilisons déjà AdSense depuis deux ans maintenant. Le code fonctionne dans une ancienne application sans réaction. Mais pas dans l'application de réaction que nous construisons actuellement.

J'ai ajouté le code qui fonctionne pour nous dans l'application non-react

2
votes

Vous obtenez HTTP 400 (c'est-à-dire une mauvaise requête) car les données envoyées aux serveurs publicitaires Google semblent incorrectes.

La valeur data-ad-client doit avoir le format ca-pub-00000000000000 qui est obtenu à partir de la page d'administration adsense. ( Je pense que ce n'est pas votre cas !!! )

Les données que vous fournissez, div-gpt-ad semblent être l'identifiant d'un div pour la balise Google Publisher Tag dont l'ID est / 164808479 / Leaderboard . Donc, pour l'utiliser correctement dans votre application react, vous pouvez utiliser cette bibliothèque: https://github.com / nfl / react-gpt

Vous trouverez ci-dessous le code modifié qui convient à votre cas. Ajoutez simplement react-gpt à votre application de réaction.

import React from "react";
import {Bling as GPT} from "react-gpt";

GPT.enableSingleRequest();

export default class AdBanner extends React.Component {
    render () {
        return (
            <div id="div-gpt-ad-1536172937182-0">
                <GPT
                    adUnitPath="/164808479/Leaderboard"
                    slotSize={[728, 90]}
                />
            </div>
        );
    }
}

Vous pouvez voir le code ci-dessus fonctionner à merveille dans ce lien: https://codesandbox.io/embed/determined-bash-k30nq

0 commentaires

0
votes

Juste pour ceux qui lisent entre les lignes (comme moi) - mettez l'appel push à useEffect au lieu de la ligne jsx comme:

    useEffect(() => {
        window.adsbygoogle = window.adsbygoogle || [];
        window.adsbygoogle.push({});
    }, [])

0 commentaires