浏览器页面重新加载不起作用

时间:2016-10-16 15:40:29

标签: javascript c# angularjs web asp.net-core

我正在使用AngularJS和C#创建ASP.NET Core SPA(对于API),我对页面刷新有一点问题。

例如,我有我的主页,有两个链接。这些链接是:   - 主页(重定向到:/ home)   - 客户(重定向到:/ clients)

问题是,当我在/ clients路由上刷新我的页面(F5)时,重新加载后我应该拥有与重新加载页面之前相同的视图。

我的代码是:

app.js

var app = null;

(function () {
'use strict';

appConfig.$inject = ['$routeProvider', '$locationProvider'];

app = angular.module('app', [
    'ngRoute',
    'ngResource'
]);

app.config(appConfig);

function appConfig($routeProvider, $locationProvider) {

    // Define the routes
    $routeProvider
        .when('/', {
            templateUrl: '/views/home.html',
            controller: 'homeController',
            title: 'Home'
        })
        .when('/clients', {
            templateUrl: '/views/clients.html',
            controller: 'clientsController',
            title: 'Clients'
        })
        .when('/clients/add', {
            templateUrl: '/views/addClient.html',
            controller: 'addClientController',
            title: 'Add new client'
        })
        .when('/404', {
            templateUrl: '/views/404.html',
            title: '404 Not found'
        })
        .otherwise({
            redirectTo: '/404'
        });

    $locationProvider.html5Mode(true);
}

app.run(['$rootScope', '$route', function ($rootScope, $route) {
    $rootScope.$on('$routeChangeSuccess', function () {
        document.title = 'Blume - ' + $route.current.title;
    });
}]);

})();

clientController.js

(function () {
    'use strict';

    angular
        .module('app')
        .controller('clientsController', clientsController);

    clientsController.$inject = ['$location', '$scope', '$resource', 'clientService']; 

    function clientsController($location, $scope, $resource, clientService) {
        $scope.clients = clientService.query();
    }

})();

clientService.js

(function () {
    'use strict';

    angular
        .module('app')
        .factory('clientService', clientService);

    clientService.$inject = ['$resource'];

    function clientService($resource) {
        return $resource('/api/client/:id');
    }

})();

的web.config

<?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>
  </system.webServer>
</configuration>

1 个答案:

答案 0 :(得分:0)

不幸的是,现在还没有解决这个问题。在谷歌的一些研究之后,我发现了一个GitHub问题,告诉我在IIS上重写URL有点破碎。

https://github.com/aspnet/IISIntegration/issues/192#issuecomment-226012161

好的是问题已经解决,此功能将在下一个.NET Core(1.1)版本中提供。它应该在2016年秋季之前完成。

https://github.com/aspnet/Home/wiki/Roadmap