jsemrau
September 16, 2025, 4:47am
1
I have been running a multi-agent using HF Smolagents and Gradio UI locally for a while and was so far quite happy with it.
I wanted to explore what needs to be done to run it in Spaces, so I created a Space to run it. After a few trials, i got it to run, but the UI looks completely different and UI elements are not clickable.
Both use the same gradio version (5.45.0) and are based on the correct requirements.txt. Based on the error log on the broweser its indicated that css/javascript is the issue. But I have no clue how to fix this?
What are next steps that I can use to debug it?
1 Like
Hmm… Try demo.launch(ssr_mode=False) for now. And ensure specify version in REAMDE.md.
---
sdk: gradio
sdk_version: 5.45.0
app_file: app.py
---
1 Like
jsemrau
September 16, 2025, 5:11am
3
If I remove server side rendering nothing is rendered.
1 Like
I’ve never seen this symptom before…README.md, app.py, and requirements.txt might be causing trouble…
Could it be that there are resources like CSS in the repository, but they’re set to Private (resulting in a 404 error without a token), so Gradio can’t access them…?
1 Like
jsemrau
September 16, 2025, 5:24am
5
Thank you for your help1 It’s a standard README. But you nudged me in the right direction. The site needs to be public and can’t be private.
1 Like
While you could manually place it on a repository in a private space, I think using a public resource is simpler.
opened 12:57AM - 03 Dec 24 UTC
closed 08:09PM - 10 Jul 25 UTC
bug
Priority
SSR
### Describe the bug
If I select fonts using Google Fonts at the time of cons… tructing a block, as shown below, the Google Fonts are not displayed correctly when server-side rendering (SSR) is enabled. The theme is loaded correctly though while the fonts fall back to some default serif font. SSR is enabled, by default, when deploying to Hugging Face Spaces.
```python
with gr.Blocks(
title=self.app_name,
fill_height=True,
fill_width=True,
analytics_enabled=False,
theme=gr.themes.Ocean(
radius_size="md",
font=gr.themes.GoogleFont("Lato", weights=(100, 300)),
font_mono=gr.themes.GoogleFont("IBM Plex Mono", weights=(100, 300)),
),
):
# My code goes here
```
See full code at https://github.com/anirbanbasu/gradio-experiments/blob/4ee3dea7459a5ab6d760c2e650c1802cf30723ac/src/app.py#L253 and its deployment at https://huggingface.co/spaces/anirbanbasu/gradio-experiments.
The fonts can be picked up correctly in the Hugging Face Spaces deployment if I explicitly disable SSR, e.g., at https://github.com/anirbanbasu/gradio-experiments/blob/4ee3dea7459a5ab6d760c2e650c1802cf30723ac/src/app.py#L306.
### Have you searched existing issues? 🔎
- [X] I have searched and found no existing issues
### Reproduction
```python
import gradio as gr
class GradioApp:
def make_ui(self) -> gr.Blocks:
with gr.Blocks(
theme=gr.themes.Ocean(
radius_size="md",
font=gr.themes.GoogleFont("Lato", weights=(100, 300)),
font_mono=gr.themes.GoogleFont("IBM Plex Mono", weights=(100, 300)),
),
) as ui:
gr.Markdown("Hello world!")
return ui
if __name__ == "__main__":
app = GradioApp()
app.make_ui().queue().launch(
share=False,
# We can omit the ssr_mode setting if it is deployed to Hugging Face Spaces where it is enabled by default.
ssr_mode=True
)
```
### Screenshot
<img width="1452" alt="Screenshot 2024-12-03 at 9 53 43" src="https://github.com/user-attachments/assets/1219eb92-9b76-40b8-8cea-d29fac77b06c">
which should have looked like this instead
<img width="1386" alt="Screenshot 2024-12-03 at 10 10 25" src="https://github.com/user-attachments/assets/fd6acf75-d360-470e-aa37-eb24389d9f31">
### Logs
```shell
* Running on local URL: http://0.0.0.0:7860, with SSR ⚡
To create a public link, set `share=True` in `launch()`.
```
### System Info
```shell
Gradio Environment Information:
------------------------------
Operating System: Linux
gradio version: 5.7.1
gradio_client version: 1.5.0
------------------------------------------------
gradio dependencies in your environment:
aiofiles: 23.2.1
anyio: 4.6.2.post1
audioop-lts is not installed.
fastapi: 0.115.5
ffmpy: 0.4.0
gradio-client==1.5.0 is not installed.
httpx: 0.28.0
huggingface-hub: 0.26.3
jinja2: 3.1.4
markupsafe: 2.1.5
numpy: 2.1.3
orjson: 3.10.12
packaging: 24.2
pandas: 2.2.3
pillow: 11.0.0
pydantic: 2.10.2
pydub: 0.25.1
python-multipart==0.0.12 is not installed.
pyyaml: 6.0.2
ruff: 0.8.1
safehttpx: 0.1.6
semantic-version: 2.10.0
starlette: 0.41.3
tomlkit==0.12.0 is not installed.
typer: 0.14.0
typing-extensions: 4.12.2
urllib3: 2.2.3
uvicorn: 0.32.1
authlib; extra == 'oauth' is not installed.
itsdangerous; extra == 'oauth' is not installed.
gradio_client dependencies in your environment:
fsspec: 2024.9.0
httpx: 0.28.0
huggingface-hub: 0.26.3
packaging: 24.2
typing-extensions: 4.12.2
websockets: 12.0
```
### Severity
I can work around it
opened 07:53PM - 04 Apr 24 UTC
closed 06:24PM - 07 Apr 24 UTC
bug
needs repro
cloud
I have tried all the solutions listed in this issue as well as #3798, #3662, #34… 82, #3472 and https://stackoverflow.com/questions/61641514/css-not-recognized-when-served-with-fastapi.
Solutions that I have tried include:
- Mounting the subapp to my FastAPI app
- Providing a root_path to the FastAPI declaration
- Providing a root_path to the mount_gradio_app() method
- Using both the mount function from FastAPI in conjunction with the mount_gradio_app()
- Downgrading and upgrading gradio to 3.50.1, 4.19.0, 4.20.0, 4.21.0, 4.25.0
My issue is the same as stated in the issue title of #3472. When running behind a proxy and load balancer, the gradio app requests the theme.css at the root of the url and not after the url+prefix. I have tried providing the root_path at the app.mount_gradio_app(root_path=) level and at the app=FastAPI(rooth_path=) level.
The gradio app runs at the provided root_path but the theme.css file is requested at the url without the root_path:
<img width="1170" alt="Screenshot 2024-04-04 at 3 29 04 PM" src="https://github.com/gradio-app/gradio/assets/6021481/d501ea55-c1f7-4743-bf01-03fccb71f641">
I have tried a few different releases from gradio and the gradio python client and have the problem persisting.
This is a sample version of the two solutions I have tried in my code that don't provide the right url to get the theme.css. Both ways work to have the gradio app running with the prefix at https//:abc.com/app/gradio but the theme is requested at https//:abc.com/gradio and fails.
Try 1:
```from fastapi import FastAPI
import gradio as gr
import uvicorn
app = FastAPI(root_path="/app")
@app.get('/')
def hello():
return {"message":"hello"}
g_app = gr.Interface(
lambda x: f"Hello {x}",
"textbox",
"textbox",
)
app = gr.mount_gradio_app(app, g_app, path="/gradio")
uvicorn.run(app,host="0.0.0.0",port=8080)
```
Try 2:
```
from fastapi import FastAPI
import gradio as gr
import uvicorn
app = FastAPI()
@app.get('/')
def hello():
return {"message":"hello"}
g_app = gr.Interface(
lambda x: f"Hello {x}",
"textbox",
"textbox",
)
app = gr.mount_gradio_app(app, g_app, path="/gradio",root_path="/app")
uvicorn.run(app,host="0.0.0.0",port=8080)
```
Thx for the help.
_Originally posted by @PaulClas in https://github.com/gradio-app/gradio/issues/3472#issuecomment-2038081429_
1 Like
jsemrau
September 16, 2025, 5:45am
7
Thank you. I think so too. I noticed that now my model loader is also not working. Going back to what I wanted to achieve is that it can be public, but then I don’t want to use my own keys so I need to get this from the user or user profile.
TL;DR the rendering problem is solve (thank you!). I need to instantiate the models differently and also need to rethink key management.
1 Like
It is recommended to use Secrets for managing API keys and similar credentials . Secrets are a type of environment variable, but they are hidden from others. Regular environment variables are completely visible to others…
1 Like
jsemrau
September 16, 2025, 10:18am
9
Thanks. That’s what I had already implemented. But they are tied to my account setup. Therefore, if this Space is public, I would incur the cost of people potentially using it.
1 Like
Oh. I see. In that case, you’d either use Gradio’s LoginButton or explicitly provide a field for entering the token.
1 Like
jsemrau
September 16, 2025, 10:25am
11
That’s exactly what I was looking for!
Thank you so much!
1 Like
