Injectez une balise de script avec le src distant et attendez qu'il s'exécute

Question

Injectez une balise de script avec le src distant et attendez qu'il s'exécute

Demandé el 20 de Décembre, 2011: Quand la question a-t-elle été
96916 affichage: Nombre de visites la question a
3 Réponses: Nombre de réponses aux questions
Résolu: Situation réelle de la question

Comment puis-je injecter un <script src="https://remote.com/"></script> dans ma page, attendre qu'il s'exécute, puis utiliser les fonctions qu'il définit ?

Pour info : dans mon cas, le script effectuera un traitement par carte de crédit dans de rares cas, donc je ne veux pas toujours l'inclure. Je souhaite l'inclure rapidement lorsque l'utilisateur ouvre une boîte de dialogue de modification des options de carte de crédit, puis lui envoie les nouvelles options de carte de crédit.

Éditez pour plus de détails : je n'ai pas accès au script distant.

Demandé el 20 de Décembre, 2011 par Riley Lark

Answer 1

3 Réponses

Answer 2

169voto

Pierre Points 5365

Vous pouvez utiliser la méthode de Google Analytics ou de Facebook :

 (function(d, script) {
    script = d.createElement('script');
    script.type = 'text/javascript';
    script.async = true;
    script.onload = function(){
        // remote script has loaded
    };
    script.src = 'http://www.google-analytics.com/ga.js';
    d.getElementsByTagName('head')[0].appendChild(script);
}(document));

METTRE À JOUR:

Vous trouverez ci-dessous la nouvelle méthode Facebook ; il s'appuie sur une balise de script existante au lieu de <head> :

 (function(d, s, id){
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)){ return; }
    js = d.createElement(s); js.id = id;
    js.onload = function(){
        // remote script has loaded
    };
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));

Remplacez facebook-jssdk par votre identifiant de script unique pour éviter qu'il ne soit ajouté plus d'une fois.
Remplacez l'url du script par la vôtre.

Répondu el 20 de Décembre, 2011 par Pierre (5365 Points )

Answer 3

59voto

Frank Gambino Points 599

Même méthode utilisant des écouteurs d'événement et des constructions ES2015 :

 function injectScript(src) {
    return new Promise((resolve, reject) => {
        const script = document.createElement('script');
        script.src = src;
        script.addEventListener('load', resolve);
        script.addEventListener('error', e => reject(e.error));
        document.head.appendChild(script);
    });
}

injectScript('https://example.com/script.js')
    .then(() => {
        console.log('Script loaded!');
    }).catch(error => {
        console.error(error);
    });

Répondu el 18 de Août, 2016 par Frank Gambino (599 Points )

Answer 4

6voto

keeganwatkins Points 1246

quelque chose comme ça devrait faire l'affaire :

 (function() {
    // Create a new script node
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.onload = function() {
        // Cleanup onload handler
        script.onload = null;

        // do stuff with the loaded script!

    }

    // Add the script to the DOM
    (document.getElementsByTagName( "head" )[ 0 ]).appendChild( script );

    // Set the `src` to begin transport
    script.src = "https://remote.com/";
})();

J'espère que cela pourra aider! Tchin Tchin.

Répondu el 20 de Décembre, 2011 par keeganwatkins (1246 Points )

Injectez une balise de script avec le src distant et attendez qu'il s'exécute

Réponses

Questions en vedette

Top Tags

Prograide.com

Powered by:

Injectez une balise de script avec le src distant et attendez qu'il s'exécute

Réponses

Questions en vedette

Top Tags

Dans notre réseau

Prograide.com

Powered by: