使用 ChatGPT API 的静态问答聊天页面，由于 API 限制，无法连续对话。模型 davinci-003 较为准确速度也最慢，词数可以理解为响应内容字数限制，随机性值越大答案可能越偏离正确答案。
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
</script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js"
integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous">
</script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"
integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous">
</script>
<title>ChatGPT 体验 - 极四维博客 </title>
</head>
<body>
<div class="container mt-5">
<!-- <h2>GPT-3 Chat</h2> -->
<form id="chat-form">
<div class="form-group form-inline">
<label for="model_select"> 模型:</label>
<select class="form-control mx-3" id="model_select">
<option value="text-davinci-003">Davinci-3</option>
<option value="text-davinci-002">Davinci-2</option>
<option value="code-davinci-002">code-davinci</option>
<option value="text-curie-001">Curie</option>
<option value="text-babbage-001">Babbage</option>
</select>
<label for="token_number"> 词数:</label>
<input type="number" class="form-control mx-3" id="token_number" value="300"
placeholder=" 请输入 Token 数 " />
<label for="temperature"> 随机:</label>
<input type="number" class="form-control mx-3" id="temperature" step="0.1" min="0" max="2"
value="0.5" />
</div>
<div class="form-group">
<label for="input_text"> 输入:</label>
<textarea class="form-control" id="input_text" rows="3"></textarea>
</div>
<div class="form-group">
<label for="output_text"> 输出:</label>
<textarea class="form-control" id="output_text" rows="3" readonly></textarea>
</div>
<button type="submit" class="btn btn-primary"> 提问 </button>
<a href='https://cway.top/post/1058.html' target="_blank"><button type="button" class="btn btn-success"> 帮助 </button></a>
</form>
</div>
</body>
<script>
document.getElementById('chat-form').addEventListener('submit', submitForm);
function submitForm(event) {event.preventDefault();
document.getElementById('output_text').value = " 请稍后...";
// 获取 GPT API KEY 见：https://platform.openai.com/account/api-keys
const apiKey = "sk-xxxxxxxxxxxxxxxxxxxxx"; // 填写你的 chatgpt api key
// 调用 GPT-3 API
var input = document.getElementById("input_text").value;
var model = document.getElementById("model_select").value;
var tokenNum = document.getElementById("token_number").value;
var temperature = document.getElementById("temperature").value;
var xhr = new XMLHttpRequest();
xhr.open("POST", "https://api.openai.com/v1/completions", true);
xhr.setRequestHeader("Content-Type", "application/json");
xhr.setRequestHeader("Authorization", `Bearer ${apiKey}`);
xhr.onreadystatechange = function() {if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {var response = JSON.parse(this.responseText);
document.getElementById("output_text").value = response.choices[0].text.trim();}
};
var data = JSON.stringify({
prompt: input,
max_tokens: parseInt(tokenNum),
temperature: parseFloat(temperature),
n: 1,
stop: "",
model: model
});
xhr.send(data);
}
</script>
</html>
支付宝领红包