Мне как-то пришлось столкнуться с одной проблемой, а именно с проблемой, которая была связана с возвратом ошибки после развертывания в продакшене различных обновлений, созданных на Vuejs+Nuxtjs. Данная ошибка возникает чуть меньше минуты, но роботы кэшируют это дело на всех страницах примерно 2-3 дня, из-за этого поисковики возвращают старые метаданные и как следствие сайт проседает в выдаче.
Надеюсь, мое решение поможет многим, кто столкнется с такой же проблемой и не будет тратить на нее много времени, потому что эта проблема часто возникает, если вы используете Nuxt.js в режиме SSR, а описания ее решения я не нашел на сайте.
Интернет. Что происходит и почему возникает эта ошибка? Я начал в этом разбираться.
Первое, что я сделал, это начал анализировать, как именно происходит рабочий процесс при SSR. Да, я точно знаю, как это работает, но есть один момент. как в одной юмористической программе:
«Когда вы найдете это место, вы поймете, что это не то место».А если серьезно, вот оно есть проблемы , он говорит, что маршрутизатор не определен в компоненте RouterLink на страницах Google WebCache. Потратив кучу времени, коллега создал компонент, который проверяет, отображается ли $router, и, если нет, возвращает обычную ссылку.
Казалось бы, проблема решена, но как говорится
"это не то место"Я снова попытался уловить ошибку с нашей стороны.
Я отладил весь процесс и понял, что ошибка в Nuxt в данном случае не является ошибкой.
Проблема оказалась в алгоритме кеширования самого Google и Яндекса.
Позвольте мне показать вам на примере Google. Ошибка, которая стоила потери времени, оказалась в том, что Goole каждый раз сохраняет кеш страниц по-разному, а точнее, сохраняет их двумя способами:
- Например, Google может при обновлении своего кеша загружать только статические данные, а все ссылки на JavaScript (JS) делать на наш сайт, поэтому, когда на нашем сайте после обновления не осталось JS-модулей от предыдущего обновления, вполне логично, что JS не был загружен.
Кэш Google показывает статические данные пользователя, но не позволяет пользователю ничего нажать, так как нет JS. При нажатии на любой интерактивный элемент, кроме обычной ссылки, мы получим страницу ошибки от самого Google об отсутствии страницы.
Эту проблему можно решить очень просто, просто увеличив время кеширования JS хотя бы на 7 дней.
2. В другом случае Google собирает в кэш не только статический контент, но и весь JS. Поэтому при работе в кеше JS-модули будут пытаться работать с URL-адресом так же, как и на обычном сайте, но поскольку путь URL-адреса будет другой, то JS-модули не понимают, по какому пути должна работать маршрутизация в Nuxt. .
Поэтому, когда мы нажимаем на любой интерактивный элемент, мы получаем на нашем сайте страницу с ошибкой 404.
Решение, которое я нашел, очень простое, я создал страницу поиска (для Google) и страницу поиска yandbtm (для Яндекса), в которых начал парсить входящий URL и переходить по этому URL на наш сайт. Это позволило нам решить проблему с SEO и не дать сайту провалиться в результатах поиска.
На всякий случай вот ссылка на github GitHub с готовыми страницами для Google и Яндекс.
Я постарался сделать это максимально просто, думаю сложностей с этим не возникнет. Страницы необходимо размещать в страницах, чтобы Nuxt создавал для них маршрутизацию, но вы это уже знаете.
Линкедин Теги: #Google #Разработка сайтов #JavaScript #vue.js #yandex.ru #SEO #SEO #решение проблем #seo продвижение #nuxt.js
-
Гипемоты
19 Oct, 24 -
Илья
19 Oct, 24 -
Новая Сборка Оперы 10 (1285)
19 Oct, 24 -
Первый Белорусский Ноутбук
19 Oct, 24