HTML5 pushState Clash w/Angular UI-Router URL-маршрутизация

У меня есть веб-приложение Angular.js, в котором используется ui-router (https://github.com/angular-ui/ui-router) с параллельными именованными представлениями, такими как:

.state(
            'app.experience', {
                url: 'e/:experienceId',
                views: {
                    'center-pane@': {
                        templateUrl: 'partials/experience.html',
                        controller: 'ExperienceController'
                    }
                })

Я включил pushState HTML5 через

$locationProvider.html5Mode(true);

Когда

http://www.mysite.com/e/123

запрашивается, мой сервер отправляет обратно index.html в корневой каталог. (согласно Использование pushstate HTML5 для angular.js) Однако, когда браузер получает index.html и начинает извлекать все ресурсы css/js, запросы предназначены для

/e/js/script1.js

в отличие от

/js/script1.js

который существует только на корневом уровне. Кажется, по умолчанию корневой каталог имеет значение mysite.com/e/ (из запрошенного URL-адреса), а не фактический корень, mysite.com/.

Есть ли что-то, что мне здесь не хватает? Разве нельзя использовать относительные srcs для моего javascript и css в index.html?

Спасибо за помощь!


javascript html angularjs pushstate angular-ui-router
person Luke    schedule 12.04.2014    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Примечание. Вы не показали нам, как выглядит HTML, но исходя из вашей проблемы, я предполагаю, что вы не используете относительные URL-адреса из корня документа.

Вы можете использовать относительные URL-адреса, но они должны быть относительными на основе корня документа.

Так, например, у вас может быть что-то подобное в вашем html

<img src="images/foo.jpg" />

Вы действительно должны сделать это так (обратите внимание на добавление косой черты '/' в начале)

<img src="/images/foo.jpg" />

Это не что-то конкретное для angularjs, это html, см. этот ответ для более подробной информации.

Причина, по которой ваш браузер использует /e/ в URL-адресе, заключается в том, что браузер фактически запросил ресурс, который имеет /e/ в URL-адресе. Браузер не знает, что ваш сервер ответил файлом, которого нет в каталоге /e/.

Поэтому, если у вас есть относительный URL-адрес без косой черты в начале, он будет относиться к пути или исходному запрошенному ресурсу. Что вы хотите, так это использовать относительные URL-адреса с косой чертой в начале.

person JoseM    schedule 15.04.2014
comment
Ага, это было. Спасибо за помощь! - person Luke; 16.04.2014