Первоначальный ответ от моего сервера не обслуживается, и это произошло из-за ошибки в моем компоненте React, однако Express не выдает никаких ошибок. Вот фрагмент того, что происходит на стороне сервера. Код дошел до этой точки, а затем молча потерпел неудачу:
res.status(200).send(html(renderToString(
<Provider store={store}>
<RouterContext {...renderProps} />
</Provider>
), store.getState()));
Но произошла ошибка в методе компонента render
. this.props.ui
больше не определен, поэтому должна была возникнуть ошибка. Вместо того, чтобы выдать ошибку, он ничего не сказал и просто не загрузил страницу.
return (
<div className={`full-width full-height ${this.props.ui.showBgImage ? 'bg' : ''}`}>
)
Любые идеи относительно того, как заставить мой сервер выдавать ошибку вместо тихого сбоя?
1 ответ
При рендеринге страницы на сервере вы должны заключить try catch
в функцию renderToString
, чтобы отловить ошибки.
Например,
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);
}
}
Похожие вопросы
Новые вопросы
reactjs
React — это библиотека JavaScript для создания пользовательских интерфейсов. Он использует декларативную парадигму на основе компонентов и стремится быть эффективным и гибким.