我正在使用 ASP.Net 5和AngularJS开发Web应用程序。我已经完成了它并且效果很好,但是当它实时发布时,我发现它在IE9中不起作用,这是我们公司的重要组成部分。
我正在使用ui-router,我正在休耕斯蒂芬·沃尔特客户端路由教程:链接在这里
不幸的是,他从URL中删除#的方法仅适用于IE10+,因为IE9不支持HTML5历史记录API。
已经花了几天时间在这个上面,找不到我必须继续为现代浏览器而不是 IE9 使用干净 url 的步骤?
我的网络配置:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
<system.webServer>
<modules runAllManagedModulesForAllRequests="true" />
<rewrite>
<rules>
<!--Redirect selected traffic to index -->
<rule name="Index Rule" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_URI}" matchType="Pattern" pattern="^/api/" negate="true" />
</conditions>
<action type="Rewrite" url="/index.html" />
</rule>
</rules>
</rewrite>
<handlers>
<add name="httpPlatformHandler" path="*" verb="*" modules="httpPlatformHandler" resourceType="Unspecified" />
</handlers>
<httpPlatform processPath="%DNX_PATH%" arguments="%DNX_ARGS%" stdoutLogEnabled="false" startupTimeLimit="3600" forwardWindowsAuthToken="true" />
</system.webServer>
</configuration>
我的应用.js:
app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', '$sceDelegateProvider',
function ($stateProvider, $urlRouterProvider, $locationProvider, $sceDelegateProvider) {
$locationProvider.hashPrefix('!').html5Mode({
enabled: true,
requireBase: false
});
$stateProvider
.state('app', {
abstract: true,
url: '',
templateUrl: '/templates/appcontainer.html',
controller: 'indexController'
})
.state('app.stateIndex', {
url: '/',
templateUrl: '/templates/list.html',
controller: 'dashListController'
})
.state('app.stateList', {
url: '/list',
templateUrl: '/templates/list.html',
controller: 'dashListController'
})
.state('app.stateDashboard', {
url: '/dashboard/:id',
templateUrl: '/templates/dashboard.html',
controller: 'dashboardController'
})
});
当我在IE9中启动它时,显示一个空白页,当我检查源代码索引时.html加载了,但是<ui-view class="main-view"></ui-view>
的内容没有。
我必须采取什么步骤才能继续为现代浏览器而不是 IE9 使用干净的 url?
在配置块中使用条件语句,通过功能检测从 html5Mode 中排除 IE9。例如:
if(!!$window.innerWidth && !$window.matchMedia)
{
$locationProvider.html5Mode({enabled: false, requireBase: false});
$locationProvider.hashPrefix("search");
}
else
{
$locationProvider.html5Mode({enabled: true, requireBase: false});
}
引用
- 角度.js问题 10002:
<html>
标记上的 ng 控制器在 IE9 上失败