Handling 404s

[lokenx]

Currently it just uses the Hapi default, any ideas how to use something else. I'm trying to figure out how to have React handle 404's and you've most popular Hapi/React combo repo I've stumbled across!

[lynnaloo]

I'm not sure I understanding the question. Do you want to force the route to return 404? Like reply('test').code(404), or how in React would it be able to know the response is 404 and handle it?

[lokenx]

Currently with Mullet if you go to an undefined page you get the Hapi 404 instead of the React 404, which is what I wanted. I actually made it work so I guess I'll explain that too.

I've a Hapi app with two connections, one for API and one for front end, each on different ports. I wanted the front end to allow React to handle 404s, instead of Hapi default. But I was using the directory handler with Inert to serve react which was the problem.

I switched front end route to use a file hander for both a catch all and the js bundle, which allows it to serve all requests on the front end but also handle 404's (as it can now find the js no matter what).

React can be used to handle 404's if you have a catch all route at the bottom:

<Router history={browserHistory}>
    <Route path="/" component={Home} />
    <Route path="/search" component={SearchForm} />
    <Route path="*" component={NotFound} />
</Router>

Hapi routes:

server.route({
    method: 'GET',
    path: '/{param*}',
    handler: {
        file: 'index.html'
    }
});

server.route({
    method: 'GET',
    path: '/bundle.js',
    handler: {
        file: 'bundle.js'
    }
});

Hopefully that makes sense...

[lynnaloo]

:+1: I got you now! Thanks so much for posting your solution because this is a common use-case. Someone else will hopefully find this if they search for the same issue.

I don't have React Router (or a lot of other cool stuff) in this boilerplate because I'm trying to keep it super-simple for beginners, but I love that library. Depending on what I'm trying to do and what libraries I'm using, I may just check the status code on the response from whichever client request library I'm using and then handle it with a Flux action.

[lokenx]

Makes sense! Thanks for the awesome mullet :smiley: