如何使用iframe

iframe元素（内部框架的简称）被设计用来将其他来源的内容嵌入到HTML页面。例如，由于使用了iframe，你可以不用考虑创建自己的视频播放器和存储大型视频文件。相反，你可以使用YouTube，并使用iframe将所需视频添加到你的网络应用中。

为YouTube视频使用iframe

让我们看一个具体的例子。让我们创建一个页面，观看来自AppMaster YouTube 频道的关于在商业流程中使用文件的视频。要做到这一点，你需要在画布上放置一个iframe元素，指定必要的设置（例如，在大小和缩进方面），并在 Src字段中设置所需视频的链接。

同时，YouTube最初假设了这种视频嵌入的可能性，并提供了必要的工具，以最大限度地方便这一过程。通过点击视频下面的"Share"按钮，你可以使用"Embed"选项。

YouTube将提供所有必要的HTML代码，以便在其页面上放置视频，但在我们的案例中，并非所有的代码都有意义，只有一个链接到所需的视频。你需要复制它并把它放在iframe设置中。

默认的宽度和高度设置--560和315--也可以在这里看到。

你可以发布应用程序，并确保现在它真的有一个嵌入式视频。

同样地，你可以从其他来源嵌入其他类型的数据。例如，添加一个地图。

由于这些设置，你可以把地图显示为一个带有厚厚虚线边框的圆圈。

在iframe中使用自定义HTML

让我们考虑一个更复杂的选项。我们将独立地为iframe创建html页面，而不使用第三方来源的数据。要做到这一点，请在画布上添加一个 RichtextEditor元素到画布上。它允许你创建HTML，既可以借助于方便的可视化编辑器，也可以通过直接编辑HTML代码。

有必要使在编辑器中创建的任何HTML可以被保存为文件，然后通过iframe显示。让我们添加一个按钮，并创建相应的业务流程，当它被点击时将被启动。

作为业务流程的一部分，你应该。

1. 使用块从编辑器中获取HTML。 Richtext Get Properties块获取HTML。
2. 将HTML转换为字节(To Bytes).
3. 使用 Make File块来创建一个文件。请记住，要创建一个文件，你只需要它的内容(Bytes，它是在上一步中获得的）和名称（它可以是任何东西，但必须安装）。
4. 将创建的文件发送到服务器上，并将其保存到数据库中(Server request POST /_files/).
5. 获取创建的文件的ID (Expand File - ID)
6. 将ID转换为字符串 (To String)
7. 收集一个文件的链接，使用 Concat String.结果应该是一个像https://vdjyien-app.apms.io/api/_files/dQhJVTYrToCqr9G4KWKRD/download/，其中 "vdjyien-app.apms.io "是你的服务器地址，"dQhJVTYrToCqr9G4KWKRD "是在上一步中获得的文件ID。产生的链接应该在浏览器中打开。请确保文件接收端点本身(GET /_files/:id/download/)不需要授权，并且是开放的访问。
8. 如果链接是确定的，那么剩下的就是把它传递给iframe，看看结果(iFrame Update Properties).

现在，任何在 Richtext Editor可以存储在数据库中并显示在应用程序中。因此，使用iframe块，你甚至可以在你的应用程序中添加设计者最初没有提供的元素，使用非标准字体，或用自定义HTML代码创建块。