I am trying to test a simple ‘streamlit’ app using a flask server to autoplay a text to speech audio. In this example, I have a streamlit front end with only one chat input. When a prompt is input, I need the text to be sent to the flask server, be converted to audio using OpenAI’s tts generator, and be streamed back. I can then capture this audio using the html5 tag with the flask server as a source. Currently, when a prompt is input, I am adding the text into the ‘src’ url as a get request so I can stream the relevant audio. I tested this out and it works great once. However, when I input a second prompt, the flask server doesn’t even recognize a second request. It will not respond again until I refresh the page. I am completely new to web development so any help is appreciated.

Flask server code

from flask import Flask, Response, request
from waitress import serve
from openai import OpenAI
import time

app = Flask(__name__)

def generate_audio(text):
    client = OpenAI()
    with client.audio.speech.with_streaming_response.create(
            model="tts-1",
            voice='alloy',
            input=text,
            speed=1,
            response_format="wav"
        ) as response:
            for chunk in response.iter_bytes(chunk_size=1024):
                yield chunk
    return

@app.route('/stream')
def stream():
    text = request.args.get('text','No text provided')
    print(text+"n")
    return Response(generate_audio(text), mimetype='audio/wav')

if __name__ == '__main__':
    serve(app, host='0.0.0.0', port = '8080', threads = 16)

Streamlit test app code

import streamlit as st 
import urllib.parse as url

st.title("Test")

prompt = st.chat_input("Enter your text here")
if prompt:
    source = "http://127.0.0.1:8080/stream?text="+url.quote(prompt)
    st.write(source)
    html = f"""<audio id = 'player' controls autoplay="true">
    <source src="{source}" type="audio/wav">
    </audio>"""
    st.write(html)
    st.markdown(html, unsafe_allow_html=True)