替代在 url 中使用 hashbangs 来解决 IE9 问题

Posted 2023-02-22

【中文标题】替代在 url 中使用 hashbangs 来解决 IE9 问题

【英文标题】：Alternative to the use of hashbangs in the url to resolve IE9 issue

【发布时间】：2015-04-01 13:16:58

【问题描述】：

我正在使用这些设置在 angularjs 中创建一个搜索应用程序：

应用配置：

    app.config(
    [
        '$locationProvider',
        function ($locationProvider) 
            $locationProvider.html5Mode(
                enabled: true,
                requireBase: false,
                rewriteLinks: false
            );
        
    ]
);

问题不在于应用程序本身，而是当我尝试使用 IE9 访问页面时，我根本无法访问它。在阅读了 som 之后，我发现 IE9 会忽略 url 中 # 之后的所有内容，并将用户重定向回主机 url（url 中 # 之前的所有内容）并且 html5mode 的标准回退是 hashbang-mode。 Angular docs for $location

我的问题是，是否有人知道是否有任何方法可以解决在 url 中使用 hashbangs 的问题，或者其他人是否有此问题。如果需要更多文件，请告诉我，我会提供！

编辑：这是在控制器内部：

    $scope.$on('$locationChangeSuccess', function () ;
        $scope.searchQuery = $location.search()['q'];
        $scope.search();
    );

编辑： 添加$locationProvider.hashPrefix('!'); 将不起作用，因为它只会添加一个“！”在网址中的“#”之后。

查看角度文档中的图片：

【问题讨论】：

“在阅读 som 之后，我发现 IE9 会忽略 url 中 # 之后的所有内容，并将用户重定向回主机 url”。这就是 URL 中的哈希的工作原理。 Angular 的工作原理是在内部将其解析为可用的 url。

那么，有什么问题呢？为什么在 IE9 中无法访问它？您是否进行了任何故障排除？正如我们在文档中看到的那样，回退是正确的。

【参考方案1】：

IE9不支持history.pushState，见：http://caniuse.com/#feat=history

因此，当您启用 html5Mode 时，例如：$locationProvider.html5Mode(true) 对于 IE9，它将回退到 URL 中的 # - 没有办法解决这个问题

话虽如此，您应该仍然可以使用$location.search(); 您可以像这样获取搜索参数： var searchObject = $location.search(); 要获取特定参数，您可以执行以下操作：$location.search().paramName

请参阅https://docs.angularjs.org/api/ng/service/$location 了解更多信息。

$location 服务的替代方法是注入 $routeParams，请参阅：https://docs.angularjs.org/api/ngRoute/service/$routeParams 但我不确定您的用例，routeParams 仅在路线更改完成后更新

【讨论】：

我启用了 html5Mode 但在 IE9 中，我的应用程序陷入了无限直接循环。如何让后备 #urls 正常工作？