[# 21] Htaccess: URL'er med omskrivningsregler forskelligt

Jeg prøver at gøre min url ud fra dette:

example.com/view.php?id=15 

Til dette:

example.com/watch/15 

Min kode ind .htaccess er som følgende:

Options -Indexes Options +FollowSymlinks RewriteEngine On RewriteRule ^watch/([^/]+) view.php?id=$1 [NC] 

Nu hvis jeg går til example.com/watch/15 det indlæser indholdet, men uden JS, CSS, fordi det i dette tilfælde ser efter CSS og JS under /watch mappe, der ikke findes.

Hvordan får jeg denne mulighed til at fungere korrekt? Jeg vil ikke oprette urmappe og kopiere og indsætte CSS og JS, så den integreres ordentligt.

  • 1 Lav dine JS- og CSS-referencer fulde URL'er i stedet for relative.
  • ... eller inkluder base element, der refererer til den basale URL, som alle relative URL'er er i forhold til. @closetnoc, du skal tilføje det som et svar.
  • @ w3d Eller måske fordi jeg ikke er sikker på, hvad du lige sagde, måske kan du sætte det i et svar. ;-) Jeg lover at stemme op! Jeg forstår det måske bedre, når tågen løfter - lige rejste sig fra en lang lur efter 2 nætter på kun ca. 5 timers søvn hver.

At ikke kunne finde dine JavaScript- og CSS-filer er et klientside / browserproblem relateret til din URL-sti, det er ikke noget, der skal rettes i .htaccess (i det mindste ikke i dette tilfælde) - selvom det er fordi du ændrer denne URL-sti (i .htaccess) at du oplever dette problem.

Som @closetnoc foreslog i kommentarer, skyldes dette problem, at du bruger relative URL'er i din HTML. I forhold til hvad? Husk, det er brugeragenten / browseren, der løser relative URL'er i din HTML, ikke serveren. Så du skal rette dine webadresser; ikke .htaccess.

For eksempel, hvis du henviser til din CSS-fil med en i forhold URL til formularen href='styles.css' (bemærk, intet skråstregpræfiks), og du er i øjeblikket på URL'en example.com/view.php?id=15 derefter browser vil naturligvis løse din CSS URL og anmodning example.com/styles.css (i dokumentets rod). Men hvis du i øjeblikket er på URL'en example.com/watch/15 (effektivt i en /watch "underkatalog" [*1]) derefter browser vil løse din i forhold CSS URL i forhold til en /watch underkatalog snarere end dokumentets rod, så du ender med en absolut / løst URL af formularen example.com/watch/styles.css.

([*1] Bemærk, at "underkatalog" i denne sammenhæng ikke nødvendigvis er en fysisk underkatalog på din server - det er en "underkatalog" i URL-stien; et ekstra sti-segment. Men browseren kender ikke forskellen.)

Det samme gælder, hvis du bruger relative URL'er i dine brugerdefinerede fejldokumenter (defineret med ErrorDocument direktiv om Apache). Det brugerdefinerede fejldokument kan potentielt kaldes til enhver URL, så enhver relativ URL til en statisk ressource (CSS, image, JS osv.) Vil være i forhold til den URL, der forårsagede fejlen, ikke i forhold til selve fejldokumentet (hvis placering effektivt er skjult for brugeragenten).

Hvis du ændrede dine JavaScript- og CSS-webadresser til at være rodrelative (startende med en skråstreg) eller endda absolut, ville du ikke få dette problem. Dette ville være den foretrukne metode. Alternativt kan du bruge base element...

base tag / element

Alternativt kan du medtage en base element i head sektion i dit HTML-dokument (selvom dette ikke er uden forbehold [*2]). Dette refererer til den absolutte URL, som alle relative URL'er er i forhold til. Med andre ord, da du forventer, at disse relative URL'er skal være i forhold til dokumentets rod, skal du tilføje følgende til head afsnit:

 

Nu er en relativ URL som f.eks styles.css der henvises til i et dokument på URL /watch/15 vil anmode om http://example.com/styles.css, ikke http://example.com/watch/styles.css.

[*2] Der er dog nogle forbehold med at bruge base element. En primær bekymring er, at nogen i forhold URL, der er beregnet til at målrette mod nuværende dokument vil nu målrette mod basis-URL i stedet. Dette kan påvirke anker på siden som href='#top' og webadresser til formularen href='?sortby=date' osv. Og også form elementer, der sender sig selv ved hjælp af en tom action attribut (f.eks. <form action='' ...base tag som en løsning til at starte med).

Reference:

  • https://developer.mozilla.org/da-DK/docs/Web/HTML/Element/base
  • https://stackoverflow.com/questions/1889076/what-are-the-recommendations-for-html-base-tag
  • 1 Ja, det fungerer, når jeg tilføjer base i hovedafsnittet. Jeg spildte 2 timer på at prøve at finde ud af det, og alligevel er det simpelt som at tilføje 1 linje kode ...Mange tak for dit informative svar!

arbejdet for dig: Charles Robertson | Ønsker du at kontakte os?