HTML5 pushState的冲突W /角UI-路由器URL路由(HTML5 pushState

我有一个Angular.js web应用，其采用的ui-路由器（ https://github.com/angular-ui/ui-router ）瓦特像这样/并行命名视图：

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

我支持HTML5 pushState的经

$locationProvider.html5Mode(true);

什么时候

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

被请求时，我的后端在根目录发回的index.html。 （根据使用上angular.js HTML5 pushState的 ）。然而，当浏览器接收的index.html，并开始获取所有的CSS / JS资源，该请求用于

/e/js/script1.js

相对于

/js/script1.js

只存在于根级别。 这似乎是默认的根目录mysite.com/e/ （从请求的URL），而不是实际的根， mysite.com/ 。

有什么事，我在这里失踪？ 这难道不是可以使用我的javascript相对索马里红新月会和CSS的index.html？

感谢您的帮助！

Answer 1:

注意：您还没有表现出我们HTML看起来你如何，但根据您的问题，我会假设你不使用相对URL从文档根目录。

您可以使用相对URL，但他们应该根据文档根是相对的。

因此，例如，你可能有这样的事情在你的HTML

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

你真的应该做这种方式（注意除了一开始的“/”斜线）

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

这是不特定于angularjs的东西，它是一个HTML的事情，看到这个答案的更多细节。

为什么你的浏览器使用的理由/e/ url中是因为浏览器实际要求有一个资源/e/ url中。 该浏览器不知道你的服务器有一个文件，是不是在回应/e/目录。

因此，如果你有没有开始斜杠相对URL，这将是相对路径或原请求的资源。 你想要的是使用相对URL中，开始斜线。

文章来源: HTML5 pushState Clash w/Angular UI-Router URL Routing