0% found this document useful (0 votes)
52 views5 pages

Chatbot Project Guide

Uploaded by

alok patel
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
52 views5 pages

Chatbot Project Guide

Uploaded by

alok patel
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

Step-by-Step Guide: Chatbot Integrated with OpenAI’s ChatGPT API

This guide provides a comprehensive walkthrough for building a chatbot using OpenAI's
ChatGPT API. It includes setting up the environment, writing the code, and deploying the
project on a cloud platform such as Heroku. The steps include code examples, configuration
files, and optional HTML for a frontend interface.

Project Structure

Let’s create a well-organized file structure for the chatbot project:

chatbot_project/
├── chatbot.py # Main Flask application
├── config.py # Configuration file for storing API keys and settings
├── requirements.txt # File for dependencies
├── Procfile # For deployment on Heroku
└── templates/
└── index.html # Simple HTML file to interact with the chatbot (optional)

1. config.py: Configuration File

This file will store sensitive information like API keys. Never commit this file to public
repositories. It’s good to load it from environment variables for security in production.

# config.py
import os

# Load the OpenAI API key from an environment variable


OPENAI_API_KEY = os.getenv("OPENAI_API_KEY")

# Set default response parameters


MODEL = "text-davinci-003"
MAX_TOKENS = 150
TEMPERATURE = 0.7
2. chatbot.py: Main Application Code

This is the main application code for the chatbot server. It uses Flask to handle HTTP
requests and interact with OpenAI’s API.

# chatbot.py
import openai
from flask import Flask, request, jsonify, render_template
from config import OPENAI_API_KEY, MODEL, MAX_TOKENS, TEMPERATURE

app = Flask(__name__)
openai.api_key = OPENAI_API_KEY

@app.route('/')
def index():
return render_template("index.html")

@app.route('/chat', methods=['POST'])
def chat():
try:
user_input = request.json.get("message")
if not user_input:
return jsonify({"error": "No message provided"}), 400

response = openai.Completion.create(
model=MODEL,
prompt=user_input,
max_tokens=MAX_TOKENS,
temperature=TEMPERATURE
)
chatbot_response = response.choices[0].text.strip()
return jsonify({"response": chatbot_response})
except Exception as e:
return jsonify({"error": str(e)}), 500

if __name__ == "__main__":
app.run(debug=True)

3. templates/index.html: Optional HTML Interface

This HTML file provides a simple frontend to interact with the chatbot. You can access it by
opening the root URL after running the Flask app.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Chatbot</title>
<style>
body { font-family: Arial, sans-serif; margin: 50px; }
#chatbox { width: 300px; border: 1px solid #ccc; padding: 10px; }
#messages { list-style-type: none; padding: 0; }
#messages li { padding: 8px; margin: 4px 0; }
#input { width: calc(100% - 22px); }
</style>
</head>
<body>
<h1>Chatbot Interface</h1>
<div id="chatbox">
<ul id="messages"></ul>
<input id="input" type="text" placeholder="Type a message..." autofocus>
<button onclick="sendMessage()">Send</button>
</div>

<script>
async function sendMessage() {
const input = document.getElementById("input");
const message = input.value;
if (message.trim() === "") return;
addMessage("User: " + message);
input.value = "";
const response = await fetch("/chat", {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ message })
});
const data = await response.json();
addMessage("Chatbot: " + (data.response || data.error));
}
function addMessage(text) {
const messages = document.getElementById("messages");
const li = document.createElement("li");
li.textContent = text;
messages.appendChild(li);
}
</script>
</body>
</html>

4. requirements.txt: Dependencies

This file lists the packages required for this project. You can create it by running pip freeze >
requirements.txt in your virtual environment after installing the libraries.

flask
openai

5. Procfile: Deployment Configuration for Heroku

The Procfile tells Heroku which command to run to start the application.

web: python chatbot.py

Step 6: Run the Application Locally

After creating these files, start your virtual environment and run the application with:

python chatbot.py

Open http://127.0.0.1:5000 to access the HTML interface.

Step 7: Deployment on Heroku

1. **Initialize Git**:
git init
git add .
git commit -m "Initial commit for chatbot project"

2. **Create a Heroku App**:


heroku create

3. **Set OpenAI API Key as Config Var**:


heroku config:set OPENAI_API_KEY=your_openai_api_key_here

4. **Push to Heroku**:
git push heroku master

Your chatbot is now live on Heroku and should be accessible at the URL provided by
Heroku!

You might also like