Utilisation de Prototype pour charger un fichier JavaScript à partir d'un autre domaine

Question

En utilisant Prototype, quelqu'un sait comment charger un fichier javascript en utilisant Ajax.Request d'un autre domaine? Ou si c'est possible?

Je crois que cela est possible avec jquery, digg le font pour charger l'API Facebook:

jQuery.ajax({type:"GET", 
url:"http://static.ak.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php", 
cache:true, dataType:"script"}); 

Source: http://cotnet.diggstatic.com/js/loader/370/digg_facebook

Sans regarder le code, je devine jquery a les SMARTS utiliser un proxy quand l'URL viole la même politique d'origine et dataType est un script.

Answer 1

Vérifiez this out .. Il semble qu'il existe un plugin spécifique qui active la fonctionnalité dans la bibliothèque Prototype, l'auteur mentionne que, par exemple. jQuery le supporte déjà depuis longtemps, mais il semble qu'il ne soit pas supporté par défaut par Prototype.

Answer 2

Pour répondre à Thomas, j'ai créé une classe FacebookApiLoader pour cela. Voici la source, seulement testé dans Firefox 3 pour le moment. J'espère que cela aide quelqu'un. Qu'est-ce que cela fait est de voir s'il y a des éléments facebook api dépendant sur la page, et s'il y a alors, il va charger le script api facebook en l'insérant avant la balise de fermeture du corps. Cela dépend de la bibliothèque PrototypeJS. Appelez facebookApiLoader.observe() dans une page qui pourrait nécessiter l'API facebook.

var FacebookApiLoader = Class.create({ 
    initialize: function() { 
    this.observer = null 
    this.observedElement = null 
    }, 
    apiDependentsVisible: function() { 
    if (null == this.observedElement) { 
     // $('facebook-login') is a div in my site that 
     // is display:none initially. Once it is made 
     // visible then the facebook api is needed. 
     // Replace 'facebook-login' with id relevant for your site 
     this.observedElement = $('facebook-login') 
    } 
    return this.observedElement.visible() 
    }, 
    apiLoadCompleted: function() { 
    try { 
     return !Object.isUndefined(FB) && !Object.isUndefined(FB_RequireFeatures) 
    } catch (e) { 
    } 
    return false 
    }, 
    initAndRequireFeatures: function() { 
    FB_RequireFeatures(["XFBML"], 
     function() { 
     FB.init('secret-put-your-app-value-here','/xd_receiver.html', {}) 
     } 
    ); 
    }, 
    initFacebookConnect: function() { 
    new PeriodicalExecuter(function(pe) { 
     if (this.apiLoadCompleted()) { 
     this.initAndRequireFeatures() 
     pe.stop() 
     } 
    }.bind(this), 0.2); 
    }, 
    loadApi: function() { 
    // Use body for facebook script as recommended in Facebook 
    // docs not to insert in head as some browsers have 
    // trouble with it 
    body = $$('body')[0] 
    // TODO use https protocol if page is secure 
    script = new Element('script', { 'type': 'text/javascript', 
     'src': 'http://static.ak.connect.facebook.com/js/api_lib/v0.4/FeatureLoader.js.php' }) 
    body.appendChild(script) 
    this.initFacebookConnect() 
    }, 
    loadApiIfRequired: function() { 
    if (this.apiDependentsVisible()) { 
     this.observer.stop() 
     this.loadApi() 
    } 
    }, 
    observe: function() { 
    if (null == this.observer) { 
     this.observer = new PeriodicalExecuter(this.loadApiIfRequired.bind(this), 0.2) 
    } 
    } 
}); 
// The FacebookApiLoader attributes are lazily loaded 
// so creating a new facebookApiLoader 
// is as low resource usage as possible 
var facebookApiLoader = new FacebookApiLoader(); 

ensuite sur une page qui pourraient avoir besoin du api Facebook sur demande, appelez

facebookApiLoader.observe();