How to get data coming via an api written to streamlit?

Using Streamlit
1

I’m trying to create a little proof demo in where a fastapi endpoint will take string (sent by another docker container) and write that string to streamlit.

The project structure currently consists of 2 containers.

  • container 1 will have the ui (streamlit) and a parallel instance of fastapi that will receive information and write it to streamlit.
  • container 2 will have the engine (logic, inferencing and other stuff that executes the task) and another instance of fastapi that listens for commands for task inputs.

What I am doing with the project is when the user provides the input on the task they want done, those instructions are sent to container 2. The task takes a while and continously generates bits of output that gets sent back to container 1 to be outputted to the UI.

What I’m struggling with is to get the fastapi instance in container 1 to write data it receives into the UI. Wonder how other people do it.

2

I managed to dummy up a websocket that managed to get it a bit closer.

Problem is because streamlit reruns the file whenever a widget is pressed, whenever button ‘AD’ is pressed the websocket is lost and it won’t work. However if we don’t use button ‘AD’ and go the the url “http://app:8050/call-api” directly in the browser I can see the message being written on streamlit. However I’m stuck trying to get this to work and everything I’ve tried doesn’t work and storing async into session states seems to be a no go.

import streamlit as st
import asyncio
import websockets
import requests

WEBSOCKET_URL = "ws://app:8050/ws"

async def listen_to_websocket():
    async with websockets.connect(WEBSOCKET_URL) as websocket:
        while True:
            message = await websocket.recv()
            if message:
                    st.write(message)

async def main():
    await listen_to_websocket()


# Streamlit app
st.title("Streamlit App")

if st.button("start"):
    asyncio.run(main())

if st.button("AD"):
    response = requests.get("http://app:8050/call-api")

fastapi

import uvicorn
from typing import Union
import requests

from fastapi import FastAPI, WebSocket, WebSocketDisconnect
from fastapi.middleware.cors import CORSMiddleware
import asyncio

app = FastAPI()

app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_methods=["*"],
)

connections = set()

@app.get("/call-api")
async def call_api():
    # Notify all connected WebSocket clients
    for connection in connections:
        await connection.send_text("TEST!!!!")
    return {"message": "API called"}

@app.websocket("/ws")
async def websocket_endpoint(websocket: WebSocket):
    await websocket.accept()
    connections.add(websocket)
    try:
        while True:
            # Keep the connection alive
            await websocket.receive_text()
    except Exception as e:
        print(f"WebSocket error: {e}")
    finally:
        connections.remove(websocket)