angularjs - 刷新页面给出 "Page not found"

Question

我有一个应用程序，它使用单个 ng-view 和多个 Controller 和 View 。
如果我浏览根目录，例如:www.domain.com，一切正常。除了如果我按 Ctrl+R(刷新)然后它会给我 404 错误页面未找到。例如:在此页面上刷新会给我错误。
http://domain.com/item/1/ .

但是，如果我使用 hashbang 访问该页面，则它可以工作。例如:http://domain.com/#!/item/1/

我该如何解决这个问题？
我的 htacess 是空的。我使用支持 html5 hashbang 的 chrome。

Answer 1

当浏览器调用 http://example.com/#!/item/1/ ，它正在调用http://example.com/的索引页，然后您的 JS 会通过分析主题标签来确定要显示的内容。

当浏览器调用 http://example.com/item/1/ ，您的服务器正在尝试提供 http://example.com/item/1/ 的索引页，它无法找到并因此引发 404 错误。

为了实现你想要的，你要么需要:

创建重写规则以重写指向您的根索引页面的链接

调整您的 JS，使其生成主题标签而不是 URL。如果您使用的是 AngularJS，则使用 $locationProvider.html5Mode(false); 关闭 html5 模式, 或

将索引页放入 http://example.com/item/1/重定向到 http://example.com/#!/item/1/ - 但是请注意，这需要为每个/prettyPath/你 crete 重复。

假设您正在使用 Apache 并且您的索引文件是 index.html，请尝试将以下内容添加到您的 .htaccess 文件中以创建重写规则，然后再尝试其他两种解决方案。

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)       /index.html/#/$1 
</IfModule>

如果您使用的是没有服务器端逻辑的纯 AngularJS/Ajax 解决方案，请将 index.php 更改为 index.html(或 index.htm，具体取决于您的根索引文件名)。