2010-09-18 3 views
8

Est-il possible de charger des fichiers JavaScript distants à partir de la barre d'adresse?Charger des fichiers JavaScript distants via la barre d'adresse

J'ai essayé de mettre cela dans la barre d'adresse:

javascript:src='http://depot.com/file.js';funcname(); 

Je ne suis pas en utilisant cela pour les mauvaises choses. Je ne fais que tester mon site, c'est tout. Si vous vouliez protéger votre site, vous devez apprendre à l'attaquer en premier, n'est-ce pas?

+0

dans la barre d'adresse ... Que voulez-vous dire? –

+1

Je suppose que vous l'utilisez pour de mauvaises choses ... "ne soyez pas mal" :) – Topera

+2

Qu'est-ce qui est mal en ajoutant quelques Unicrons? :) –

Répondre

9

Je suppose que vous devriez être en mesure de faire ce qui suit:

javascript:(function() { 
    var newScript = document.createElement('script'); 
    newScript.type = 'text/javascript'; 
    newScript.src = 'http://depot.com/file.js'; 
    document.getElementsByTagName('body')[0].appendChild(newScript); 
})(); 

Voici un exemple très utile (coller dans votre barre d'adresse):

javascript:(function() { 
    var newScript = document.createElement('script'); 
    newScript.type = 'text/javascript'; 
    newScript.src = 'http://cornify.com/js/cornify.js'; 
    document.getElementsByTagName('body')[0].appendChild(newScript); 

    for (var i = 0; i < 5; i++) { 
    newScript = document.createElement('script'); 
    newScript.type = 'text/javascript'; 
    newScript.src = 'http://cornify.com/js/cornify_run.js'; 
    document.getElementsByTagName('body')[0].appendChild(newScript); 
    } 
})(); 

Voila:

Stack Overflow cornified

En fait, c'est ainsi que cornify.com est inclus les scripts distants dans leur bookmarklet.


MISE À JOUR:

Comme @Ben noted in the other answer, ce n'est pas facile d'appeler une fonction définie dans votre script distant. Ben suggère une solution à ce problème, mais il y a aussi une autre solution, celle que les cornifiants utilisent. Si vous vérifiez http://cornify.com/js/cornify_run.js, vous verrez qu'il n'y a qu'un seul appel de fonction dans ce fichier. Vous pouvez placer votre appel funcname() dans un fichier JavaScript distinct, comme le font les cornify, car les blocs de script sont garantis être exécutés dans l'ordre où ils sont insérés. Ensuite, vous auriez à inclure les deux scripts, comme dans l'exemple suivant:

javascript:(function() { 
    var newScript = document.createElement('script'); 
    newScript.type = 'text/javascript'; 
    newScript.src = 'http://depot.com/file.js'; 
    document.getElementsByTagName('body')[0].appendChild(newScript); 

    newScript = document.createElement('script'); 
    newScript.type = 'text/javascript'; 
    newScript.src = 'http://depot.com/file_run.js'; 
    document.getElementsByTagName('body')[0].appendChild(newScript); 
})(); 

Lorsque le file_run.js comprend simplement un appel à funcname().

+0

merci beaucoup :) – kapitanluffy

+1

+1 pour le graphisme soigné. – balupton

+0

alors file_run.js contient funcname (params) right? – kapitanluffy

2

Il n'existe aucun moyen direct de le faire, cependant un hack commun consiste à exécuter quelques lignes de JavaScript qui insèrent un tag dans la page en cours, en définissant son attribut src sur l'URL du script que vous souhaitez exécuter:

javascript:var s=document.createElement("script");s.src="http://depot.com/file.js";s.type="text/javascript";document.getElementsByTagName("body")[0].appendChild(s); 

Si vous souhaitez exécuter une fonction définie dans le fichier distant (à la funcname() dans votre question), qui est un peu plus délicat. Cela est dû au fait que le chargement des scripts via une balise est exécuté de manière asynchrone et que le chargement du fichier n'a donc probablement pas été terminé lorsque vous avez ajouté l'élément au DOM. La seule façon que je peux penser à se déplacer est de définir une fonction avant d'insérer l'élément, que vous appelez ensuite à la fin du fichier source inclus:

function doStuff() { 
    // run code that depends on the included JS file 
}; 
// include the external script, as per the snippet above 

Vous souhaitez ensuite inclure un appel à doStuff à la fin du fichier inclus:

if(doStuff) doStuff(); 

le résultat final ressemble à quelque chose comme ceci:

javascript:function doStuff(){funcname()};var s=document.createElement("script");s.src="http://depot.com/file.js";s.type="text/javascript";document.getElementsByTagName("body")[0].appendChild(s); 
+0

+1 pour avoir mentionné le problème asynchrone lors de l'appel 'funcname()' ... J'ai suggéré une autre solution dans ma réponse (empruntée à la cornée). –

2

Pas directement une réponse, mais néanmoins utile.

Voici un script pour charger dans un fichier javascript lorsqu'il est utilisé dans un signet:

javascript:var%20e=document.createElement('script');e.setAttribute('language','javascript');e.setAttribute('src','http://github.com/balupton/ajaxy-bookmark/raw/master/script.js');document.body.appendChild(e);void(0); 
Questions connexes