Hub 文档

如何在 Spaces 中处理 URL 参数

Hugging Face's logo
加入 Hugging Face 社区

并获得增强的文档体验

开始使用

如何在 Spaces 中处理 URL 参数

你可以使用 URL 查询参数作为数据共享机制,例如能够深度链接到具有特定状态的应用程序。

在 Space 页面 (https://huggingface.co/spaces/<user>/<app>) 上,实际的应用程序页面 (https://*.hf.space/) 嵌入在 iframe 中。附加到父页面 URL 的查询字符串和哈希值会在初始加载时传播到嵌入式应用程序,因此嵌入式应用程序可以读取这些值,而无需特殊考虑。

相比之下,从嵌入式应用程序更新父页面 URL 的查询字符串和哈希值稍微复杂一些。 如果你想在 Docker 或静态 Space 中执行此操作,你需要添加以下 JS 代码,该代码向具有 queryString 和/或 hash 键的父页面发送消息。

const queryString = "...";
const hash = "...";

window.parent.postMessage({
    queryString,
    hash,
}, "https://huggingface.co");

这仅适用于 Docker 或静态 Spaces。

对于 Streamlit 应用程序,Spaces 会自动同步 URL 参数。 Gradio 应用程序可以从 Spaces 页面读取查询参数,但不会将更新的 URL 参数与父页面同步。

请注意,父页面的 URL 参数在初始加载时传播到嵌入式应用程序。 因此,即使使用此方法更新父 URL 哈希值,嵌入式应用程序中的 location.hash 也不会更改。

此方法的示例可以在此静态 Space 中找到:whitphx/static-url-param-sync-example

< > GitHub 上更新