Nuxt.js and search engines. Solving SEO problems for Google and Yandex

Linkedin





I had to somehow encounter one problem, namely the problem that is associated with the return of an error after the rollout of various updates created in Vuejs + Nuxtjs in production.





This error occurs for a little less than a minute, but the robots cache this case on all pages for about 2-3 days, because of this, search engines give out old metadata and, as a result, the site sags in the search results.





I hope my solution will help many who encounter the same problem and will not spend a lot of time on it, because this problem often arises if you use Nuxt.js in SSR mode, and I have not found a description of its solution on the Internet.





What is happening and why does this error occur?





I started to figure it out. The first thing I did was start to analyze how exactly the process of working with SSR happens. Yes, I know exactly how it works, but there is one thing ... as in one humorous show:





"When you find this place, you will know that this is not the right place."





But seriously, there are issues , it says that router is not defined in the RouterLink component on Google WebCache pages. After spending a lot of time, a colleague created a component that checks if $ router is rendered and, if it is absent, returns a regular link.





It would seem that the problem is solved, but as they say





"this is not the place"





Again I tried to catch a mistake on our side. Debugged the whole process and realized that the error in Nuxt is not an error in this case.





The problem turned out to be in the caching algorithm of Google and Yandex.





Let me show you with Google as an example.





The mistake, which was worth the loss of time, turned out to be that Goole saves the cache of pages differently each time and, to be precise, it saves them in two ways:





  1. , Google , javaScript (JS) , JS , , JS .





Google- , , JS'a .





, Google





, JS 7 .





2. Google , JS. , JS- URL , , URL , js- , Nuxt. , 404- .





, search ( Google) yandbtm ( Yandex) , URL URL .





SEO .





Just in case, here is a link to github GitHub with ready-made pages for google and yandex. I tried to make it as simple as possible, I think there will be no difficulties with this.





Pages need to be placed in pages for Nuxt to route them, but you already know that.








All Articles