Сбой углового маршрута $routeProvider.html5Mode после обновления вручную

После включения $locationProvider.html5Mode(true); а также <base href="/" /> в index.html маршруты начали вылетать после перезагрузки вручную.

Ища решения, я обнаружил, что .htaccess правила решат эту проблему, но разные конфигурации не помогли.

Может быть, это потому, что мой index.html находится в подкаталоге /views/index.html

.htaccess:

Options +FollowSymLinks

<ifModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} !index
    RewriteRule (.*) index.html [L] # /views/index.html doesn't work as well
</ifModule>

route config

app.config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    $locationProvider.html5Mode(true);

    $routeProvider
        .when('/', {
            templateUrl: 'home.html',
            controller: 'AddTaskCtrl',
            controllerAs: 'AddTask'
        })
        .when('/chat', { //this route breaks on manual refresh  
            templateUrl: 'chat.html',
            controller: 'ChatCtrl',
            controllerAs: 'chat'
        })
}]);

1 ответ

Шаг 1: используйте только $locationProvider.html5Mode(true);

шаг 2: измени свой.htaccess

RewriteEngine on

# Don't rewrite files or directories
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]

# Rewrite everything else to index.html to allow html5 state links
RewriteRule ^ index.html [L]

Когда index.html - это начальная загрузка, укажите ваше приложение или посмотрите другие методы https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions

Другие вопросы по тегам