如何使 Google Auto Ads 与 React SSR 应用程序一起使用

Question

我想在我的 React 应用程序中使用 Google Adsense 自动广告。 React 应用程序使用 SSR，我已将 Google 提供给我的代码添加到模板的头部部分，如下所示。

export default ({ markup, css }) => {
  return `<!doctype html>
      <html lang="en">
        <head>
          <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-9999999999999999" crossorigin="anonymous"></script>
          <meta charset="utf-8">
          <meta
            name="viewport"
            content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
          >
          <title>Teach Learn Game</title>
          <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:100,300,400">
          <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
          <style>
              a{
                text-decoration: none;
                color: #bb4d00
              }
          </style>
        </head>
        <body style="margin:0">
          <div id="root">${markup}</div>
          <style id="jss-server-side">${css}</style>
          <script type="text/javascript" src="/dist/bundle.js"></script>          
        </body>
      </html>`;
};

在现场时，我使用 Chrome 工具检查了 html 代码。我可以在代码中看到该行，但不幸的是，我被 Google Adsense 评论拒绝了，说我需要修复一些问题。

来自 Google 的消息指出了这个问题：我们在您的网站上找不到代码。这是因为代码丢失或不完整，或者因为您网站的 URL 不正确。了解更多。

我已经删除了登录的要求，这是一个较早的问题，我有一个合适的 google 帐户。

我确实看到了另一个 Stack Overflow 问题，其中指出 window.adsbygoogle 将与 React 一起使用，但似乎问题更多地与指定广告单元和 [=27= 的实施有关] 在组件 class 中。因为我使用的是自动广告，所以我不认为这会适用，但也许我错了。如果是这样，我将如何更改代码？

无论如何，如果任何有初步接受 Google 自动广告经验的人可以提供帮助，我们将不胜感激。如果您提供代码，请感谢您是否可以使用功能组件，因为我不太了解 class 组件以及大多数示例似乎都在使用 componentDidMount 的使用。

Link 到我的站点：https://tlgamer.herokuapp.com/

Answer 1

Adsense 将在 herokuapp.com 而不是 tlgamer.herokuapp.com 中查找 Adcode，这就是为什么消息来自Google 是“我们无法在您的网站上找到代码。”，如果您不拥有主域，则无法通过子域获利。将您的 SSR 应用切换到顶级域并重新申请 Adsense。

如何使 Google Auto Ads 与 React SSR 应用程序一起使用

How to make Google Auto Ads work with react SSR application

ads

adsense

reactjs

react-ssr