URL relatives pour les fichiers Javascript

StackOverflow https://stackoverflow.com/questions/108853

  •  01-07-2019
  •  | 
  •  

Question

J'ai un code dans un fichier javascript qui doit renvoyer des requêtes au serveur. La question est de savoir comment trouver l’url du script dans lequel je me trouve afin de pouvoir créer une URL de requête appropriée pour ajax.

Ie., le même script est inclus sur /, /help, /whatever, etc., alors qu'il aura toujours besoin de demander à /data.json. En outre, le même site est exécuté sur des serveurs différents, où le dossier <=> - peut être placé différemment. J'ai les moyens de résoudre l'URL relative dans laquelle j'inclus le Javascript (modèle ez-publish), mais pas dans le fichier javascript lui-même.

Existe-t-il de petits scripts qui fonctionneront sur tous les navigateurs conçus à cet effet?

Était-ce utile?

La solution

Pour cela, j'aime bien insérer <link> des éléments dans la <head> page, contenant les URL à utiliser pour les demandes. Ils peuvent être générés par votre langage côté serveur afin qu'ils pointent toujours vers la vue correcte: 

<link id="link-action-1" href="${reverse_url ('action_1')}"/>

devient 

<link id="link-action-1" href="/my/web/root/action-1/"/>

et peut être récupéré par Javascript avec: 

document.getElementById ('link-action-1').href;

Autres conseils

document.location.href vous donnera l'URL actuelle, que vous pourrez ensuite manipuler à l'aide des fonctions de chaîne de JavaScript.

Il est impossible pour le client de déterminer la racine de l'application Web sans que le serveur ne le prévienne, car il n'a pas connaissance de la configuration du serveur. Une option que vous pouvez essayer consiste à utiliser l'élément de base à l'intérieur de l'élément head pour que le serveur le génère de manière dynamique plutôt que de le coder en dur (il affiche donc l'URL appropriée pour chaque serveur): 

<base href="http://path/to/webapp/root/" />

Toutes les URL seront alors traitées comme relatives à cela. Vous devez donc simplement adresser votre demande à /data.json. Vous devez toutefois vous assurer que tous les autres liens de l'application en tiennent compte.

Si le script connaît son propre nom de fichier, vous pouvez utiliser le document. getElementsByTagName (). Parcourez la liste jusqu'à trouver le script qui correspond au vôtre, puis extrayez l'URL complète (ou relative) de cette façon.

Voici un exemple: 

function getScriptUrl ( name ) {
    var scripts = document.getElementsByTagName('script');
    var re = RegExp("(\/|^)" + name + "$");
    var src;
    for( var i = 0; i < scripts.length; i++){
        src = scripts[i].getAttribute('src');
        if( src.match(re) )
            return src;
    }
    return null;
}

console.log( 'found ' + getScriptUrl('demo.js') );

Notez que cette approche est soumise aux collisions de noms de fichiers.

J'inclus le code suivant dans le point d'entrée principal de ma bibliothèque (main.php): 

/**
 * Build current url, depending on protocal (http/https),
 * port, server name and path suffix
 */
$site_root = 'http';
if (isset($_SERVER["HTTPS"]) && $_SERVER["HTTPS"] == "on") 
    $site_root .= "s";
$site_root .= "://" . $_SERVER["SERVER_NAME"];
if ($_SERVER["SERVER_PORT"] != "80")
    $site_root .= ":" . $_SERVER["SERVER_PORT"];
$site_root .= $g_config["paths"]["site_suffix"];

$g_config["paths"]["site_root"] = $site_root;

$ g_config est un tableau global contenant des options de configuration. Ainsi, site_suffix pourrait ressembler à: & Quot; / sites_working / thesite / public_html & Quot; sur votre boîte de développement, et juste " / " sur un serveur avec un hôte virtuel (nom de domaine).

Cette méthode est également bonne, car si quelqu'un tape l'adresse IP de votre zone de développement, il utilisera cette même adresse IP pour créer le chemin d'accès au dossier javascript au lieu de quelque chose comme & "localhost, quot; et si vous utilisez & "; localhost &"; il utilisera " localhost " pour construire l'URL.

Et comme il détecte également SSL, vous n'aurez plus à vous soucier de la météo. Vos ressources seront envoyées via HTTP ou HTTPS si vous ajoutez le support SSL à votre serveur.

Ensuite, dans votre modèle, utilisez 

<link id="site_root" href="<?php echo $g_config["paths"]["site_root"] ?>"/>

Ou 

<script type = "text/javascript">
var SiteRoot = "<?php echo $g_config["paths"]["site_root"]; ?>";
</script>

Je suppose que ce dernier serait plus rapide.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top