# OOD app to display interface to a python app

**URL:** <https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157>\
**Category:** Get Help\
**Tags:** question\
**Created:** [December 14, 2023, 4:27am UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157 "2023-12-14T04:27:20Z")\
**Posts on this page:** 14\
**Page:** 1

<div class="post-metadata">

**Author:** ![zihaddad](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/zihaddad/32/2017_2.png) [@zihaddad](https://discourse.openondemand.org/u/zihaddad)\
**Post date:** [December 14, 2023, 4:27am UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/1 "2023-12-14T04:27:20Z")

</div>

.  
I am looking for help creating an app that allows users to interact with a python chatbot that uses gradio ([https://www.gradio.app/](https://www.gradio.app/)) to present a webpage for users to interact with the app.  
I have modified the jupyter (and VS code server) app to start the app and present the webpage. For some unknown reason I can’t display the webpage. The link look correct (OOD\_server/node/compute\_node/port#) but the page display {“details” :”Not Found”}  
if I create a desktop session on the same compute node and open firefox at 127.0.0.1:port the app display the chatbot.  
Interested if someone already built such an app to connect to a python app that serves a webpage. I am open to switching gradio if anyone has a successful connection via OOD with a different interface. For example, any success using Uvicorn or FastAPI.  
I also tried modifying the matlab app and starting firefox instead of matlab but what I found Is that firefox is not stable.. randomly firefox crashes (channel error ) and vnc session closes.  
This is my script.sh.erb (the conda env is created and the app start but fails to display the webpage {“details” :”Not Found”}

# Set working directory to home directory

SCRIPT\_DIR=“/hpc\_share/project\_mosaic/MosaicPhase1App”  
cd $SCRIPT\_DIR  
echo “Script directory: $SCRIPT\_DIR”  
echo “port= $port”

# 

# Start Project Mosaic Server

# 

module purge

CONDA\_DIR=$(echo ~/anaconda3)  
if test -d $(echo ~/anaconda3/envs); then  
CONDA\_DIR=$(echo ~/anaconda3)  
fi  
if test -d $(echo ~/.conda/envs); then  
CONDA\_DIR=$(echo ~/.conda)  
module load cuda  
module load anaconda  
conda init  
fi  
CONDA\_NAME=“Mosaic\_Env”  
CONDA\_ENV\_PATH=“${CONDA\_DIR}/envs/${CONDA\_NAME}”

if ! test -d “$CONDA\_ENV\_PATH”;  
then  
echo “Building Env”  
conda create --name $CONDA\_NAME python=3.9 -y  
source $(which conda activate 2\> /dev/null | tail -n 1) $CONDA\_NAME  
echo $(conda info)  
conda install -c conda-forge git-lfs -y  
export LLAMA\_CUBLAS=1  
export CMAKE\_ARGS=“-DLLAMA\_CUBLAS=on”  
CMAKE\_ARGS=“-DLLAMA\_CUBLAS=on” pip install llama-cpp-python --force-reinstall --no-cache-dir  
pip install -r requirements.txt --no-cache-dir

else  
echo “Activating Env”  
source $(which conda activate 2\> /dev/null | tail -n 1) $CONDA\_NAME  
echo $(conda info)  
fi

# List loaded modules

module list

# Benchmark info

echo “TIMING - Starting Project Mosaic at: $(date)”

# Launch the Project Mosaic Server

set -x

python3 app.py $port

---

<div class="post-metadata">

**Author:** ![travert](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/travert/32/3074_2.png) [@travert](https://discourse.openondemand.org/u/travert)\
**Post date:** [December 14, 2023, 5:18pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/2 "2023-12-14T17:18:26Z")

</div>

> [@zihaddad](#):
>
> an app that allows users to interact with a python chatbot that uses gradio ([https://www.gradio.app/](https://www.gradio.app/)) to present a webpage for users to interact with the app.  
> I have modified the jupyter (and VS code server) app to start the app and present the webpage.

Is there a reason you are having it launch from within other apps? Have you considered just making this a Phusion passenger app instead? Or,is there some kind of context being shared between the app and the chatbot which necessitates this setup?

We have docs here for a simple phusion passenger app:  
[https://osc.github.io/ood-documentation/latest/tutorials/tutorials-passenger-apps.html](https://osc.github.io/ood-documentation/latest/tutorials/tutorials-passenger-apps.html)

There’s a more extensive writeup on this on a current PR branch that has some technical cleanup needed before it can be merged, but this also may provide some more insight into setting this as a passenger app:  
[https://osc.github.io/ood-documentation-test/passenger-tutorial/tutorials/tutorials-passenger-apps/phusion-passenger.html](https://osc.github.io/ood-documentation-test/passenger-tutorial/tutorials/tutorials-passenger-apps/phusion-passenger.html)

---

<div class="post-metadata">

**Author:** ![zihaddad](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/zihaddad/32/2017_2.png) [@zihaddad](https://discourse.openondemand.org/u/zihaddad)\
**Post date:** [December 14, 2023, 6:01pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/3 "2023-12-14T18:01:38Z")

</div>

The app needs GPU to run depending on what resources are available the backend may run on different compute node. you can’t submit a batch job with a passenger app can you.  
tried to build an app that opens firefox but firefox crashes when using the modified matlab app. Does not crash when using a desktop session… is that because xfce panel is light window vs desktop session is a heavy window…  
Jupter app works and from what I understand jupyter is a web server. .what is the magic clue that makes the jupyter app display connect to jupyter that i am missing with gradio …  
The main question how to build an generic app to connect to any webserver (not just jupyter) running on a compute node serving a page

---

<div class="post-metadata">

**Author:** ![travert](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/travert/32/3074_2.png) [@travert](https://discourse.openondemand.org/u/travert)\
**Post date:** [December 14, 2023, 6:29pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/4 "2023-12-14T18:29:59Z")

</div>

> [@zihaddad](#):
>
> The app needs GPU

Got it.

> [@zihaddad](#):
>
> you can’t submit a batch job with a passenger app can you.

OOD is a passenger app so technically, yes. But I think I’m understanding this better now and a passenger app may not be what is needed.

With a desktop, you are on the compute node and i’m guessing what you mean by Heavy vs Light is correct. The matlab app is more stripped down and simply presenting that app on the desktop:

> <https://github.com/OSC/bc_osc_matlab/blob/master/template/script.sh.erb>

Jupyter comes with an HTTP server built in, so the way to connect up to it is not the same as for something like Matlab where we use vnc. For jupyter, it can send and receive HTTP traffic. That’s why if you look at the `view` you see some code around using a password, a host, and port that is sent back to connect up to the server:

> <https://github.com/OSC/bc_classroom_jupyter/blob/main/view.html.erb>

So, that Jupyter app will provide the best guidance for connecting to an HTTP webserver that comes with an app, but it requires some knowledge of how that app does this and passing some of that back to the `view` using the `template` directory and the `script`s there like with what you see for Jupyter.

---

<div class="post-metadata">

**Author:** ![zihaddad](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/zihaddad/32/2017_2.png) [@zihaddad](https://discourse.openondemand.org/u/zihaddad)\
**Post date:** [December 14, 2023, 8:32pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/5 "2023-12-14T20:32:40Z")

</div>

this is my view.html.erb file:  
[view.html.erb.txt](https://discourse.openondemand.org/uploads/short-url/wmHy6XAQKezLQTaWVbrSbpDpRf1.txt) (208 Bytes)

this open up  
[https://OOD/node/compute\_node/8192](https://OOD/node/compute_node/8192)  
what get displayed is {“detail”:“Not Found”}  
am i missing something or do i have a broken pipe…because i know the app started on the compute node and on port 8192 web server is serving:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/9/9f5b9f93e89446315da6ebfbc5141b81c5cd2d1f.png)

---

<div class="post-metadata">

**Author:** ![travert](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/travert/32/3074_2.png) [@travert](https://discourse.openondemand.org/u/travert)\
**Post date:** [December 14, 2023, 9:58pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/6 "2023-12-14T21:58:18Z")

</div>

It sounds like something is wrong with the URL used looking at the ` {“detail”:“Not Found”}` that you are seeing if the `port` is correct and open.

Yeah, I’m thinking that this is the most likely issue, that this is starting but the place you are sent is incorrect, and this is likely because the proxy may not be setup to handle this correctly.

Are you seeing any hints in the logs: [Logging — Open OnDemand 3.0.3 documentation](https://osc.github.io/ood-documentation/latest/how-tos/monitoring/logging.html)

---

<div class="post-metadata">

**Author:** ![jeff.ohrstrom](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/jeff.ohrstrom/32/136_2.png) [@jeff.ohrstrom](https://discourse.openondemand.org/u/jeff.ohrstrom)\
**Post date:** [December 15, 2023, 4:10pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/7 "2023-12-15T16:10:50Z")

</div>

Try `/rnode/<%= host %>/<%= port %>` in your view.html.erb instead of `/node`.

The difference is

- Use `node` when the origin server (your app) knows it’s behind a proxy. It’s hard to find the docs from Gradio on this, but it’s something about mounting the application with a `custom path`.
- Use `rnode` when the origin server (your app) doesn’t know it’s behind a proxy. This way we’ll re-write urls in apache and send requests to the origin server (your app) as if they’re local like what you have in a browser in a desktop.

That said - I’ve had issues with gradio apps serving assets correctly, so even then, you may still need work.

---

<div class="post-metadata">

**Author:** ![zihaddad](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/zihaddad/32/2017_2.png) [@zihaddad](https://discourse.openondemand.org/u/zihaddad)\
**Post date:** [December 15, 2023, 8:29pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/8 "2023-12-15T20:29:53Z")

</div>

yes that fixed it … I actually compared the jypyter view.html.erv against code server view.html.erb and found the /node/ vs /rnode/ and voila magic.

 ![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/2/26633d41bd5d98e4f8bda0a5efa4f3f6e8c43479.png)

![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/6/6d96e1aab492c65a9e5be4e9e747bc894c791cc0.png)

I did not know the reason so thanks for the explanation that makes it easy next time we write a new app.  
really thanks for the quick support and awesome product.

---

<div class="post-metadata">

**Author:** ![luvres](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/luvres/32/1211_2.png) [@luvres](https://discourse.openondemand.org/u/luvres)\
**Post date:** [January 26, 2024, 2:17am UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/9 "2024-01-26T02:17:11Z")

</div>

I’m trying to run an app with Gradio and it seems that the POST methods are not loaded.

Here’s the difference between loading locally:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/0/02ad3a9fd55def559570f04254e8e4b19b27df60.png)

And with Interactive Apps:

 ![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/2/2a94f0cd2e2d57428ef134e4314da13781e3d1c2.png)

---

<div class="post-metadata">

**Author:** ![jeff.ohrstrom](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/jeff.ohrstrom/32/136_2.png) [@jeff.ohrstrom](https://discourse.openondemand.org/u/jeff.ohrstrom)\
**Post date:** [January 26, 2024, 4:20pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/10 "2024-01-26T16:20:20Z")

</div>

Yea I’ve had issues proxying to gradio applications. Is your application able to recognize it’s behind a proxy? That could help - configure the app with the right `node` url and use it.

---

<div class="post-metadata">

**Author:** ![luvres](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/luvres/32/1211_2.png) [@luvres](https://discourse.openondemand.org/u/luvres)\
**Post date:** [January 26, 2024, 7:04pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/11 "2024-01-26T19:04:02Z")

</div>

Could you give me an example?

---

<div class="post-metadata">

**Author:** ![jeff.ohrstrom](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/jeff.ohrstrom/32/136_2.png) [@jeff.ohrstrom](https://discourse.openondemand.org/u/jeff.ohrstrom)\
**Post date:** [January 26, 2024, 7:07pm UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/12 "2024-01-26T19:07:56Z")

</div>

It’s app dependent, but here’s how we configure Jupyter to use a different base url. So when that app boots up, it recognizes that the URL paths should have that prefix.

> <https://github.com/OSC/bc_osc_jupyter/blob/6104427a4bdd9dbee2df782ca9a5f00177399c98/template/before.sh.erb#L103>

---

<div class="post-metadata">

**Author:** ![luvres](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/luvres/32/1211_2.png) [@luvres](https://discourse.openondemand.org/u/luvres)\
**Post date:** [January 30, 2024, 1:47am UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/13 "2024-01-30T01:47:33Z")

</div>

I use Jupyter in several ways with stage parameters, but in the specific case with Gradio the call is like this:

```auto
apptainer run --nv --cleanenv \
--env CLI_ARGS="--listen --listen-host ${host} --listen-port ${port}" \
container.sif

```

I believe the path is through the file `view.html.erb`

```auto
<form action="/rnode/<%= host %>/<%= port %>/" method="get" target="_blank">
  <button class="btn btn-primary" type="submit">
    <i class="fa fa-cogs"></i> Connect to Text Generation Webui
  </button>
</form>

```

I tried something like:

```auto
--env CLI_ARGS="--listen --listen-host /node/${host}/${port}/ --listen-port ${port}"

```

but it did not work.

I changed the method to “post”, but only “get” works and it doesn’t load the rest of the page which depends on “post”

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/b/bae70bd0ed39a3ae769c2108155f4cb3e9da8385.png) [@system](https://discourse.openondemand.org/u/system)\
**Post date:** [July 28, 2024, 1:48am UTC](https://discourse.openondemand.org/t/ood-app-to-display-interface-to-a-python-app/3157/14 "2024-07-28T01:48:04Z")

</div>

Closed on July 28, 2024, 1:48am UTC

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.
