8
votes

Résoudre les URL relatives en JavaScript

Je construis Je construis une bibliothèque JS qui a besoin d'examiner la forme [Action] et de valeurs [href] et de les résoudre en URL absolus.

Par exemple, je suis sur http: // A / B / C / D; P? Q et rencontrez une valeur HREF de "../g" (supposons qu'il n'y a pas d'élément ). L'absolu résultant serait: http: // a / b / g.

Y a-t-il une bibliothèque JS qui le fait déjà? Je devrais le croire.

Pour plus d'informations sur ce qui est nécessaire, la spécification: https://www.rfc-editor.org/rfc/rfc3986#ssection- 5.4


0 commentaires

4 Réponses :


17
votes

Il s'avère que l'attribut .href d'un élément (non .getattribute ('href') , mais .href ) renvoie l'URL résolue (absolue).


2 commentaires

En d'autres termes, la propriété dom (accédée via someanchorelement.href ) renvoie l'URL résolue et l'attribut html (accédée via someanchorelement.getattribute ('href') ou someanchorelement.attributes.href ) le retourne comme à l'origine écrit dans le HTML. (Eh bien, même ce n'est pas 100% vrai, mais Googling 'PROP vs ATTR' va parcourir beaucoup de discussions pertinentes.)


Exactement, vous n'avez pas besoin d'une bibliothèque pour le faire.



1
votes

belle solution pure js qui fonctionne sans DOM: https://gist.github.com/1088850 (fonctionne partout, mais particulièrement utile pour JS côté serveur).


0 commentaires

15
votes

Dans les navigateurs et nœuds modernes, le constructeur d'URL intégré gère ceci: xxx pré>

(rendement http: //a.example/with/a/long/path. Fichier? Newsearch Code>) P>

Si vous souhaitez que la base soit relative au document actuel, vous pouvez le faire explicitement: p>

u = (new URL("?newSearch", document.location)).href


0 commentaires

1
votes

Le javascript URL constructeur traite des URL relatives . Donc, dans votre cas: xxx


2 commentaires

Pourquoi préféreriez-vous le .Origin sur window.location ou document.location ? Cela briserait le chemin relatif de l'OP ("../g"), ainsi que des fragments relatifs ou des chaînes de recherche.


@ERICP Je ne me souviens pas de pourquoi, franchement, mais vous avez raison, origine ne conviendrait pas au cas de l'OP. Quoi qu'il en soit, en ayant un deuxième regard sur la question de l'OP, il semble que le paramètre de base provienne de l'attribut action d'un élément formulaire DOM, pas de l'emplacement actuel (bien que Plus tard dans sa question, le «je suis sur» peut suggérer autrement). En ce qui concerne les cordes de recherche, selon sa question, il n'est pas intéressé à les garder. J'ai édité ma réponse avec un extrait plus pertinent.