angularjs - 如何在不破坏后退按钮的情况下将触发页面刷新的链接与 Angular 的 html5Mode = true 混合使用？

Question

我将逐步解决有问题的流程...

• 我加载 google.com(仅作为起点)
• 我转到app.com
• 我导航至 app.com/projects
• 我导航至 app.com/api/test(通过 window.location)
• 我看到了原始 JSON(到目前为止还不错...)
• 我按回键，网址更改为 app.com/projects，但我仍然看到 JSON。
• 我再次按返回键，网址更改为 app.com，但我仍然看到 JSON。
• 我再次按返回键，google.com 就会加载。
• 我继续前进，app.com 加载正常...一切恢复正常

奇怪的是，只有当 Webkit 中的 html5Mode = true 时我才观察到这一点 -firefox 按预期工作...

。 。 .

首先，我的 server.coffee 看起来像这样:

app.get '/partials/:partial', routes.partials
app.get '/api/test', api.test
app.get '*', routes.index

基本上，所有请求都会加载索引(引导 Angular)，但 View /部分处理程序和使用原始 JSON 响应的测试 API 路由除外。

。 。 .

(我使用 ui-router 模块来管理嵌套 View 和 UI 状态；它使用 $urlRouterProvider，这与 Angular 的 $routeProvider 非常相似)

其次，我的 app.coffee 看起来像这样:

app = angular.module('app', ['ui-router'])
.config([
    '$stateProvider'
    '$locationProvider'
    '$urlRouterProvider'
    ($stateProvider, $locationProvider, $urlRouterProvider)->
        $urlRouterProvider
            .when('/api/test', [
                '$window'
                '$location'
                ($window, $location)->
                    $window.location.href = '/api/test'
            ])
            .otherwise('/')
        $stateProvider
            .state 'home',
                url: '/'
                templateUrl: 'partials/index'
                controller: 'IndexCtrl'
            .state 'projects',
                url: '/projects'
                templateUrl: 'partials/projects'
                controller: 'ProjectsCtrl'
        $locationProvider.html5Mode(true).hashPrefix '!'
])

由于一切都是异步的，我必须使用 $window 访问 window.location.href 来触发页面刷新，以便服务器处理路由。

所以我的问题是，我可以将触发页面刷新的链接与 Angular 的 html5Mode 混合使用而不破坏后退按钮吗？这只是一个 Webkit 错误吗？和/或者有更好的方法吗？

理想情况下，我会让应用程序在 Angular 上运行，但像“关于”或“联系”页面(不需要动态或异步)之类的内容将使用常规页面刷新直接从服务器提供...

救命!

Answer 1

两个选项:

1. 如果您使用<a />标签，指定 target="_self"让 AngularJS 知道它不应该捕获他们的点击(这些链接将由浏览器正常处理)。这不是黑客攻击；而是黑客攻击。这是正常记录的行为。
2. 使用$window.location = 'foo'正如你一直在做的那样。这是可以接受的。