Ad

HashHistory, _escaped_fragment_, And Google

- 1 answer

I've been working with React Router for some time now and I've been using hashHistory to handle routing. At some point I am going to transition the app to browserHistory, but I'm curious as to why Google's "Fetch as Google" feature does not appear to work for anything other than the root route (/). It's clear that it's rendering something, just not the routes not handled by the server. (Image below)

enter image description here

I see that Google has deprecated their AJAX crawling scheme, which leads me to believe that I no longer need to deal with ?_escaped_fragment_=, but even so, I cannot get Google to render any other routes.

For example, the site is www.learnphoenix.io and the lessons are listed under www.learnphoenix.io/#/phoenix-chat/lessons. Yet, Google's Fetch as Google feature in webmaster redirects to the homepage and only renders the homepage. Using _escaped_fragment_ leads to the same result.

Is there a way to allow Google to index my site using hashHistory, or do I just have to accept that only my homepage will be indexed until I switch to browserHistory?

Ad

Answer

By default, it seems that google ignores url fragments (#). According to this article, which may be dated, using #! will tell google that the fragments can be used to define different canonical pages.

https://www.oho.com/blog/explained-60-seconds-hash-symbols-urls-and-seo

It's worth a shot, though Hashbang isn't supported by ReactRouter, again, because its supposed to be deprecated.

A better option might be to just bite the bullet and use browserHistory (pushState) in your react-router. The problem with that is if you're running a static server-less app, paths like /phoenix-chat/lessons will return a 404. In AWS, there is a hack around that too. Setting your 404 page to be your app index page.

http://blog.boushley.net/2015/10/29/html5-deep-link-on-amazon-s3/

Feels dirty, but again, worth a shot. Hopefully there's something of value in this answer for you!

Ad
source: stackoverflow.com
Ad