首页 > 解决方案 > 我可以在 Angular CLI 应用程序中将自定义中间件添加到开发服务器吗?

问题描述

本质上,我想扩展 Angular CLI 的代理,以启用我们组织使用的一些自定义 Express 中间件来支持独特的身份验证模型。

Create React App通过公开 Express 应用实例并让app.use()您拥有自己的中间件来支持这一点。

我找不到使用 Angular CLI 支持这一点的方法。这在不弹出的情况下可行吗?

标签: angularangular-cli

解决方案


Angular (8+) 自定义构建器支持此功能。

特别是,custom-webpack构建器允许您使用 Webpack 的before钩子集成自定义中间件。

https://webpack.js.org/configuration/dev-server/#devserverbefore

例如,制作一个extra-webpack.config.js

module.exports = {
  devServer: {
    before(app, server) {
      app.use(yourCustomMiddleware);
    }
  }
};

然后将其接线angular.json

"architect": {
  ...
  "build": {
    "builder": "@angular-builders/custom-webpack:browser"
    "options": {
      "customWebpackConfig": {
         path: "./extra-webpack.config.js"
      }

推荐阅读