如何使用 NodeJS 和 browserSync 进行服务器端 HTML5 模式 URL 重写答案

【问题标题】：How to do serverside HTML5 mode URL Rewriting with NodeJS and browserSync如何使用 NodeJS 和 browserSync 进行服务器端 HTML5 模式 URL 重写
【发布时间】：2018-05-31 02:59:27
【问题描述】：

如何删除 #!在我的 AngularJS 应用程序中添加到 url？

我尝试过：- $locationProvider.html5Mode(true).hashPrefix('!'); 并添加 <base href="/"> 但无济于事。当我导航到特定的网址时，#!消失了，但是当我尝试重新加载时，它给出了错误：- Cannot GET.

于是我上网查了一下，发现上面做的只是解决了一半。我们还需要重写服务器端的逻辑。所以我使用 NodeJS 和 browserSync 包来启动 localhost。那么有什么办法解决呢？

注意：- 我的后端和前端代码是分开的，都处理路由。

【问题讨论】：

如果您使用快递，您可以查看this 答案。在开始收听之前添加 sn-p。
@MikaS 放在哪里？
例如在app.listen()上方。
我的后端和前端代码是分开的，都处理路由。 @MikaS
应用加载时后端不是还在服务index.html吗？

标签： angularjs node.js browser-sync

【解决方案1】：

Browsersync 中有一个名为 single 的选项，如果 url 不存在，它会将 index.html 作为备用。

为所有非资产路由提供一个 index.html 文件。使用客户端路由器时很有用

查看文档： https://www.browsersync.io/docs/options#option-single

browserSync.init({
    server: {
        baseDir: 'dist',        
    },
    single: true
});

【讨论】：