在第 3 段之后插入 Google Adsense答案

【问题标题】：Insert Google Adsense after 3rd paragraph在第 3 段之后插入 Google Adsense
【发布时间】：2021-11-01 11:17:20
【问题描述】：

我正在努力解决，在 nextjs (reacts) 中，在文章中说出第 3 段之后，我将如何插入 Google Adsense？

基本上我们像这样嵌入内容

 <Card.Body dangerouslySetInnerHTML={{__html: data.news.content }}>

不知何故，我想在它加载后检查有多少段落并在说 3 个段落之后插入广告。

【问题讨论】：

您找到解决方案了吗？如果是，请分享。

标签： reactjs next.js google-ads-api adsense

【解决方案1】：

为了能够做到以上几点，我实现了以下内容。

  // This also gets called at build time
  export async function getServerSideProps({ params }) {
   
    const res = await fetch(`https://APIDOMAIN.com.au/api-access/news/${params.slug}`)
    const data = await res.json()
    const currentU  = `https://APIDOMIAN.com.au/news/${params.slug}`
     
    if (!data.news || data.news == "null") {
      return {
        notFound: true,
      }
    }


    let paraStr = data.news.content
    let paraArray = paraStr.split("</p>")
    console.log(paraArray);
    let NewsContentText ="";
    paraArray.forEach(myFunction);
    
    function myFunction(item, index) {
   
      if (index & 1){
        NewsContentText += item + '<br> <ins class="adsbygoogle"        style="display:block; text-align:center;"    data-ad-layout="in-article"        data-ad-format="fluid"    data-ad-client="ca-pub-(Google_AD_ID)"    data-ad-slot="(GOOGLEID)"></ins><br>'; 
        }else{
          NewsContentText += item; 
        }
    }
    // Pass post data to the page via props
    return { props: { data,NewsContentText, currentU } }
  }

【讨论】：