use operai class, html, python to form website, which can ask question, and answer, please include simple beginner code, name every file, how to install openai, as simple as possible, as easy as possible, apache server will be used, dont use flask
To build a website that can ask questions and answer them using OpenAI, we need to follow these steps:
-
Install OpenAI API: We can install OpenAI API by following the instructions given on the OpenAI website.
-
Create a HTML file: We need to create an HTML file that will be used as the front-end of our website. We can name this file index.html.
-
Create a Python script: We need to create a Python script that will handle the requests from the front-end, send them to OpenAI API, and return the response. We can name this file app.py.
-
Create a CSS file: We can create a CSS file that will be used to style our HTML page. We can name this file style.css.
-
Set up the Apache server: We need to set up the Apache server on our machine to host our website.
Here is a simple beginner code to get started:
index.html:
<!DOCTYPE html>
<html>
<head>
<title>OpenAI Q&A</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<h1>OpenAI Q&A</h1>
<form>
<label for="question">Question:</label>
<input type="text" id="question" name="question"><br><br>
<label for="answer">Answer:</label>
<input type="text" id="answer" name="answer" readonly><br><br>
<input type="button" value="Ask" onclick="askQuestion()">
</form>
<script src="app.js"></script>
</body>
</html>
style.css:
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
}
h1 {
text-align: center;
}
form {
margin: 0 auto;
width: 50%;
}
label {
display: block;
margin-top: 20px;
}
input[type="text"] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
box-sizing: border-box;
border: none;
border-radius: 4px;
background-color: #fff;
}
input[type="button"] {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
border-radius: 4px;
cursor: pointer;
width: 100%;
}
input[type="button"]:hover {
background-color: #45a049;
}
app.py:
import openai
openai.api_key = "YOUR_API_KEY"
def get_answer(question):
response = openai.Completion.create(
engine="davinci",
prompt=f"Q: {question}\nA:",
temperature=0.5,
max_tokens=1024,
top_p=1,
frequency_penalty=0,
presence_penalty=0
)
answer = response.choices[0].text.strip()
return answer
from http.server import BaseHTTPRequestHandler
from urllib.parse import parse_qs
import json
class Handler(BaseHTTPRequestHandler):
def do_GET(self):
if self.path == '/':
self.send_response(200)
self.send_header('Content-type', 'text/html')
self.end_headers()
with open('index.html', 'rb') as f:
self.wfile.write(f.read())
else:
self.send_response(404)
self.send_header('Content-type', 'text/plain')
self.end_headers()
self.wfile.write(b'404 Not Found')
def do_POST(self):
if self.path == '/ask':
content_length = int(self.headers['Content-Length'])
post_data = self.rfile.read(content_length)
data = parse_qs(post_data.decode('utf-8'))
question = data['question'][0]
answer = get_answer(question)
self.send_response(200)
self.send_header('Content-type', 'application/json')
self.end_headers()
self.wfile.write(json.dumps({'answer': answer}).encode('utf-8'))
else:
self.send_response(404)
self.send_header('Content-type', 'text/plain')
self.end_headers()
self.wfile.write(b'404 Not Found')
if __name__ == '__main__':
from http.server import HTTPServer
server = HTTPServer(('localhost', 8080), Handler)
print('Starting server...')
server.serve_forever()
This Python script creates a simple HTTP server that listens for GET and POST requests. When the user submits a question, the script sends it to the OpenAI API and returns the answer.
app.js:
function askQuestion() {
var question = document.getElementById("question").value;
if (question) {
var xhr = new XMLHttpRequest();
xhr.open("POST", "/ask", true);
xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhr.onreadystatechange = function() {
if (xhr.readyState === 4 && xhr.status === 200) {
var data = JSON.parse(xhr.responseText);
document.getElementById("answer").value = data.answer;
}
};
xhr.send("question=" + question);
}
}
This JavaScript code handles the form submission and sends an AJAX request to our Python script to get the answer.
To install OpenAI API, follow the instructions given on the OpenAI website: https://beta.openai.com/docs/api-reference/authentication#authentication
To set up the Apache server, follow the instructions given on the Apache website: https://httpd.apache.org/docs/2.4/install.html
To run the Python script, open the terminal in the directory where the script is saved and run the command python app.py. This will start the HTTP server and you can access the website by going to http://localhost:8080 in your web browser.
原文地址: https://www.cveoy.top/t/topic/g5D 著作权归作者所有。请勿转载和采集!