使用 javascript 在 p(react) 项目中实施 Google Adsense

Question

我有一个问题，我花了很多时间来解决这个问题。我正在尝试将 Google Adsense 代码添加到我的 Preact 项目中，它的工作方式与 React 相同。我的状态停留在：“您的网站需要改进”。附加信息说明 Google 找不到代码。尽管我已经添加了它（以多种方式）。

我发现每次这行：

<script data-ad-client="ca-pub-#####" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>

转换为这一行：

<script data-ad-client="ca-pub-#####" async="" src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js" data-checked-head="true"></script>

这就是我尝试添加代码的方式：

选项 1：在我的 app.js 文件中

componentDidMount() {
        //SetAdsense
        let script = document.createElement('script');
        script.setAttribute('data-ad-client','ca-pub-########' );
        script.setAttribute('async');
        script.src = "https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js";           
        document.getElementsByTagName('head')[0].appendChild(script);
}

选项 2：使用头盔

<Helmet>
   <script data-ad-client="ca-pub-#####" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
</Helmet>

知道如何让 Google 在脑海中看到提供的 Adsense 代码吗？

更新 1 2020 年 7 月 23 日 我刚刚发现未实现 Adsense 的原因与我实现 Adsense 代码段的方式无关。这种假设的 2 个原因：

Adsense has unapproved my website with the message: No content provided (which is strange because I've tested the crawlresults in the Google Webmaster tools and it crawls my website like a charm).
This solution has the same changes in the snippet and the Ads are still working.
https://react-adsense.xmplaylist.com/

所以我的问题可能与 Preact（或任何 JS 框架的使用）有关。我还不能弄清楚为什么，因为我预渲染了我的所有页面（使用 json 文件）并且运行 preact build 应该自动使用那个 json 来预渲染所有这些页面对吗？

我的预渲染-urls.json 看起来像这样：

[{  
    "url": "/",
    "title": "Homepage"
  },
  {  
    "url": "/error",
    "title": "ErrorPage"
  },
  {  
    "url": "/other",
    "title": "Other"
  }
 etc.etc.etc.

更新 2 24/7/2020

如果我打开一个随机页面>index.html 它在 Chrome 中看起来像这样（见屏幕截图）。我很确定这就是 Google Adsense 请求得到 disaproved.How 的原因我可以预呈现包含呈现内容的页面吗？所有静态内容在 screenshot.All 中可见，动态内容来自 JSON 文件，该文件由 javascript 加载。我使用 URL 作为键来确定应该显示哪些内容。

亲切的问候！

Answer 1

通过将设置内容的函数移动到 componentWillRender() 解决了这个问题。所以我面临的问题与生命周期相关。

使用 javascript 在 p(react) 项目中实施 Google Adsense

Implementing Google Adsense inside a p(react) project using javascript

html

javascript

adsense

typescript

reactjs