React-Router: Redirect my url from hashHistory to browserHistory

Question

I've recently make a change to my code to use browserHistory instead of hashHistory with my React-Router. Although some users of the website I work on might have bookmarked the URL with the hash.

The old url looks like www.mywebsite.com/#/page?query=param and I want to make sure if someone bookmarked it, it gets redirected to www.mywebsite.com/page?query=param .

It looks like this redirect is not possible with .htaccess so I was wondering what would be the cleanest way to do that?

Thanks.

Answer 1

In you main component, the one were you presumably render {this.props.children} you can get access to the current url by calling this.props.location.pathname and if the url contains a hash, you can strip it and redirect the user to the url they wanted to go to.

This will only work when the user is first returning to your site from anywhere else, but if they are already on your site and use the bookmark to go elsewhere on the site I dont think this will work. The reason is that the componentDidMount of the main component only fires on initial load or actual page refresh.

Hope this helps.