seo Question posted in
Some basic information to get you started with this can be found here.

Server side redirect with ReactJs – SEO

I am trying to issue a server side redirect for certain pages for SEO reasons. The problem I am trying to solve is that some of my pages will get index by google, so if they are deleted or taken offline we want to redirect them to a different page rather than showing 404. What is the best way to achieve such redirects with React Router on the server side(express.js)?

Tags:

3

Answers


  1. 0

    You should have a component which should define routing rules, something like this:

    <Router>
 <Switch>
      <Route path='/login' component= {LoginPage}/>
       ......
 </Switch>
<Router>

    All I am saying is that you should define a wrapper which define the redirect url:

          var redirectToUrl = get url from your logic here;
      var urlComponent = '';
      if ( redirectToUrl )
      {
        urlComponent = <Redirect to={listing}/>;
      }

    Now add this to your url handling page:

    <Router>
    <div>
      {urlComponent}
     <Switch>
          <Route path='/login' component= {LoginPage}/>
           ......
     </Switch>
</div>
    <Router>
    Login or Signup to reply.
  2. 0

    If you are using React Router 4, tou can add Redirect component inside your Page component to redirect pages that are dead. Example: Let’s say that component tried to fetch object from API but got an offline response and stored it in component state:

    import React, { Component } from 'react';
import { Redirect } from 'react-router-dom';

export default class PageComponent extends Component {

    // ... other stuff

    render() {
        if (this.state.page_offline) {
            return (<Redirect to="/some-page-for-offline-data" />);
        }

        return (...); // normal page render
    }

}
    Login or Signup to reply.
  3. 0 
    const redirect = (a,replace) => {
if(a.params.splat == "page1")
    replace("/page2")
}
<Route path="*" ... onEnter={redirect}/>

    in server.js

    match(...,(error, redirectLocation, renderProps) => { 
   ... else if (redirectLocation) { res.redirect(302,`${redirectLocation.pathname}${redirectLocation.search}`...);
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search