节点try / catch块仍然冒泡

问题描述 投票:0回答:1

我遇到了解决我的服务器渲染错误的问题,对我来说奇怪的是它到达了catch语句,但它仍然冒泡并崩溃并获得Uncaught异常。

这是我的函数的剥离版本:

export default (htmlFilePath, observer) => async (req, res) => {
  try {
    const { state } = await rehydrate.dispatchRequired(store, [
      setMobileDetect.bind(null, mobileDetect),
      ...REQUIRED_ACTIONS,
    ]);
    // Will dispatch the required data through the store,
    // the returned value is not important
    const matches = rehydrate.getMatches(req, state);
    let status = 200;

    componentNames = matches.map(
      ({ route }) => route.component.displayName,
    );

    await rehydrate.rehydrate(matches, store, state);

    const markupStream = renderToNodeStream(
      <Provider store={store}>
        <ConnectedRouter history={history} location={context}>
          <App />
        </ConnectedRouter>
      </Provider>,
    );

    if (context.url) {
      return res.redirect(301, context.url);
    }

    // if no routes match we return 404
    if (!matches.length) {
      status = 404;
    }

    return fs
      .createReadStream(htmlFilePath)
      .pipe(htmlReplace("#root", markupStream))
      .pipe(
        replaceStream("__SERVER_DATA__", serialize(store.getState())),
      )
      .pipe(res.status(status));
  } catch (err) {
    const errMarkup = renderToNodeStream(
      <Provider store={store}>
        <ConnectedRouter history={history} location={context}>
          <Error500 error={err} />
        </ConnectedRouter>
      </Provider>,
    );

    logger.log({
      level: "error",
      message: `Rendering ${
        req.originalUrl
      } fallback to Error render method`,
      ...{
        errorMessage: err.message,
        stack: err.stack,
      },
    });

    return fs
      .createReadStream(htmlFilePath)
      .pipe(htmlReplace("#root", errMarkup))
      .pipe(res.status(500));
  } finally {
    logger.info(
      `Request finished ${req.originalUrl} :: ${res.statusCode}`,
    );
    end({
      route: path,
      componentName: componentNames[0],
      code: res.statusCode,
    });
    logger.profile(profileMsg);
  }
};

我希望我的catch块返回模块500个错误,但由于来自markupStream()的未捕获异常,节点实例崩溃

更新:根据要求,这是日志:https://pastebin.com/A4vL8zcc

node.js reactjs express react-dom-server
1个回答
1
投票

由于您使用的是renderToNodeStream,因此直到尝试从流中读取内容时才会执行实际呈现,这从日志中的堆栈跟踪中可以看出:

TypeError: Cannot read property 'length' of undefined
    at NotFoundPage.render (~/server/dist/loader.js:43889:23)
    at processChild (~/node_modules/react-dom/cjs/react-dom-server.node.development.js:2207:18)
    at resolve (~/node_modules/react-dom/cjs/react-dom-server.node.development.js:2064:5)
    at ReactDOMServerRenderer.render (~/node_modules/react-dom/cjs/react-dom-server.node.development.js:2349:22)
    at ReactDOMServerRenderer.read (~/node_modules/react-dom/cjs/react-dom-server.node.development.js:2323:19)
    at ReactMarkupReadableStream._read (~/node_modules/react-dom/cjs/react-dom-server.node.development.js:2735:38)
    at ReactMarkupReadableStream.Readable.read (_stream_readable.js:449:10)
    at flow (_stream_readable.js:853:34)
 => at resume_ (_stream_readable.js:835:3)
    at process._tickCallback (internal/process/next_tick.js:114:19)

这意味着任何错误只发生在流的读取/管道传输期间,即在您的HTTP框架中,这对于您的try / catch来说太迟了。

您可能想要使用renderToString,或者检测您返回的流以进行错误处理。

© www.soinside.com 2019 - 2024. All rights reserved.