流量检查错误：fjs.parentNode.insertBefore

Question

这里是代码

// Load the SDK asynchronously
((d, s, id) => {
    let js = null;
    let fjs = null;
    // eslint-disable-next-line prefer-destructuring
    fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.id = id;
    js.src = '//connect.facebook.net/en_US/sdk.js';
    fjs.parentNode.insertBefore(js, fjs);
})(document, 'script', 'facebook-jssdk');

这里流量检查错误：

无法调用fjs.parentNode.insertBefore，因为属性insertBefore缺少空值或未定义的[1]。

如何解决？谢谢。

Answer 1

问题是由于某种原因，它找不到<script>标签。因此，让我们尝试将其附加到文档中的某个位置：

// Load the SDK asynchronously
((d, s, id) => {
    let js = null;
    let fjs = null;
    // eslint-disable-next-line prefer-destructuring
    fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s);
    js.id = id;
    js.src = '//connect.facebook.net/en_US/sdk.js';
    (fjs ? fjs.parentNode : document.lastElementChild).insertBefore(js, fjs);
})(document, 'script', 'facebook-jssdk');

这似乎可以解决。我希望这有帮助。另外，如果您需要在生产网站上加载SDK，建议您执行以下操作。当嵌套深度不超过4时，将setTimeout延迟与0ms等效使用。

setImmediate

上面的我的代码段将在DOMContentLoaded事件之后立即异步加载脚本，以便不会阻止<script>setTimeout(function(){var d=document, s=d.createElement("script");s.id="facebook-jssdk";s.src="//connect.facebook.net/en_US/sdk.js";(d.head||d.all[1]).appendChild(s)},0);</script>。我的代码在IE4 +中应该能正常工作，而在IE10 +中则最好，但是sdk在这样的旧浏览器中可能会也可能不会工作。