Skip to content

Commit a049169

Browse files
jordanstephensjordanstephens
committed
refactor to avoid nagivating on form submit
1 parent d42f3d6 commit a049169

File tree

2 files changed

+59
-59
lines changed

2 files changed

+59
-59
lines changed

‎samples/managed-llm-provider/app/app.py‎

Lines changed: 45 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -5,14 +5,19 @@
55
import requests
66
from fastapi import FastAPI, Form, Request
77
from fastapi.responses import HTMLResponse
8+
from fastapi.staticfiles import StaticFiles
9+
from fastapi.responses import JSONResponse
810

911
app = FastAPI()
12+
app.mount("/static", StaticFiles(directory="static"), name="static")
1013

1114
# Configure basic logging
1215
logging.basicConfig(level=logging.INFO)
1316

17+
default_openai_base_url = "https://api.openai.com/v1/"
18+
1419
# Set the environment variables for the chat model
15-
LLM_URL = os.getenv("LLM_URL", "https://api.openai.com/v1/") + "chat/completions"
20+
LLM_URL = os.getenv("LLM_URL", default_openai_base_url) + "chat/completions"
1621
# Fallback to OpenAI Model if not set in environment
1722
MODEL_ID = os.getenv("LLM_MODEL", "gpt-4-turbo")
1823

@@ -26,31 +31,28 @@ def get_api_key():
2631
async def home():
2732
return """
2833
<html>
29-
<head><title>Ask the AI Model</title></head>
34+
<head>
35+
<title>Ask the AI Model</title>
36+
<script type="text/javascript" src="./static/app.js"></script>
37+
</head>
3038
<body>
3139
<h1>Ask the AI Model</h1>
32-
<form method="post" action="/ask" onsubmit="document.getElementById('loader').style.display='block'">
33-
<textarea name="prompt" autofocus="autofocus" rows="5" cols="60" placeholder="Enter your question here..."
34-
onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();this.form.submit();}">
35-
</textarea>
40+
<form method="post" id="askForm" onsubmit="event.preventDefault(); submitForm(event);">
41+
<textarea id="prompt" name="prompt" autofocus="autofocus" rows="5" cols="60" placeholder="Enter your question here..."
42+
onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();this.form.dispatchEvent(new Event('submit', {cancelable:true}));}"></textarea>
3643
<br><br>
3744
<input type="submit" value="Ask">
3845
</form>
46+
<hr>
47+
<h2>Model's Reply:</h2>
48+
<p id="reply"></p>
3949
</body>
40-
4150
</html>
4251
"""
4352

4453
# Handle form submission
45-
@app.post("/ask", response_class=HTMLResponse)
54+
@app.post("/ask", response_class=JSONResponse)
4655
async def ask(prompt: str = Form(...)):
47-
headers = {
48-
"Content-Type": "application/json"
49-
}
50-
51-
api_key = get_api_key()
52-
headers["Authorization"] = f"Bearer {api_key}"
53-
5456
payload = {
5557
"model": MODEL_ID,
5658
"messages": [
@@ -59,59 +61,43 @@ async def ask(prompt: str = Form(...)):
5961
"stream": False
6062
}
6163

64+
reply = get_llm_response(payload)
65+
66+
return {"prompt": prompt, "reply": reply}
67+
68+
def get_llm_response(payload):
69+
api_key = get_api_key()
70+
request_headers = {
71+
"Content-Type": "application/json",
72+
"Authorization": f"Bearer {api_key}"
73+
}
74+
6275
# Log request details
6376
logging.info(f"Sending POST to {LLM_URL}")
64-
logging.info(f"Request Headers: {headers}")
77+
logging.info(f"Request Headers: {request_headers}")
6578
logging.info(f"Request Payload: {payload}")
6679

6780
response = None
68-
reply = None
6981
try:
70-
response = requests.post(f"{LLM_URL}", headers=headers, data=json.dumps(payload))
82+
response = requests.post(f"{LLM_URL}", headers=request_headers, data=json.dumps(payload))
7183
except requests.exceptions.HTTPError as errh:
72-
reply = f"HTTP error:", errh
84+
return f"HTTP error:", errh
7385
except requests.exceptions.ConnectionError as errc:
74-
reply = f"Connection error:", errc
86+
return f"Connection error:", errc
7587
except requests.exceptions.Timeout as errt:
76-
reply = f"Timeout error:", errt
88+
return f"Timeout error:", errt
7789
except requests.exceptions.RequestException as err:
78-
reply = f"Unexpected error:", err
90+
return f"Unexpected error:", err
7991

80-
if response is not None:
81-
# logging.info(f"Response Status Code: {response.status_code}")
82-
# logging.info(f"Response Headers: {response.headers}")
83-
# logging.info(f"Response Body: {response.text}")
84-
if response.status_code == 200:
85-
data = response.json()
86-
try:
87-
reply = data["choices"][0]["message"]["content"]
88-
except (KeyError, IndexError):
89-
reply = "Model returned an unexpected response."
90-
elif response.status_code == 400:
91-
reply = f"Connect Error: {response.status_code} - {response.text}"
92-
elif response.status_code == 500:
93-
reply = f"Error from server: {response.status_code} - {response.text}"
94-
else:
95-
# Log error details
96-
reply = f"Error from server: {response.status_code} - {response.text}"
97-
logging.error(f"Error from server: {response.status_code} - {response.text}")
92+
if response is None:
93+
return f"Error: No response from server."
94+
if response.status_code == 400:
95+
return f"Connect Error: {response.status_code} - {response.text}"
96+
if response.status_code == 500:
97+
return f"Error from server: {response.status_code} - {response.text}"
9898

99-
# Return result
100-
return f"""
101-
<html>
102-
<head><title>Ask the AI Model</title></head>
103-
<body>
104-
<h1>Ask the AI Model</h1>
105-
<form method="post" action="/ask" onsubmit="document.getElementById('loader').style.display='block'">
106-
<textarea name="prompt" autofocus="autofocus" rows="5" cols="60" placeholder="Enter your question here..."
107-
onkeydown="if(event.key==='Enter'&&!event.shiftKey){{event.preventDefault();this.form.submit();}}"></textarea><br><br>
108-
<input type="submit" value="Ask">
109-
</form>
110-
<h2>You Asked:</h2>
111-
<p>{prompt}</p>
112-
<hr>
113-
<h2>Model's Reply:</h2>
114-
<p>{reply}</p>
115-
</body>
116-
</html>
117-
"""
99+
try:
100+
data = response.json()
101+
return data["choices"][0]["message"]["content"]
102+
except (KeyError, IndexError):
103+
return "Model returned an unexpected response."

‎samples/managed-llm-provider/app/static/app.js‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
async function submitForm(event) {
2+
event.preventDefault();
3+
const prompt = document.getElementById('prompt').value;
4+
document.getElementById('reply').innerHTML = "Loading...";
5+
const response = await fetch('/ask', {
6+
method: 'POST',
7+
headers: {
8+
'Content-Type': 'application/x-www-form-urlencoded'
9+
},
10+
body: new URLSearchParams({prompt})
11+
});
12+
const data = await response.json();
13+
document.getElementById('reply').innerHTML = data.reply || "No reply found.";
14+
}

0 commit comments

Comments
 (0)