脚本标签中的Kaltura缩略图视频无法起作用但显示空白

问题描述

我正在使用嵌入在React中的Kaltura缩略图作为脚本标签，当我在Basic HTML页面中使用相同的脚本标签时，它工作正常，但是当我在React中使用相同的脚本标签时，则显示为空空间而不是视频，当我检查元素时，我能够看到该脚本的所有css元素和div。这是我在React中使用的脚本标签。我是新手，请帮忙。预先感谢。

function App() {
  var x='<script src="https://cdnapisec.kaltura.com/p/3064193/sp/306419300/embedIframeJs/uiconf_id/46610723/partner_id/3064193"></script>
<div id="kaltura_player_1605008383" style="width: 560px; height: 395px;"></div>
<script>
kWidget.thumbEmbed({
  "targetId": "kaltura_player_1605008383","wid": "_3064193","uiconf_id": 46610723,"flashvars": {},"cache_st": 1605008383,"entry_id": "1_0clle8xt"
});
</script>'


return (
<div dangerouslySetInnerHTML={{__html: x}}></div>
);
}

export default App;

解决方法

此代码无法正常工作的原因很多。 Kaltura设置代码需要包含在反引号模板文字中。但是即使如此，仍未设置react来解析<script>包括。

一种方法是使用此项目：slices，该项目旨在解决该问题。

如果您使用的是react native，那么以下项目可能会起作用：https://github.com/christo-pr/dangerously-set-html-content#readme