Question

我正在使用angularJS（客户端）和mvc web api（服务器）开发单页应用程序。我有两个物理页面第一个Login.html和第二个Index.html 当用户成功登录重定向到Index.html并且我的应用的其他部分动态加载到使用Index.html页面内的ng-view签名的div时，我使用AngularJS $routeProvider来配置我的路由及其关联的模板和控制器。我最近使用$locationProvider.html5Mode(true);从网址中删除了哈希标记，并将<base href="/Index.html">添加到Index.html Page的head部分。我有一个路由，当我转到这样的路由时，它会采用类似Index.html/MetaDetails/123456的动态参数第一次页面每件事都很好但刷新页面时我收到 iis 404错误

这是使用$routeProvider

的路线配置

    App.config(function ($routeProvider, $locationProvider) {
$routeProvider
.when('/Index.html', {
    templateUrl: 'View/HomePage.html'
})
    .when('/MetaDetails/:url', {
        templateUrl: 'View/MetaDetails/MetaDetails.html'
    }).when('/Logout', {
        templateUrl: 'View/Users/logout.html',
        controller: 'LogoutController'
    }).when('/MetaCRUD', {
        templateUrl: 'View/MetaDetails/MetaCRUD.html',
        typeTemplate:'insert',
        controller: 'MetaCRUDController'
    }).when('/MetaCRUD/:url', {
        templateUrl: 'View/MetaDetails/MetaCRUD.html',
        typeTemplate: 'update',
        controller: 'MetaCRUDController'
    }).when('/MetaReport', {
        templateUrl: 'View/Report/MasterReport.html',
        controller: 'reportController'
    })
     .when('/404', {
         templateUrl: 'View/ErrorPage.html',

     })
    .otherwise({

        redirectTo: '/404'
    });

$locationProvider.html5Mode(true);

}）;

我知道这是因为它与iis路由冲突并且知道我的路由是一个真实的物理页面所以最可能的解决方案是url重写我在重写规则后使用

<rule name="AngularJS Routes" 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="/" />
    </rule>
  </rules>

更新2：

然后当我从其他网址刷新或重定向时，我的路线没有改变，但是没有它显示Index.html的css包含js参考（完全破坏），好像它没有css和js它主要是因为它试图从host / metadetails / example.css或host / metadetails / example.js而不是host / example.js中读取资源它是如何发生的，我怎样才能让它从root not / metadetals path获取资源

你认为什么是适当的解决方案（可能是一个iis url重写）来解决这个问题

请注意，当我从一个页面导航到另一个页面时，例如从metaCRUD（index.html / MetaCRUD）到所需的MetaDetails（index.html），保持单页结构非常重要。 / MetaDetails / someid）我不希望我的页面回发完全，就像我以前使用哈希标记一样，每件事情都很好，只有模板和数据没有发布回来

更新3

我只是发现问题出现的时候我的路线有参数（index.html / MetaDetails / someid）

如何重写此网址以使iis不会错误地将我的参数包含在路径中作为物理路径???

任何帮助将不胜感激

Answer 1

很高兴每个人都告诉你如何删除主题标签，但不是刷新的修复。

这对我有用：

app.js：添加“$ locationProvider.html5Mode（true）;”在app.config中作为第一行。
index.html：在您的第一行添加“”。
web.config：在配置末尾添加以下内容：

<system.webServer>
        <rewrite>
          <rules>
            <rule name="AngularJS Routes" 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="/" />
            </rule>
          </rules>
        </rewrite>
      </system.webServer>

这对我有用。道歉，编辑有点喜怒无常。

从url angularjs应用程序中删除哈希标记时出现iis 404错误

1 个答案: