react-adsense icon indicating copy to clipboard operation
react-adsense copied to clipboard

Adsense stops loading ads after couple of clientside page navigations

Open marcofranssen opened this issue 5 years ago • 1 comments

When switching pages in my nextjs blog using client side routing, it seems after a few navigations the ads are not showing anymore.

A full page reload resolves this.

I think this is caused by having a maximum number of ads loaded. Probably each navigation needs to do some cleanup on the window object so it behaves like a full page reload.

Anyone else experienced this?

Maybe we need to include some examples for nextjs _app.js or something on how to resolve this.

e.g. This is code I already have in my _app.js, but not sure how to fix google adsense.

export default function App({ Component, pageProps }) {
  const router = useRouter();

  useEffect(() => {
    const handleRouteChange = (url) => {
      console.log(`navigated: ${url}`);
      gtag.pageview(url); // this does the google-analytics pageview tracking.
      // do something with the googleadsense stuff to make it behave like a full page reload.
    };
    router.events.on("routeChangeComplete", handleRouteChange);
    return () => {
      router.events.off("routeChangeComplete", handleRouteChange);
    };
  }, [router.events]);

.........
left for brevity
....

We might also offer a React hook like useAdsense() with instructions on where to add the hook in a nextjs app and where to add it in a plain react app etc.

marcofranssen avatar Jan 17 '21 11:01 marcofranssen

In react-router i used forceRefresh=true to try and solve for this. I did not notice any real differences. My issue is drop off in revenue and missing clicks. I see them reported in Analytics fine but in Adsense I am only getting 30-40% of clicks. This is down from 80% of clicks when using the old server based site in an A/B test.

Anyone else having this issue?

mansoor292 avatar Apr 07 '21 10:04 mansoor292