import NestedStatus from'react-nested-status';

const status = getStatusFromRoutes(routerState.routes);
if (status) {
 res.status(status);
}
res.send('\n' +
 ReactDOM.renderToString());< /pre> 
Yes:
 
 
const repsonse = ReactDOM.renderToString(
 
);

const status = getStatusFromRoutes(routerState.routes);
if (status) {
 re s.status(status);
}

const nestedStatus = NestedStatus.rewind();
if (nestedStatus !== 200) {
 res.status( nestedStatus);
}

res.send('\n' + repsonse);
Then, you need a container that serves 404/ Component:

import React, {Component, PropTypes} from'react';
import {connect} from'react-redux';
import connectData from'helpers/connectData';
import {fetchApiData} from'redux/modules/foo/fetchApiData';
import {NotFound} from'containers';

@connectData( null, (getReduxState, dispatch, state, params) => {
 return dispatch(fetchApiData(params.fooId));
})
@connect(
 (reduxState) = > ({
 fooData: reduxState.foo.data,
 })
)
export default class ProductType extends Component {
 static propTypes = {
 fooData : PropTypes.object,
 }

 render() {
 let content;
 // ... whatever your api sends back to indicate this is a 404< br /> if (!this.props.fooData.exists) {
 content = ;
} else {
 content = (
 

 Normal content...
 

 );
 }
 return content;
 }
} 
Finally replace /src/containers/NotFound/NotFound.js
 
 
import React, {Component} from'react';
import NestedStatus from ' react-nested-status';

export default class NotFound extends Component {

 render() {
 return (
 
 

 
Error 404! Page not found.

 

 
 );
 }
}

I have an application that needs to check the backend API before rendering a 404. The routing process works as follows :

Request to enter/{INCOMING_PATH}, the application tries to obtain and present data from api.com/pages/{INCOMING_PATH}.

If the API returns 404, then apply Should return 404. If not, then render the data.

I will not be sold for this use case. {INCOMING_PATH} will be dynamic and may use slashes and extensions in the path. Is this okay? At Reac t Implemented in Router (with proper SSR behavior)? If so, what should I do?

(This question was originally posted on github by another user. They were asked to post here because it was a support request. But it doesn't seem to be. I am now stuck in the exact same problem.)

p>

I used the React Nested Status module to solve this problem.

I am using https://github.com/erikras/ react-redux-universal-hot-example so this code is suitable for this. For a more general solution, see React Nested Status.

Edit server.js:

at the top

import NestedStatus from'react-nested-status';

Replace at the bottom:

 const status = getStatusFromRoutes(routerState.routes);
if (status) {
 res.status(status);
}
res.send('\ n'+
 ReactDOM.renderToString());

Yes:

const repsonse = ReactDOM.renderToString(
 
); 

const status = getStatusFromRoutes(routerState.routes);
if (status) {
 res.status(status);
}

const nestedStatus = NestedS tatus.rewind();
if (nestedStatus !== 200) {
 res.status(nestedStatus);
}

res.send('\n' + repsonse);

Then, you need a container/component that serves 404:

import React, {Component, PropTypes } from'react';
import {connect} from'react-redux';
import connectData from'helpers/connectData';
import {fetchApiData} from'redux/modules/foo/ fetchApiData';
import {NotFound} from'containers';

@connectData(null, (getReduxState, dispatch, state, params) => {
 return dispatch(fetchApiData( params.fooId));
})
@connect(
 (reduxState) => ({
 fooData: reduxState.foo.data,
 })
)
export default class ProductType extends Component {
 static propTypes = {
 fooData: PropTypes.object,
 }

 render() {< br /> let content;
 // ... whatever your api sends back to indicate this is a 404
 if (!this.props.fooData.exists) {
 content = ;
} else {
 content = (
 

 Normal content...
 
< br /> );
 }
 return content;
 }
}

Finally replace /src/containers/NotFound/NotFound.js

import React, {Component} from'react';
import NestedStatus from'react-nested-status';

export default class NotFound extends Component {

 render() {
 return (
 
 

 
 Error 404! Page not found.

 

 
 );
 }
}