HTML5 pushState Clash mit Angular UI-Router-URL-Routing

Question

Ich habe eine Angular.js-Webanwendung, die UI-Router verwendet (https://github.com/angular-ui/ui-router) mit parallel benannten Ansichten wie diesen:

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

Ich habe HTML5 pushState über aktiviert

$locationProvider.html5Mode(true);

Wann

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

angefordert wird, sendet mein Backend die index.html im Stammverzeichnis zurück.(gemäß Verwendung von HTML5-Pushstate auf angle.js) Wenn der Browser jedoch index.html empfängt und beginnt, alle CSS/JS-Ressourcen abzurufen, sind die Anforderungen für

/e/js/script1.js

im Gegensatz zu

/js/script1.js

die nur auf der Root-Ebene existiert.Es scheint das Stammverzeichnis standardmäßig als zu verwenden mysite.com/e/ (von der angeforderten URL) und nicht das tatsächliche Stammverzeichnis, mysite.com/.

Fehlt mir hier etwas?Ist es nicht möglich, relative SRCs für mein Javascript und CSS in index.html zu verwenden?

Danke fürs Helfen!

Answer 1

Notiz:Sie haben uns nicht gezeigt, wie HTML aussieht, aber aufgrund Ihres Problems gehe ich davon aus, dass Sie es sind nicht Verwendung relativer URLs aus dem Dokumentstamm.

Sie können relative URLs verwenden, diese sollten jedoch relativ sein basierend auf dem Dokumentstamm.

So könnte beispielsweise Ihr HTML-Code so etwas enthalten

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

Sie sollten es wirklich so machen (beachten Sie den Zusatz des beginnenden Schrägstrichs „/“).

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

Das ist nichts Spezifisches für AngularJS, es ist eine HTML-Sache diese Antwort für mehr Details.

Der Grund, warum Ihr Browser das verwendet /e/ in der URL liegt daran, dass der Browser tatsächlich eine Ressource angefordert, die das hat /e/ in der URL.Der Browser weiß nicht, dass Ihr Server mit einer Datei geantwortet hat, die nicht in der Datei enthalten ist /e/ Verzeichnis.

Wenn Sie also eine relative URL ohne Schrägstrich am Anfang haben, ist diese relativ zum Pfad oder zur ursprünglich angeforderten Ressource.Sie möchten relative URLs mit einem Schrägstrich am Anfang verwenden.