From 06b1941ff07f455db665fd3b28c711ffac662d21 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:34:54 +0100 Subject: [PATCH 1/6] Update script.js --- script.js | 50 +++++++++++++++++++++++++++++++++++++------------- 1 file changed, 37 insertions(+), 13 deletions(-) diff --git a/script.js b/script.js index 232273b..1b2bcb2 100644 --- a/script.js +++ b/script.js @@ -13,21 +13,45 @@ chatForm.addEventListener("submit", async (e) => { const response = await fetch("gptchat.php", { method: "POST", - headers: { - "Content-Type": "application/json", - }, + headers: { "Content-Type": "application/json" }, body: JSON.stringify({ message }), }); - if (response.ok) { - const data = await response.json(); - if (data.choices && data.choices[0] && data.choices[0].text) { - chatOutput.innerHTML += `

${data.choices[0].text}

`; - } else { - console.error("Error: Unexpected response format", data); - } - chatOutput.scrollTop = chatOutput.scrollHeight; - } else { + if (!response.ok) { console.error("Error communicating with GPTChat API"); + return; + } + + const reader = response.body.getReader(); + let botMessage = ""; + + async function read() { + const { done, value } = await reader.read(); + if (done) { + chatOutput.innerHTML += `

${botMessage}

`; + chatOutput.scrollTop = chatOutput.scrollHeight; + return; + } + + const text = new TextDecoder().decode(value); + const lines = text.split("\n").filter(line => line.startsWith("data: ")); + for (const line of lines) { + const json = line.replace("data: ", "").trim(); + if (json && json !== "[DONE]") { + try { + const data = JSON.parse(json); + if (data.choices && data.choices[0] && data.choices[0].delta && data.choices[0].delta.content) { + botMessage += data.choices[0].delta.content; + chatOutput.innerHTML += `${data.choices[0].delta.content}`; + chatOutput.scrollTop = chatOutput.scrollHeight; + } + } catch (err) { + console.error("JSON Parsing Error", err); + } + } + } + read(); } -}); \ No newline at end of file + + read(); +}); From 9a6b3c0456c94ebeba46ad3f110dc814f23a6373 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:35:24 +0100 Subject: [PATCH 2/6] Update gptchat.php --- gptchat.php | 68 +++++++++++++++++++---------------------------------- 1 file changed, 24 insertions(+), 44 deletions(-) diff --git a/gptchat.php b/gptchat.php index 19eae6a..09cc926 100644 --- a/gptchat.php +++ b/gptchat.php @@ -1,62 +1,42 @@ gpt-3.5-turbo-16k, - curl_setopt($ch, CURLOPT_URL, "https://api.openai.com/v1/engines/" . MODEL . "/completions"); - curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); - curl_setopt($ch, CURLOPT_POST, 1); - curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode(array( - - "prompt" => $message, - "max_tokens" => MAX_TOKENS, - "temperature" => TEMPERATURE, - "top_p" => TOP_P, - "frequency_penalty" => FREQUENCY_PENALTY, - "presence_penalty" => PRESENCE_PENALTY - ))); - // Set the Content-Type and Authorization headers - curl_setopt($ch, CURLOPT_HTTPHEADER, array( + curl_setopt($ch, CURLOPT_URL, "https://api.openai.com/v1/chat/completions"); + curl_setopt($ch, CURLOPT_RETURNTRANSFER, false); + curl_setopt($ch, CURLOPT_POST, true); + curl_setopt($ch, CURLOPT_HTTPHEADER, [ "Content-Type: application/json", "Authorization: Bearer " . OPENAI_API_KEY - )); -// Execute the cURL session and store the response - $response = curl_exec($ch); - // Output the response - echo $response; -// Close the cURL session + ]); + curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode([ + "model" => MODEL, + "messages" => [["role" => "user", "content" => $message]], + "temperature" => TEMPERATURE, + "max_tokens" => MAX_TOKENS, + "stream" => true + ])); + + curl_setopt($ch, CURLOPT_WRITEFUNCTION, function ($curl, $data) { + echo "data: " . $data . "\n\n"; + ob_flush(); + flush(); + return strlen($data); + }); + + curl_exec($ch); curl_close($ch); } else { - // Set the HTTP response code to 405 (Method Not Allowed) if the request method is not POST http_response_code(405); - // Output an error message in JSON format echo json_encode(['error' => 'Method not allowed']); } From 5448821b7a389a39bfdbbbf895f816dc43d1f61f Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:36:47 +0100 Subject: [PATCH 3/6] Update README.md --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index 7aab2f3..62dc241 100644 --- a/README.md +++ b/README.md @@ -1,4 +1,4 @@ -# GPT API Integration (in HTML/CSS with JS/PHP) +# GPT API Integration with stream (in HTML/CSS with JS/PHP) ###### Updated: 02.06.2024 modules/endpoints ![Screenshot](chatgpt.png) From febaa7cc5e23c37e0e3f643986fb15ae21f98120 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:37:54 +0100 Subject: [PATCH 4/6] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 3c9d2cd..c7b3a57 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ -GPTChat API Integration +GPTChat API Integration with stream From 7c4fd27e171b9ffb7c8ca4b7cc2e2b9ee52eb85d Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:40:18 +0100 Subject: [PATCH 5/6] Update config.php --- config.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/config.php b/config.php index d0ce36a..905e900 100644 --- a/config.php +++ b/config.php @@ -4,7 +4,7 @@ // Define the OpenAI API key define('OPENAI_API_KEY', 'sk-.................................'); // Define the model to be used, for example: text-davinci-003 -define('MODEL', 'text-davinci-003'); +define('MODEL', 'gpt-3.5-turbo'); // Define the temperature setting for the model, a value between 0 and 1 (e.g., 0.9) define('TEMPERATURE', 0.9); // Define the maximum number of tokens to be generated by the model (e.g., 1000) From cc2a11352eabe5922d6d2993a3e715b21eb6404c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Volkan=20=C5=9Eah?= Date: Mon, 24 Mar 2025 15:41:42 +0100 Subject: [PATCH 6/6] Update config.php --- config.php | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/config.php b/config.php index 905e900..072315b 100644 --- a/config.php +++ b/config.php @@ -4,7 +4,7 @@ // Define the OpenAI API key define('OPENAI_API_KEY', 'sk-.................................'); // Define the model to be used, for example: text-davinci-003 -define('MODEL', 'gpt-3.5-turbo'); +define('MODEL', 'gpt-4o-mini'); // Define the temperature setting for the model, a value between 0 and 1 (e.g., 0.9) define('TEMPERATURE', 0.9); // Define the maximum number of tokens to be generated by the model (e.g., 1000)