如何在不将所有资源重定向到主页的情况下解决 Angular PathLocationStrategy

Question

我使用 Angular7 和 Node 8.11.4 作为 Web 应用程序，现在我需要从 url 中删除“#”，所以我将 locationStrategy 表单更改HashLocationStrategy为PathLocationStrategy并添加<base href="/">index.html。它可以工作，但你知道刷新页面后会出现404错误，我知道如何将所有资源重定向到主页，但我的目的是将一些资源重定向到特定组件或页面，因为我需要直接访问这些页面不是从主页，这是我的问题，我在谷歌上搜索，发现大部分的方法是重定向到主页而不是特定页面，我知道 Angular vue 反应都使用前端路由器，但我仍然想知道它是否可以直接访问特定页面。如：访问http://localhost:4200/aaa，则无需重定向到首页localhost:4200，直接显示页面aaa。/aaa是路由到 Angular 组件的路径。如果您有任何解决方案或有相同的问题，请发布您的答案PathLocationStrategy html5 router。

Answer 1

问题已解决，好像很多人都有同样的问题，所以在这里发布我的解决方案。

对于节点服务器：

在您的底部server.js，添加以下方法：

const fs = require("fs");

app.use((req, res)=>{

  let rs = fs.createReadStream(`${__dirname}/dist/{your project name}/index.html`);

  res.writeHead(200, {"Content-type": "text/html"});

  rs.pipe(res);

})

__filename: 这是 Node 变量，表示当前模块的文件名。

fs:fs模块提供了与文件系统交互的API

这是一个在你的服务器中找不到资源的路由，例如/aaa，当你在更改为 PathLocationStrategy 后尝试刷新页面/aaa 时，你会得到 404 错误，添加此路由后，所有未找到的资源都会转到此路由，然后 fs.createReadStream(${__dirname}/dist/{your project name}/index.html)会将您的资源重定向到 index.html，之后 Angular index.html 将处理您的路由并重定向到正确的页面。