UI5 路由实现：Express.js 对比 UI5 路由功能

Question

在通用单页应用程序 (SPA) 中，我将使用 Express.js 实现路由逻辑。但是我应该在 SAPUI5 环境中使用什么方法呢？我应该依赖 SAPUI5 的 sap.ui.core.routing.Router and sap.m.routing.Router 路由模块还是使用 Express.js?

实现这样的功能

Answer 1

我认为您稍微混淆了路由概念。让我们试着澄清一下。

Express 是一个用于构建 HTTP 接口的 server-side Node.js 库。在此上下文中，routing 指的是将传入请求与处理函数相匹配（例如，基于 URL 模式）。然后，处理函数必须根据传入请求（状态、headers、body 等）生成 HTTP 响应。这类似于Spring@RequestMapping、JAX-RS@Path、Rails路由等

// Express route
// all GET requests on the / URL will be handled by this function
// which in turn sends back a plain text "Hello world!" response
app.get('/', (req, res) => res.send('Hello World!'))

以上代码匹配请求示例：GET http://localhost:3000/.

UI5 是用于构建 client-side 单页应用程序的框架。正如您提到的，它有一个基于 built-in 散列的路由器。在此上下文中，routing 表示将浏览器的当前位置与 SPA 内的视图相匹配。通常（但不总是），这是通过像 UI5 那样的散列来完成的，即通过 # 符号之后的 URL 部分。这是因为 URL 仅影响散列的更改不会导致浏览器加载新页面。这反过来确保 JavaScript 上下文不会被破坏 + re-created 并且之前加载的资源仍然可以访问。这类似于 React Router, Angular Router, mithril 路由等

  // UI5 router config
  // it first defines where are your views (in the sap.ui.demo.nav.view "package")
  // and where the views should be rendered (inside the pages of the app control)
  // lastly, it defines one route, which matches the /home URL inside the app to
  // the Home view.
  "routing": {
     "config": {
        "routerClass": "sap.m.routing.Router",
        "viewType": "XML",
        "viewPath": "sap.ui.demo.nav.view",
        "controlId": "app",
        "controlAggregation": "pages"
     },
     "routes": [{
        "pattern": "/home",
        "name": "appHome",
        "target": "home"
     }],
     "targets": {
        "home": {
           "viewId": "home",
           "viewName": "Home"
        }
     }
  }

上述配置的示例匹配位置：http://localhost:3000/index.html#/home.

本质上，如果您想构建一个带有 Node.js 后端的 UI5 应用程序，您很可能会同时使用两者：

用于构建 server-side REST API 的快速路由。
用于处理用户界面内导航的 UI5 路由。

希望这能提供一些清晰度。

后来编辑：我遗漏的一件事是 server side rendering。这可能会把水搅得更浑，但在 UI5 的背景下，无论如何（还）不能轻易做到。

UI5 路由实现：Express.js 对比 UI5 路由功能

UI5 routing implementation: Express.js vs. UI5 routing functionality

express

routes

sapui5

url-routing

single-page-application