在ReactJS中动态加载TokBox嵌入脚本

Question

我正在尝试在用户单击按钮时在我的React应用程序中动态加载TokBox嵌入脚本。脚本标记正被添加到DOM并成功加载，但它不会继续下载opentok.min.js，因此视频控件永远不会呈现。直接将代码添加到index.html可以正常工作。动态加载标签有什么不同？

SNIPPIT：

import Script from 'react-load-script';
...
render() {
   return (
      <div>
         ...
         <div id="otEmbedContainer" style={{width:"300px", height:"300px"}}></div>
         {this.state.showVideo && 
            <Script
             url='https://tokbox.com/embed/embed/ot-embed.js?embedId=MYEMBEDID&room=' + this.state.roomId
            />
         }
      </div>
   )    
);

Answer 1

TokBox支持的响应：

需要注意的是，当您动态加载嵌入时。您还需要在动态加载后触发跟随事件（这是根据当前设计加载嵌入式所必需的）。

var DOMContentLoaded_event = document.createEvent("Event")
    DOMContentLoaded_event.initEvent("DOMContentLoaded", true, true)
    window.document.dispatchEvent(DOMContentLoaded_event).

我没有尝试这个，因为我现在切换到使用iframe解决方案，但在此处发布以保持连续性。