Fix calls to the component server so that gr.FileExplorer works on Spaces (#5816)

* changes

* add changeset

* changes

* demo

* file explorer

* lint

* add changeset

---------

Co-authored-by: gradio-pr-bot <gradio-pr-bot@users.noreply.github.com>
This commit is contained in:
Abubakar Abid 2023-10-05 19:38:59 -07:00 committed by GitHub
parent 3d263ba007
commit 796145e2c4
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 20 additions and 3 deletions

View File

@ -0,0 +1,6 @@
---
"@gradio/client": patch
"gradio": patch
---
fix:Fix calls to the component server so that `gr.FileExplorer` works on Spaces

View File

@ -743,7 +743,11 @@ export function api_factory(
if (component?.props?.root_url) {
root_url = component.props.root_url;
} else {
root_url = `${http_protocol}//${host + config.path}/`;
root_url = `${http_protocol}//${resolve_root(
host,
config.path,
true
)}/`;
}
const response = await fetch_implementation(
`${root_url}component_server/`,

View File

@ -7,7 +7,7 @@ import type { Config } from "./types.js";
* Gradio apps on Hugging Face Spaces.
* @param {string} base_url The base URL at which the Gradio server is hosted
* @param {string} root_path The root path, which could be a path suffix (e.g. mounted in FastAPI app) or a full URL (e.g. hosted on Hugging Face Spaces)
* @param {boolean} prioritize_base Whether to prioritize the base URL over the root path. This is used when both the base path and root paths are full URLs. For example, for fetching files the root path should be prioritized, but for making request, the base URL should be prioritized.
* @param {boolean} prioritize_base Whether to prioritize the base URL over the root path. This is used when both the base path and root paths are full URLs. For example, for fetching files the root path should be prioritized, but for making requests, the base URL should be prioritized.
* @returns {string} the resolved URL
*/
export function resolve_root(

View File

@ -0,0 +1 @@
{"cells": [{"cell_type": "markdown", "id": 302934307671667531413257853548643485645, "metadata": {}, "source": ["# Gradio Demo: file_explorer_component"]}, {"cell_type": "code", "execution_count": null, "id": 272996653310673477252411125948039410165, "metadata": {}, "outputs": [], "source": ["!pip install -q gradio "]}, {"cell_type": "code", "execution_count": null, "id": 288918539441861185822528903084949547379, "metadata": {}, "outputs": [], "source": ["import gradio as gr \n", "\n", "with gr.Blocks() as demo:\n", " gr.FileExplorer()\n", "\n", "demo.launch()"]}], "metadata": {}, "nbformat": 4, "nbformat_minor": 5}

View File

@ -0,0 +1,6 @@
import gradio as gr
with gr.Blocks() as demo:
gr.FileExplorer()
demo.launch()

View File

@ -24,7 +24,7 @@ set_documentation_group("component")
@document()
class FileExplorer(Changeable, IOComponent, JSONSerializable):
"""
Creates a file component that allows uploading generic file (when used as an input) and or displaying generic files (output).
Creates a file explorer component that allows users to browse and select files on the machine hosting the Gradio app.
Preprocessing: passes the selected file or directory as a {str} path (relative to root) or {list[str}} depending on `file_count`
Postprocessing: expects function to return a {str} path to a file, or {List[str]} consisting of paths to files.
Examples-format: a {str} path to a local file that populates the component.