除了Chrome之外，还有什么最佳的方法可以让我的HTML导入在更多的平台上工作？

Question

我在Bubble.is中有一个完全烘焙的应用程序，可以让患者通过视频聊天与临床医生预约。如果可能的话，我希望避免仅仅为了视频聊天而构建一个客户端-服务器设置。这就是为什么OpenTok的嵌入对我来说很突出。无论Bubble.is在头文件中添加了什么，当我直接嵌入OpenTok的嵌入文件时，它都会破坏它。因此，我从我拥有的另一个域上的html文件中提供了嵌入的OpenTok。所以现在我有了应用程序(app.foo.bar)和HTML (www.foo.bar/opentok.html)，并且正在尝试使用OpenTok导入。

嵌入式代码(表头)：

<script src="https://polygit.org/components/webcomponentsjs/webcomponents-loader.js"></script>
<script src="https://foo.bar/scripts/webcomponents-lite.js"></script>
<link rel="import" href="https://foo.bar/video/index.php/embed-2">

嵌入式代码(body)：

<script> window.addEventListener('HTMLImportsLoaded', function() {
var link = document.querySelector('link[rel="import"]');
var content = link.import;

 //Grab DOM from embedded OpenTok.
var el = document.querySelector('#otEmbedContainer');

document.body.appendChild(el.cloneNode(true));});</script>

正如预期的那样，这在Chrome桌面上工作得很好，但在其他地方就不行了。我可以采取哪些最佳方法来修改现有的代码，以便(至少)在移动web上运行它？

Answer 1

您可以在Bubble.io中使用iframe。您不需要使用HTML导入。在创建OpenTok嵌入时，将嵌入的网站URL设置为https://your-app-name.bubbleapps.is (将your-app-name替换为您的Bubble.is应用程序的名称)。然后在Bubble.is中，在你的应用程序中添加一个超文本标记语言元素，并粘贴OpenTok embed iframe代码作为该元素的代码。此外，您还需要将此属性添加到iframe：allow="microphone; camera"

因此，粘贴到Bubble.is HTML元素中的代码如下所示：

<iframe src="https://tokbox.com/embed/embed/ot-embed.js?embedId=your-embed-id-xxxxx&room=DEFAULT_ROOM&iframe=true" 
width=800 height=640 allow="microphone; camera" >
</iframe>

单击Bubble.is编辑器中的预览按钮，OpenTok嵌入即可工作。