如何在外部 Javascript 文件中使用 Firebase

Question

这可能是一个非常简单的问题，但我一直在尝试在与 HTML 文件一起使用的外部 javascript 文件中使用 Firebase，但无法使其正常工作。我计划将此文件用于许多其他类似的页面，因此我宁愿将其保存在外部文档中。具体来说，我的代码是：

$(function() {

var head= document.getElementsByTagName('head')[0];
var script= document.createElement('script');
script.src= 'https://cdn.firebase.com/v0/firebase.js';
head.appendChild(script);

var Database = new Firebase('https://myfirebase.firebaseIO.com/');
...

但是当我尝试运行它时，它说 Firebase 对象/关键字未定义。我知道脚本已正确附加到 HTML 页面，因为我在运行代码后检查了页面上的 HTML。

我还在某处读到过，您可能需要一台个人服务器来运行 Firebase，但坦率地说，我真的不知道这意味着什么 - 无论如何，我使用 Mac OSX 并运行我所有的 HTML 和 Javascript铬。

非常感谢！

Answer 1

问题在于，使用 document.createElement 不会强制在调用包含脚本之前加载和呈现脚本（现在正在调用它）。此方法无法保证您包含的脚本何时会被调用。

此外，您通过将脚本放在$(function() {...}) 中来加载 onDomReady 脚本；你会想立即将它插入到标题中，而不是等待整个文档加载。

最简单的答案就是把 Firebase 放到 html 页面的头部；您还没有在这里真正解释您的限制，但我认为这不是您的选择。如果是，KISS。

另一个简单的答案是使用 jQuery，因为您显然可以使用它。

$.getScript('https://cdn.firebase.com/v0/firebase.js', function() {

    // now I can use Firebase

});

您也可以使用其他方法来完成此操作（等到使用 setInterval 定义 Firebase；使用除 document.createElement 之外的其他脚本检索方法——尝试谷歌搜索“通过 javascript 加载顺序动态加载脚本”），但我认为这涵盖充分满足您的需求。