重新加载页面给出了AngularJS HTML5模式错了GET请求 [英] Reloading the page gives wrong GET request with AngularJS HTML5 mode

问题描述

我想启用HTML5模式我的应用程序。我已经把下面的code的配置，如下所示 ：

I want to enable HTML5 mode for my app. I have put the following code for the configuration, as shown here:

return app.config(['$routeProvider','$locationProvider', function($routeProvider,$locationProvider) {

    $locationProvider.html5Mode(true);
    $locationProvider.hashPrefix = '!';

    $routeProvider.when('/', {
        templateUrl: '/views/index.html',
        controller: 'indexCtrl'
    });
    $routeProvider.when('/about',{
        templateUrl: '/views/about.html',
        controller: 'AboutCtrl'
    });

正如你所看到的，我使用了 $ locationProvider.html5mode ，我改变了我的NG-REF排除所有链接 /＃ / 。

As you can see, I used the $locationProvider.html5mode and I changed all my links at the ng-ref to exclude the /#/.

目前，我可以去本地主机：9000 / ，看到索引页面，然后导航到另一个页面，如本地主机：9000 /约。

At the moment, I can go to localhost:9000/ and see the index page and navigate to the other pages like localhost:9000/about.

然而，当我刷新本地主机出现问题。我得到以下的输出：拿不到/约

如果我看网络调用：

Request URL:localhost:9000/about
Request Method:GET

而如果我先去本地主机：9000 / 键，然后单击该导航到 /约按钮我得到：

While if I first go to localhost:9000/ and then click on a button that navigates to /about I get:

Request URL:http://localhost:9000/views/about.html

这完美呈现页面。

Which renders the page perfectly.

我怎样才能使角，以获得正确的页面，当我刷新？

感谢您提前。

推荐答案

从href=\"https://docs.angularjs.org/guide/$location\" rel=\"nofollow\">角文档的

From the angular docs

服务器端结果
  使用该模式需要URL重写，服务器端的，基本上你不得不重写所有的链接到应用程序的入口点（例如，index.html）

Server side
Using this mode requires URL rewriting on server side, basically you have to rewrite all your links to entry point of your application (e.g. index.html)

这样做的原因是，当你第一次访问该页面（ /约），例如在刷新后，浏览器无法知道这是不是一个真正的URL的方式，所以它会开始加载它。但是如果您已经装了根页面，所有的JavaScript code，那么当你浏览到 /约角可以在浏览器尝试之前在那里得到点击服务器，并相应地处理它。

The reason for this is that when you first visit the page (/about), e.g. after a refresh, the browser has no way of knowing that this isn't a real URL, so it goes ahead and loads it. However if you have loaded up the root page first, and all the javascript code, then when you navigate to /about Angular can get in there before the browser tries to hit the server and handle it accordingly

这篇关于重新加载页面给出了AngularJS HTML5模式错了GET请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！