react router 2, return 404 status

Question

I am using react router v 2.8.1 and am trying to set up my 404 page for my SPA. I am having trouble getting it to actually send back a 404. I am trying to do this so google will not index that page for me.

So far, I have tried setting a catch all route to get any unknown routes inside my Router -

 <Router>
    ...

    <Route
        path='*'
        status={404}
        getComponent={(location, cb) => {
          require.ensure([], require => {
            const component = require('./components/404/component.jsx').default;

            cb(null, component);
          });
        }}/>
   </Router>

This works fine for showing the content. Via googling, I found some people using the status={404}, however I am not seeing it doing anything for me. Is there a way to force a 404 status back from react router (2.8.1)? Thanks!

You should upgrade to v4, and set up both client and server routers reacttraining.com/react-router/web/guides/server-rendering/… — Adam Azad
– Adam Azad, Commented Sep 26, 2017 at 19:16
@AdamAzad I am fairly limited as there is no server rendering and I am stuck with this version. — ajmajmajma
– ajmajmajma, Commented Sep 26, 2017 at 19:41
you can't trigger a 404 from client side - that needs to come from the server — pizzarob
– pizzarob, Commented Sep 26, 2017 at 20:28

ajmajmajma · Accepted Answer · 2017-09-26 20:37:56Z

2

Since I am not using server rendering/routing , it is not really possible to get a 404 response, atleast from what I can find right now. So my solution is to just add a noIndex meta tag, to prevent google from indexing any 404 page it might come across. I use Helmet js, so in my 404 Component I just do:

<Helmet
    title={'Not Found'}
    meta={[
      {name: 'ROBOTS', content: 'NOINDEX'}
    ]}
  />

Which just translates to:

<meta name="ROBOTS" content="NOINDEX">

This works for me for now, I will leave it here incase anyone runs across the same issue. Unless someone solves this, in which case please submit an answer.

answered Sep 26, 2017 at 20:37

ajmajmajma

14.3k25 gold badges83 silver badges139 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Adam Azad Over a year ago

Be careful of static resource paths. The browser will still parse the response as text/css javascript/application but the content is HTML, and this will trigger an error in console. Happy coding

Collectives™ on Stack Overflow

react router 2, return 404 status

1 Answer 1

1 Comment

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Related