在第 3 段后插入 Google Adsense

Question

我正在尝试解决，在 nextjs 中（反应）我如何在文章的第 3 段之后插入 Google Adsense？

基本上我们是这样嵌入内容的

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

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

Answer 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 } }
  }

在第 3 段后插入 Google Adsense

Insert Google Adsense after 3rd paragraph

reactjs

next.js

google-ads-api

adsense