Блог

Главная - Вопросы по программированию - twitter: изображение не отображается для Vue.js применение

twitter: изображение не отображается для Vue.js применение

#vue.js #twitter #seo

#vue.js #Twitter #seo

Вопрос:

У меня возникли проблемы с твиттер-картой Vue.js применение. Когда я запускаю URL-адрес через средство проверки карты Twitter, все проверки проходят, но изображение не отображается.

Я просмотрел руководство по устранению неполадок из Twitter и применил приведенные ниже изменения к изображению, но я все еще не мог решить проблему. https://twittercommunity.com/t/card-error-unable-to-render-or-no-image-read-this-first/62736

  • Соотношение изображений 2: 1
  • размер изображения: 252 КБ
  • абсолютный путь для URL: https://speakher.jp/banner_twitter.png
  • curl -v -A Twitterbot возвращает код состояния 200

Вот как я определяю изображение в index.html файле проекта. Изображение сохраняется в общедоступной папке.

 <meta name="twitter:image" content="https://speakher.jp/banner_twitter.png">

Есть ли у вас какие-либо указания на то, что может быть причиной проблемы?

Ответ №1:

Проверка валидатора карты Twitter прямо сейчас показывает правильное изображение. Иногда карта, которую вы видите, кэшируется, поэтому, если вы хотите просмотреть последнюю версию изображения, просто добавьте параметр со случайным именем и (необязательно) случайным значением.

Для ссылки https://speakher.jp например, простое добавление небольшого случайного параметра заставит Twitter загрузить последнюю версию изображения. Это должно загрузить ту же страницу, поскольку параметр ничего не означает (обычно).

 https://speakher.jp?000000000001

Вы также можете использовать этот же метод при публикации вашей фактической ссылки в Twitter. Это гарантирует, что Twitter всегда будет использовать последний предварительный просмотр карты.

Я получил эту карту от валидатора. Похоже, это соответствует изображению в предоставленной вами ссылке. Скриншот карты

Комментарии:

1. Это здорово, большое вам спасибо! Итак, что вы сделали, проверив тот же URL-адрес со случайным параметром в конце, очистив кеш?

2. @RossellaFerrandino На самом деле нет. По сути, это одна и та же ссылка (или, по крайней мере, они указывают на одну и ту же цель, вашу index.html страницу), но Twitter не видит ее таким образом, поскольку произошли изменения в параметрах запроса. Это приводит к тому, что Twitter загружает страницу в том виде, в каком она отображается в Интернете, а не в каком-то кеше. Технически это не очищает кеш (но Twitter автоматически делает это через некоторое время), но гарантирует, что последняя страница будет проанализирована валидатором.