הנושאים החמים
- הוסף לסימניות
- #1
אני מעוניין להוסיף לאתר שבניתי [כולו html] אפשרות לשוחח עם צ'אט של open ai, קיבלתי מהם key, אבל למעשה אני לא מצליח,
האם צריך לעשות דברים נוספים או תשלום וכו'?
תודה מראש לעוזרים ולרוצים לעזור.
צירפתי פה את הקוד, כולל המפתח.
כאן יוצרים מפתחות
האם צריך לעשות דברים נוספים או תשלום וכו'?
תודה מראש לעוזרים ולרוצים לעזור.
צירפתי פה את הקוד, כולל המפתח.
כאן יוצרים מפתחות
HTML:
<!DOCTYPE html>
<html lang="he">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>מדריך המתכונים</title>
<style>
body { font-family: Arial, sans-serif; background-color: #f9f9f9; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; }
#chatbox { width: 100%; max-width: 600px; border: 1px solid #ccc; padding: 20px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 10px; }
#messages { height: 300px; overflow-y: scroll; border: 1px solid #ccc; padding: 10px; background-color: #f1f1f1; margin-bottom: 10px; border-radius: 5px; }
.message { margin: 5px 0; padding: 8px 10px; border-radius: 5px; }
.user { text-align: right; background-color: #e1ffc7; }
.bot { text-align: left; background-color: #d1e7ff; }
#userInput { width: calc(100% - 70px); padding: 10px; border: 1px solid #ccc; border-radius: 5px; }
button { padding: 10px; border: none; background-color: #007bff; color: #fff; border-radius: 5px; cursor: pointer; }
button:hover { background-color: #0056b3; }
</style>
</head>
<body>
<div id="chatbox">
<h1>מדריך המתכונים</h1>
<div id="messages"></div>
<input type="text" id="userInput" placeholder="כתוב את ההודעה שלך כאן..." onkeydown="if(event.key === 'Enter') sendMessage()">
<button onclick="sendMessage()">שלח</button>
</div>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', (event) => {
const messages = document.getElementById('messages');
const userInput = document.getElementById('userInput');
function addMessage(message, sender) {
const messageDiv = document.createElement('div');
messageDiv.classList.add('message', sender);
messageDiv.textContent = message;
messages.appendChild(messageDiv);
messages.scrollTop = messages.scrollHeight;
}
async function sendMessage() {
const userMessage = userInput.value.trim();
if (!userMessage) return;
addMessage(userMessage, 'user');
userInput.value = '';
try {
const response = await axios.post('https://api.openai.com/v1/completions', {
model: 'text-davinci-003', // צריך להוסיף את המודל בו אנחנו משתמשים
prompt: userMessage,
max_tokens: 150,
temperature: 0.5,
top_p: 1,
n: 1,
stop: ["\n"]
}, {
headers: {
'Authorization': `****************B0mCBAesvPxRWYvtRC5T5kwwmJdlnEmylsx5rno1kvM5NFT3BlbkFJYo4rFBSvTKgBRI-DUGEE5rI3QOpvKspMk0PORBCW9esCM3i6oNtx0CrSAA`,
'Content-Type': 'application/json'
}
});
console.log(response.data); // להדפיס את התגובה המלאה
const botMessage = response.data.choices[0].text.trim();
addMessage(botMessage, 'bot');
} catch (error) {
console.error('Error:', error.response ? error.response.data : error.message);
addMessage('מצטערים, יש בעיה בחיבור. נסה שוב מאוחר יותר.', 'bot');
}
}
// Make sendMessage function globally accessible
window.sendMessage = sendMessage;
});
</script>
</body>
</html>
נערך לאחרונה ע"י מנהל:
ריכוז תכנים מעניינים בנושא החודש.
