Server Side Redux/React. Express not throwing error

82 Views Asked by pizzarob At 03 April 2025 at 21:09

The initial response from my server was not being served and it was due to an error in my React component, however Express did not throw any error. Here is a snippet of what is happening server side. The code got to this point and then silently failed:

res.status(200).send(html(renderToString(
    <Provider store={store}>
        <RouterContext {...renderProps} />
    </Provider>
), store.getState()));

But there was an error in the component render method. this.props.ui is no longer defined, so an error should've been thrown. Instead of throwing an error it said nothing and just wouldn't load the page.

return (
    <div className={`full-width full-height ${this.props.ui.showBgImage ? 'bg' : ''}`}>
)

Any ideas as to how to get my server to throw an error instead of fail silently?

Original Q&A

There are 1 best solutions below

Thaadikkaaran On 19 December 2016 at 06:43 BEST ANSWER

When you render your page on Server, you have to wrap try catch around renderToString function to catch the errors.

For example,

import React from 'react';
import ReactDOMServer from 'react-dom/server';
import Home from './home';
import { RouterContext } from 'react-router';
import { Provider } from 'react-redux';

export default function render(renderProps, store, res, next) {

    try {
        const markup = ReactDOMServer.renderToString(
            <Provider store={store}>
                <RouterContext {...renderProps} />
            </Provider>
        );

        const html = ReactDOMServer.renderToStaticMarkup(
            <HtmlDocument
                markup={markup}
                params={renderProps.params}
            />
        );

        res.send(`<!DOCTYPE html>${html}`);
    }
    catch (err) {
        next(err);
    }
}

Server Side Redux/React. Express not throwing error

There are 1 best solutions below

Related Questions in REACTJS

Related Questions in EXPRESS

Related Questions in REDUX

Related Questions in REACT-ROUTER

Related Questions in REACT-REDUX

Trending Questions

Popular # Hahtags

Popular Questions