Express JS 将所有路径重定向到 static 维护页面

Question

我有一个带有 Express Node JS 后端的 Angular Web 应用程序，我想显示一个 static 正在建设页面，以便在特定时间段内无法使用 web 应用程序。 在我当前的设置中，我有一个 initStaticPages function（请参见下文），它会初始化所有路由。 我还添加了一个通过 /maintenance 提供的新页面。

在编写始终重定向到 /maintenance 的中间件并将此中间件添加到所有路由时，出现重定向错误太多并且 web 应用程序已关闭。 将中间件添加到除索引页面“/”之外的所有路由都有效，但不是我想要实现的行为。 有人知道如何解决这个问题吗？ 将不胜感激任何帮助。 非常感谢

路由器.js

const initStaticPages = (router) => {
  router.use('/', checkMaintenanceMode, express.static('public'))
  router.use('/main', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/login', checkMaintenanceMode, express.static('public'))
  router.use('/logout', checkMaintenanceMode, express.static('public'))
  router.use('/logout?reason=timeout', checkMaintenanceMode, express.static('public'))
  router.use('/requestHistory', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/recurringRequest', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/maintenance', express.static('public'))
}

module.exports = () => {
  const router = express.Router()
  initStaticPages(router)
  return router
}

Simple Middleware 会是这样的：也会有一些条件，但为了简单起见，我把它省略了。

const checkMaintenanceMode = (req, res, next) => {
    res.redirect('/maintenance/')
}

主程序

const app = require('express')()
const router = require('./router')()
const cookieParser = require('cookie-parser')
const compression = require('compression')

const port = process.env.PORT

app.use(compression())
app.use(cookieParser())
app.use(router)

app.listen(port, () => console.log(`Running on port ${port}`))

调整路由顺序后的第二个错误：加载模块脚本失败：需要 JavaScript 模块脚本，但服务器响应 MIME 类型为“text/html”。 根据 HTML 规范，对模块脚本强制执行严格的 MIME 类型检查。

下面是公用文件夹和维护容器的内容。 index.html 包含一些路由器出口并服务于特定的容器组件。 在这种情况下/维护。 显然，在将中间件添加到 / 路由时，它会从上方抛出错误并显示空白页面。

 /app/frontend/app/container/maintenance: maintenance.component.css maintenance.component.html maintenance.component.ts /app/server/public: assets index.html vendor-es2015.3f2dce1d421f11b1eba1.js vendor-es2015.3f2dce1d421f11b1eba1.js.map vendor-es5.3f2dce1d421f11b1eba1.js vendor-es5.3f2dce1d421f11b1eba1.js.map polyfills-es5.34831379c55aac23d35e.js polyfills-es5.34831379c55aac23d35e.js.map main-es2015.730bc485b11bbd634316.js main-es2015.730bc485b11bbd634316.js.map polyfills-es2015.8c0828ece2f5d1fedbfb.js polyfills-es2015.8c0828ece2f5d1fedbfb.js.map main-es5.730bc485b11bbd634316.js main-es5.730bc485b11bbd634316.js.map runtime-es2015.dc25f63d6f9e75106165.js runtime-es2015.dc25f63d6f9e75106165.js.map runtime-es5.dc25f63d6f9e75106165.js runtime-es5.dc25f63d6f9e75106165.js.map 3rdpartylicenses.txt jsoneditor-icons.15f2789dd231f36d43a4.svg styles.9211410addacf27114df.css styles.9211410addacf27114df.css.map

Answer 1

这看起来像是一个特殊情况。 您的路线应该从最具体到最一般来定义。

/是一条路由，几乎可以匹配任何内容，包括/maintenance 。 所以你击中任何路线/被击中，然后它重定向到/maintenance obv 与/匹配并创建一个循环。

  router.use('/main', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/login', checkMaintenanceMode, express.static('public'))
  router.use('/logout?reason=timeout', checkMaintenanceMode, express.static('public'))
  router.use('/logout', checkMaintenanceMode, express.static('public'))
  router.use('/requestHistory', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/recurringRequest', checkMaintenanceMode, requireAccess, express.static('public'))
  router.use('/maintenance', express.static('public'))
  router.use('/', checkMaintenanceMode, express.static('public'))

注意：使用类似的逻辑，我重新排序了你的/logout路由。 虽然与问题无关。