Html5Mode - 刷新 angularjs 页面问题答案

【问题标题】：Html5Mode - refreshing the angularjs page issueHtml5Mode - 刷新 angularjs 页面问题
【发布时间】：2015-03-30 10:06:51
【问题描述】：

我正在开发一个 angularJS 应用程序，它的 URL 格式为（在开发中）-

http://localhost:6001/#/home/index
http://localhost:6001/#/content/index

由于这个应用程序也可以在桌面浏览器上使用，我希望 URL 不带“#”，所以我在应用程序的配置部分添加了这个 -

$locationProvider.html5Mode(true);

这可以正常工作，并且 URL 不显示“#”。但是现在有一个问题。在浏览器中刷新特定页面时，现在我收到此错误 -

Cannot GET /home/index

是否需要进行任何其他更改才能使其正常工作？

注意：此应用使用 cordova CLI 并托管在 Node.js 服务器上。

【问题讨论】：

使用 html5 模式需要在服务器端重写 URL。见：stackoverflow.com/questions/16569841/…

标签： angularjs node.js cordova angular-ui-router cordova-cli

【解决方案1】：

尝试输入你的路线：

app.get(*, function(req,res) {
  //return the main index file
});

这将导致任何不匹配的路由为索引页面提供服务，并从那里角度处理该路由。

【讨论】：

我的路线设置有点像这样 - pastie.org/10062399。你的意思是我应该创建另一条路线？你能解释一下在哪里做你所说的吗？
我的意思是在你的节点应用程序中不是有角度的。如果您使用的是 express，您可以编写我向您展示的内容，如果不遵循相同的逻辑。
哦。实际上，cordova 库目前正在负责在节点上运行应用程序。我还没有像这样在节点中编程，但我理解你想要做什么。如果你能引导我到任何链接或解释如何设置它，那就太好了。
你是什么意思科尔多瓦正在运行节点服务器？这不是科尔多瓦所做的，他们没有为您运行的服务器。您创建自己的服务器并将客户端连接到此服务器。
我用于构建跨平台应用程序的 cordova CLI 是一个 npm 包，并使用 node 作为其 Web 服务器。我不知道如何修改它的配置。

【解决方案2】：

试试这个：

确保你的 server.js 文件中有这些行

var express = require('express');
var app = express();
app.use(express.static(__dirname + '/public.build'));
app.use(function(req, res) {
res.sendFile('index.html', { root: __dirname + "/public.build" });
});

为什么会这样？请在此处阅读 - https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode

第一步导致我的应用程序出现以下 console.log 消息：
```
Resource interpreted as Stylesheet but transferred with MIME type
text/html: "http://localhost:8080/board/css/style.css". 
```
如您所见，样式正在尝试从不存在的路径加载（应用程序中不存在 /board/ 文件夹，它是 ui-router 中的状态之一）。为了修复它，我替换了以下行
```
<link rel="stylesheet" href="css/style.css">
```
用这个：
```
<link rel="stylesheet" href="/css/style.css">
```

【讨论】：