将您的 Space 嵌入另一个网站

Space 运行起来后，您可能希望将其嵌入网站或博客中。嵌入或分享您的 Space 是一个很棒的方式，可以让您的受众与您的作品和演示进行互动，而无需进行任何设置。要嵌入 Space，其可见性需要设置为公开。

直接 URL

每个 Space 都有一个唯一的 URL，您可以使用它来分享您的 Space 或将其嵌入网站。

此 URL 的格式为："https://<space-subdomain>.hf.space"。例如，Space NimaBoscarino/hotdog-gradio 对应的 URL 为 "https://nimaboscarino-hotdog-gradio.hf.space"。子域是唯一的，只有在您移动或重命名 Space 时才会发生变化。

您的 Space 始终从该子域的根目录提供服务。

您可以从选项菜单中找到 Space URL 以及如何将其嵌入的示例代码段。

使用 IFrame 嵌入

Space 的默认嵌入方法是使用 IFrame。在您要嵌入 Space 的 HTML 位置添加以下元素

<iframe
    src="https://<space-subdomain>.hf.space"
    frameborder="0"
    width="850"
    height="450"
></iframe>

例如，使用 NimaBoscarino/hotdog-gradio Space

使用 WebComponents 嵌入

如果您要嵌入的 Space 基于 Gradio，您可以使用 WebComponents 来嵌入您的 Space。WebComponents 比 IFrame 更快，并且会自动调整以适应您的网页，因此您无需为元素配置 width 或 height。首先，您需要导入与 Space 中 Gradio 版本相对应的 Gradio JS 库，方法是在您的 HTML 中添加以下脚本。

然后，在您要嵌入 Space 的位置添加一个 gradio-app 元素。

<gradio-app src="https://<space-subdomain>.hf.space"></gradio-app>

查看 Gradio 文档 以了解更多详细信息。