Почему скрипт Google AdSense продолжает возвращать ошибку CORS? - PullRequest
Новая
       10

Почему скрипт Google AdSense продолжает возвращать ошибку CORS?

0 голосов
/ 05 марта 2020

Я пытаюсь разместить AdSense на своей веб-странице, созданной по реакции. Автореклама работает нормально, но ручная реклама возвращает ошибку CORS как в моей среде разработки, так и на производстве.

Access to script at 'https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js' from origin 'http://localhost:3050' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

Я поместил тег script в индекс. html. 

<!DOCTYPE html>
<html lang="ko">

<head>
  <!-- Global site tag (gtag.js) - Google Analytics -->
  <script async src="https://www.googletagmanager.com/gtag/js?id=xxxxxxxx"></script>
  <script>
    window.dataLayer = window.dataLayer || [];

    function gtag() {
      dataLayer.push(arguments);
    }
    gtag('js', new Date());
    gtag('config', 'xxxxxxxx');
  </script>
  <script crossorigin async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
  <meta charset="utf-8" />
  <title>Title</title>
</head>

<body>
  <div id="root"></div>
  <!--
      This HTML file is a template.
      If you open it directly in the browser, you will see an empty page.

      You can add webfonts, meta tags, or analytics to this file.
      The build step will place the bundled scripts into the <body> tag.

      To begin the development, run `npm start` or `yarn start`.
      To create a production bundle, use `npm run build` or `yarn build`.
    -->
</body>

</html>

И файл jsx такой. 

import React, { useEffect } from 'react';
import Grid from '@material-ui/core/Grid'

const MyPage = (props) => {
   
  useEffect(() => {
    (window.adsbygoogle = window.adsbygoogle || []).push({});
  }, []);

  return (
    <Grid
      container
      justify="center"
    >        
        <Grid item xl={3} lg={2}>
            <div style={{
              display: 'flex',
              justifyContent: 'center',
              minWidth: 160,
              maxWidth: 320,
              height: '100%',
              alignItems: 'center',
              flexDirection: 'column'
            }}
            >
              <ins
                className="adsbygoogle"
                style={{ display: 'inline-block', width: '160px', height: '600px' }}
                data-ad-client="xxxxxxxxxx"
                data-ad-slot="xxxxxxxxxxx"
              />
            </div>
        </Grid>  
        <Grid item xl={3} lg={2}>
          <div style={{
            display: 'flex',
            justifyContent: 'center',
            minWidth: 160,
            maxWidth: 320,
            height: '100%',
            alignItems: 'center',
            flexDirection: 'column'
          >
            <ins
              className="adsbygoogle"
              style={{ display: 'inline-block' }}
              data-ad-client="xxxxxxxxxxx"
              data-ad-slot="xxxxxxxxxxxx"
              data-ad-format="auto"
              data-full-width-responsive="true"
            />
          </div>
          )}
        </Grid>
    </Grid>
  );
};

export default MyPage;

Я попробовал Наличие CORS при использовании Google Adsense в веб-приложении React Firebase и попытался использовать библиотеку реагировать-adsense. Однако ни один из них не сработал. Я застрял на этом на 3 дня. Есть ли какое-то решение для этого?

...