Làm cách nào để bạn tải động tệp javascript từ tên miền khác?

Question

Tôi tìm mã tuyệt vời này, được đăng bởi aemkei như câu trả lời cho câu hỏi này:

1. How do you dynamically load a javascript file? (Think C’s #include)
2. Use javascript to inject script references as needed?

Bạn có thể viết động thẻ script (sử dụng thử nghiệm):

new Element("script", {src: "myBigCodeLibrary.js", type: "text/javascript"}); 

Vấn đề ở đây là chúng tôi không biết khi nào tệp tập lệnh bên ngoài là được tải đầy đủ.

Chúng ta thường muốn mã phụ thuộc của chúng tôi trên dòng rất tới và muốn viết cái gì đó như:

if (iNeedSomeMore){ 
    Script.load("myBigCodeLibrary.js"); // includes code for myFancyMethod(); 
    myFancyMethod();      // cool, no need for callbacks! 
} 

Có một cách thông minh để tiêm script phụ thuộc mà không cần callbacks. Bạn chỉ cần kéo tập lệnh qua yêu cầu AJAX đồng bộ và đánh giá tập lệnh ở mức toàn cầu.

Nếu bạn sử dụng thử nghiệm phương pháp Script.load trông như thế này:

var Script = { 
    _loadedScripts: [], 
    include: function(script){ 
    // include script only once 
    if (this._loadedScripts.include(script)){ 
     return false; 
    } 
    // request file synchronous 
    var code = new Ajax.Request(script, { 
     asynchronous: false, method: "GET", 
     evalJS: false, evalJSON: false 
    }).transport.responseText; 
    // eval code on global level 
    if (Prototype.Browser.IE) { 
     window.execScript(code); 
    } else if (Prototype.Browser.WebKit){ 
     $$("head").first().insert(Object.extend(
     new Element("script", {type: "text/javascript"}), {text: code} 
    )); 
    } else { 
     window.eval(code); 
    } 
    // remember included script 
    this._loadedScripts.push(script); 
    } 
}; 

tôi thấy rằng, các mã không hoạt động trên IE nếu trong số họ tất cả được thực hiện trong 'file:// 'giao thức, tuy nhiên, nó không phải là vấn đề kể từ khi trường hợp sử dụng của nó liên quan đến ứng dụng web thực sự.

Tôi đã thử một lần để bao gồm http://www.google-analytics.com/urchin.js bởi google, nhưng từ một trang web, nhưng có vẻ như nó không thể yêu cầu tệp javascript từ miền khác.

Cách chúng tôi có thể tự động thêm javascript, giống như những gì ở trên tập lệnh, nhưng từ một tên miền khác?

Answer 1

Mô hình bảo mật trong trình duyệt hiện đại ngăn JavaScript thực hiện yêu cầu tên miền chéo. Điều đó có lỗ hổng (xem mọi trang web khai thác kể từ đầu của internet), nhưng việc sử dụng chúng nhiều hơn một chút râm mát và nó chỉ là vấn đề thời gian trước khi chúng được vá.

Answer 2

Điều Rex nói là chính xác, mặc dù HTML5 đã thêm thông điệp miền chéo và xhr, yêu cầu một chút công việc về phía bạn nhưng nên có thể đạt được điều này. Tuy nhiên, chúng chưa có mặt trong tất cả các trình duyệt đã phát hành (tôi nghĩ rằng các bản beta mới nhất của safari, firefox và IE có hỗ trợ một số tính năng này, nhưng tôi không chắc chắn trình duyệt nào hỗ trợ apis nào)

Answer 3

Bạn có thể sử dụng sự kiện onload và onreadystatechange để hiểu khi nào thẻ <script> được tải.

var script = new Element("script", {src: "myBigCodeLibrary.js", type: "text/javascript"}); 

script.onload = script.onreadystatechange = function(){ 
    if (!this.readyState || 
     this.readyState == "loaded" || this.readyState == "complete") { 
     //script is loaded 
    } 
};