Пустой список усилителей при подаче из Google - PullRequest
Новая
       7

Пустой список усилителей при подаче из Google

0 голосов
/ 30 ноября 2018

У нас проблема с нашим веб-сайтом AMP, когда кэшируется и обслуживается из Google .

Проблема: список усилителей пуст, не заполнен .

Пожалуйста, убедитесь сами:

  1. визит https://m.graphiccompetitions.com/ ( это наша версия для мобильных устройств / усилителей. Вы увидите, что все работает отлично )

  2. Теперь перейдите на мобильный телефон и выполните поиск ( в Google ) " графических соревнований ".Наш сайт является первым в результатах поиска.Вы увидите логотип AMP рядом с нашим URL.

  3. Нажмите на результат поиска.Google мгновенно предоставит вам наш веб-сайт AMP.Но ... пусто !!! Статьи не отображаются.

Такое же поведение появляется и при поиске, например, "конкурсов иллюстраций".Google предоставит вам нашу версию AMP (https://m.graphiccompetitions.com/illustration),, но, опять же, пусто .

Почему ??

В нашем списке усилителей естьsrc указывает на файл .json. Это проблема?

Опять же, все работает нормально, если вы обращаетесь к веб-сайту напрямую (, например, вставляя его URL ). Но когда ( вкл.mobile ) он обслуживается напрямую из Google, список ампер никогда не заполняется .

Почему ???

Любая идеяили предложение? 10

Ответы [ 2 ]

0 голосов
/ 02 декабря 2018

Спасибо Джеймсу, который указал нам правильное направление.Вот решение, которое мы нашли, используя напрямую .htaccess (, поскольку наш список усилителей указывает на предварительно скомпилированный файл json для максимальной скорости, поэтому нет никакой возможности использовать php для установкиверхние заголовки ) 

<FilesMatch "\.(json)$" >
  Header set Access-Control-Allow-Credentials "true"
  Header set Access-Control-Allow-Origin "*"
  Header always set Access-Control-Allow-Methods "GET"
  Header set Access-Control-Allow-Source-Origin "https://m.graphiccompetitions.com"
  Header set Access-Control-Expose-Headers AMP-Access-Control-Allow-Source-Origin
  Header set AMP-Access-Control-Allow-Source-Origin "https://m.graphiccompetitions.com"
  Header set Access-Control-Max-Age: 43200
  Header set Cache-Control "private, no-cache"
</FilesMatch>

Строка Access-Control-Allow-Origin "*" может быть не идеальной, и мы могли бы использовать 

Header always append Access-Control-Allow-Origin: "m-graphiccompetitions-com.cdn.ampproject.org"
Header always append Access-Control-Allow-Origin: "m-graphiccompetitions-com.cdn.cloudflare.com"
(and so on...)

Но пока подойдет простая звездочка ( и мы установили Access-Control-Allow-Methods только на GET, в любом случае ).

И теперь все работает!Когда Google обслуживает свою кэшированную версию, список amp теперь заполнен правильно.101

Надеюсь, это поможет кому-то еще!

0 голосов
/ 30 ноября 2018

Если вы просматриваете эту страницу из кэша AMP, вы видите, что это связано с несовместимой политикой CORS: https://m -graphiccompetitions-com.cdn.ampproject.org / c / s / m.graphiccompetitions.com

Вы получаете ошибку (я вытащил это из консоли браузера)

Доступ к выборке в 'https://m.graphiccompetitions.com/api/category_all.json?20181130&__amp_source_origin=https%3A%2F%2Fm.graphiccompetitions.com' от источника' https://m -graphiccompetitions-com.cdn.ampproject.org 'заблокировано политикой CORS: в запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin».Если непрозрачный ответ удовлетворяет вашим потребностям, установите режим запроса «no-cors», чтобы получить ресурс с отключенным CORS.

Когда Google кэширует страницу, эти внутренние запросы теперь технически имеют перекрестный источник ибольше не является внутренним для вашего собственного сервера.Вы можете увидеть в ошибке, что он не может извлечь из cdn.ampproject.org, вам нужно настроить политику CORS, чтобы Google мог получить доступ к контенту.

Подробнее о том, как ввести политику, которая будет работать с AMP , можно узнать здесь .

...