排除Nest.js中的所有/ api路由以提供React应用程序

Question

我正在开发一个Nest.js中的后端，它应该在所有根级路由（index.html，/about等）上为React生成/contact-us，但不会在以/api开头的那些上。这就是我目前在AppController所做的事情：

@Get('/')
@Get('/contact')
@Get('/about-us')
fileServingRoutes(@Res() res: Response) {
  return res.sendFile('index.html', { root: AppModule.getStaticAssetsRootPath() });
}

有没有办法在不手动定义所有必须发送文件的路由的情况下执行此操作？

Answer 1

我建议关注Bo的伟大article服务SPA。该设置考虑了Angular，但对于React应用程序则相同。

要旨

定义一个中间件函数，将除/api之外的所有路由重定向到index.html。

@Middleware()
export class FrontendMiddleware implements NestMiddleware {
  use(req, res, next) {
    const { url } = req;
    if (url.indexOf('/api') === 1) {
      next();
    } else {
      res.sendFile(resolvePath('index.html'));
    }
  }
}

在AppModule中注册所有路线：

export class ApplicationModule implements NestModule {
  configure(consumer: MiddlewaresConsumer): void {
    consumer.apply(FrontendMiddleware).forRoutes(
      {
        path: '/**',
        method: RequestMethod.ALL,
      },
    );
  }
}

Answer 2

我稍微修改了Kim的解决方案以满足我的需求（我使用的是5.8.0版本）所以，如果你得到错误，你的中间件没有正确实现NestMiddleware接口（因为resolve方法），你可以使用functional middleware;

export function FrontendMiddleware(req, res, next) {
  const { baseUrl } = req;
  if (baseUrl.indexOf('/api') === 0) {
    next();
  } else {
    res.sendFile(<path to your index.html file>);
  }
}

我还使用baseUrl而不是url属性，当我试图访问/路线时返回/api。