时间戳

首页 > 解决方案 > 流检查错误：fjs.parentNode.insertBefore

javascript - 流检查错误：fjs.parentNode.insertBefore

问题描述

这是代码

// 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，因为insertBeforenull 或 undefined [1] 中缺少属性。

如何解决这个问题？谢谢你。

标签： javascriptreactjsflowtype

解决方案

问题是由于某种原因它找不到<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，我建议您执行以下操作。使用setTimeout延迟0ms相当于setImmediate嵌套深度不超过 4 层。

<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>

我上面的代码片段将在 DOMContentLoaded 事件之后立即异步加载脚本，这样window.onload就不会被阻止。我的代码在 IE4+ 中应该可以正常运行，在 IE10+ 中最好，但是 sdk 可能会也可能不会在这些旧浏览器中运行。

推荐阅读