如何从基于angularjs的网站上的url中删除index.html答案

【问题标题】：How to remove index.html from url on website based on angularjs如何从基于angularjs的网站上的url中删除index.html
【发布时间】：2013-07-17 12:07:22
【问题描述】：

我没有找到从 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 要好得多。

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

【问题讨论】：

如何从 url 中删除 index.html？
阅读编辑 Alavaros。
@Pnct 你是如何删除你在编辑中提到的 index.html 的？
@anvarik 只需从路由配置中删除“index.html”，以及您用作链接的任何地方。正如我在上面写的我的编辑，你应该只使用“#”字符。但是，如果您询问是否要完全删除没有“#”的“index.html”，您应该尝试激活 $location 的 html5mode，正如 Eduard Gamonal 在我的问题中回答的那样。
URL 重写 (mydomain.com/myview1 -> mydomain.com/index.html#/myview1) 不是一个选项吗？在外部（例如，在您的框架之外，例如通过 mod_rewrite）强制执行友好的 URL 通常比使用管道更干净，工作量也更少，尤其是在 Angular/Backbone/等路径型客户端框架中。

标签： javascript html angularjs angularjs-directive angularjs-routing

【解决方案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

【讨论】：

【解决方案2】：

为$location激活html5mode

【讨论】：

【解决方案3】：

您必须在服务器端做一些工作来设置它。 html5mode 为您提供了部分帮助，但是一旦用户刷新，对文件的引用就会出错。您可能想要持久且可以共享的链接。基本上确保对 url.com/myapp/{etc} （或其他）的任何请求都被重定向到 index.html 并让您的 Angular 应用程序整理路由。

【讨论】：

【解决方案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);

它应该可以工作

【讨论】：