Question

当用户转到localhost:8888或localhost:8888/时，我的角度应用更改为网址http://localhost:8888/#!/

这是我在主页上的角度应用程序：

app.config(['$locationProvider', '$routeProvider',
    function($locationProvider, $routeProvider) {
        $locationProvider.hashPrefix('!');

        $routeProvider
            .when('/', {
                redirectTo: ((window.status === 'signup') ? '/signup' : '/signin')
            })
            .when("/signin", {
                templateUrl: "/public/user/signin.html",
                controller: "signinController"
            })
            .when('/signup', {
                templateUrl: "/public/user/signup.html",
                controller: "signupController"
            })
            .otherwise({
                redirectTo: '/'
            });
    }
])

如果用户转到http://localhost:8888/auth，则角度重定向到http://localhost:8888/auth#!/signin，

仅当用户转到http://localhost:8888/auth/时，角度重定向到http://localhost:8888/auth/#!/signin

app.config(['$locationProvider', '$routeProvider',
    function($locationProvider, $routeProvider) {
        $locationProvider.hashPrefix('!');

        $routeProvider
            .when('/', {
                redirectTo: ((window.status === 'signup') ? '/signup' : '/signin')
            })
            .when("/signin", {
                templateUrl: "/public/user/signin.html",
                controller: "signinController"
            })
            .when('/signup', {
                templateUrl: "/public/user/signup.html",
                controller: "signupController"
            })
            .otherwise({
                redirectTo: '/'
            });
    }
])

有棱角的官方网站和大多数书籍推荐使用xxx/#!/xxx格式。我怎样才能做到这一点？

编辑：我知道我可以从服务器端添加尾部斜杠。但是用户可以直接输入xxx.com/auth。为什么xxx.com有效但xxx.com/auth无效？

Edit2：教程示例项目适用于所有网址。我们有相同的实现

http://angular.github.io/angular-phonecat/step-8/app/#/phones

尝试输入http://angular.github.io/angular-phonecat/step-8/app（不带尾随斜杠

教程链接：https://docs.angularjs.org/tutorial/step_07

Answer 1

最好的方法是从客户端而不是服务器附加它，因为用户最有可能在没有反斜杠的情况下输入url。不应该有太多的开销因为你必须修改角度哈希片段。

试试这个：

angular.element(document).ready(function() {
    window.location.hash = '#!/' //use ! for google crawlers ajax support
    if (window.location.href.substr(-1) != '/' window.location.href += '/'
})

Answer 2

通过添加从/auth到/auth/的301重定向，您应该在后端修复此问题。

Nginx的：

rewrite ^/auth$ /auth/ permanent;

的Apache：

Redirect "/auth" "/auth/" [R=301]

ngRoute将尾部斜杠添加到某个网址但不是全部

2 个答案: