使用 ChatGPT API 创建在线聊天网站

本教程将指导您使用 ChatGPT API 创建一个简单的在线聊天网站，让用户可以与 ChatGPT 进行实时对话。

1. 获取 ChatGPT API 密钥

首先，您需要从 OpenAI 网站获取 ChatGPT API 密钥。您可以访问 https://beta.openai.com/ 并注册一个帐户。注册后，您可以在个人资料页面的 API 密钥部分找到您的密钥。

2. 创建 HTML 文件

创建一个名为 index.html 的 HTML 文件，并将以下代码粘贴到文件中：

<!DOCTYPE html>
<html>
<head>
	<title>与 ChatGPT 聊天</title>
	<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
	<script>
		function chat() {
			var message = $("#message").val();
			$("#chatArea").append("<p>您: ' + message + '</p>");
			$("#message").val("");
			$.ajax({
				url: "https://api.openai.com/v1/engines/davinci-codex/completions",
				type: "POST",
				headers: {
					"Content-Type": "application/json",
					"Authorization": "Bearer API_KEY" // 请替换为您的 API 密钥
				},
				data: JSON.stringify({
					"prompt": message,
					"max_tokens": 50,
					"temperature": 0.7
				}),
				success: function(result) {
					var response = result.choices[0].text.trim();
					$("#chatArea").append("<p>ChatGPT: ' + response + '</p>");
				}
			});
		}
	</script>
</head>
<body>
	<h1>与 ChatGPT 聊天</h1>
	<div id="chatArea"></div>
	<input type="text" id="message">
	<button onclick="chat()">发送</button>
</body>
</html>

3. 替换 API 密钥

将代码中的 API_KEY 替换为您的实际 API 密钥。

4. 上传文件

将 index.html 文件上传到您的网站服务器。

5. 访问网站

现在，您可以在浏览器中访问您的网站，并与 ChatGPT 进行聊天！

注意：

该代码使用了 jQuery 库，您需要确保您的网站已经包含了 jQuery 库。
您可以根据需要调整 max_tokens 和 temperature 参数，以控制 ChatGPT 的回复长度和创造性。
由于 ChatGPT API 的使用量有限，请谨慎使用，以免超出您的 API 使用配额。
使用 ChatGPT API 创建的网站可能存在安全风险，请确保您已经采取了必要的安全措施。

希望本教程能够帮助您成功创建自己的 ChatGPT 在线聊天网站！