如何在基于AngularJS的网站中从URL中移除index.html？

Question

我找不到一种方法来从url中删除index.html，因为这样看起来非常丑陋。

mydomain.com/index.html#/myview1 
mydomain.com/index.html#/myview2

有没有一种方法可以移除那部分内容，就像URL会更清晰地显示用户所在的位置。

mydomain.com/myview1
mydomain.com/myview2

提前感谢您的时间。

编辑： 我刚找到了一种它可以工作的方法：

mydomain.com/#/myview1
mydomain.com/#/myview2

这比使用index.html要好得多。

但如果有更简洁的解决方案，请告诉我。

- Pnctovski

---

你是想知道如何去掉URL中的“index.html”吗？ - Alavaros

请阅读编辑Alavaros的内容。 - Pnctovski

@Pnct，你是如何删除index.html的，就像你在编辑中提到的那样？ - anvarik

@anvarik 只需从路由配置中删除 "index.html"，并在您用作链接的任何地方使用 "#" 字符。正如我上面编辑时所写的那样，如果您要完全删除没有 "#" 的 "index.html"，则应尝试激活 $location 的 html5mode，就像 Eduard Gamonal 在我的问题中回答的那样。 - Pnctovski

URL重写（mydomain.com/myview1 -> mydomain.com/index.html#/myview1）不是一个选项吗？通常来说，通过外部（例如通过mod_rewrite）强制使用友好的URL比在内部进行修改更加清晰和节省工作量，特别是在像Angular/Backbone等路径客户端框架中。 - user2189331

Answer 1

也许这个方法可以帮到您：

在您的app.js配置中添加$locationProvider.hashPrefix();，它会从您的URL中删除index.html。别忘了添加新的依赖项。之后，您的app.js可能看起来类似于这样：

 angular.module('myApp', [
  'ngRoute'
]).
config(['$locationProvider', '$routeProvider', function($locationProvider, $routeProvider) {
  $locationProvider.hashPrefix(); // Removes index.html in URL

  $routeProvider.otherwise({redirectTo: '/someroute'});
}]);

请注意，这并不会删除井号。您可以在以下位置找到新路由：.../app/#/someroute。

- Robin Wieruch

Answer 2

激活$location的HTML5模式

- Eduard Gamonal

Answer 3

您需要在服务器端进行一些设置才能完成此操作。html5模式可以帮助您部分实现，但是一旦用户刷新页面，文件的引用将会出错。您需要链接具有持久性和可共享性。基本上，确保任何对url.com/myapp/{etc}（或其他）的请求都会被重定向到index.html，并让您的Angular应用程序处理路由。

- liamness

Answer 4

使用

<rewrite>
    <rules>
        <rule name="RewriteRules" stopProcessing="true">
            <match url=".*" />
            <conditions logicalGrouping="MatchAll">
                <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
          </conditions>
          <action type="Rewrite" url="/index.html" />
      </rule>
  </rules>
</rewrite>

并且在首页上

<base href="/" /> 

在你的配置文件中使用

$locationProvider.html5Mode(true);

它应该可以正常工作

- Shashank