关于“uniapp做前端请求ChatGPT接口的问答小程序”的知识点有一些人不是很理解，对此小编给大家总结了相关内容，文中的内容简单清晰，易于学习与理解，具有一定的参考学习价值，希望能对大家有所帮助，接下来就跟随小编一起学习一下“uniapp做前端请求ChatGPT接口的问答小程序”吧。

最近很火的ChatGPT来了！我也是做了一个最最基础的模型，让大家更通俗易懂！

先看效果：

 

 

 

 接下来直接上代码：

<template>
	<view class="content">
		<view class="text-area">
			<textarea class="aa" placeholder-style="color:#F76260" placeholder="智能提问" v-model='title' />
			<button class="button" @click="getAi">提问</button>
		</view>
		<view class="answer">
			<textarea disabled class="aa cc" placeholder-style="color:#F76260" placeholder="回答" v-model='answer' />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: '列举几条法律',
				answer: "",
			}
		},
		onLoad() {
			// this.getAi()
		},
		methods: {
			getAi() {
				let that = this
				console.log(this.title, 8888)
				if (!this.title) {
					uni.showToast({
						title: '请先输入问题!',
					});
					return
				}
				let answer = '正在思考请稍后...'
				let index = 0;
				that.answer = ''
				let interval = setInterval(function() {
						that.answer += answer[index];
						index++;
						// 当打印完成时，清除定时器
						if (index >= answer.length) {
							clearInterval(interval);
						}
					},
					150); // 每隔50毫秒打印一个字符

				let dataVal = JSON.stringify({
					"prompt": that.title,
					"max_tokens": 2048,
					"temperature": 0.5,
					"top_p": 1.0,
					"frequency_penalty": 0.8,
					"presence_penalty": 0.0,
					"model": "text-davinci-003"
				});
				// {
				//   "model": "text-davinci-003",
				//   "prompt": "",
				//   "temperature": 0.5,
				//   "max_tokens": 60,
				//   "top_p": 1.0,
				//   "frequency_penalty": 0.8,
				//   "presence_penalty": 0.0
				// }
				uni.request({
					url: 'https://api.openai.com/v1/completions', //仅为示例，并非真实接口地址。
					data: dataVal,
					method: "POST",
					header: {
						'Content-Type': 'application/json',
						'Authorization': 'Bearer sk-xxxxxxxxxxxxx', //自定义请求头信息
					},
					success: (xhr) => {
						if (xhr.statusCode === 200) {
							console.log('xhr', xhr)
							var json = xhr.data;
							var response = json.choices[0].text;

							// 将CHATGPT的返回值输出到文本框
							var indexxx = 0;
							that.answer = ''
							// 创建一个定时器，每隔一段时间打印一个字符
							var intervals = setInterval(function() {
									that.answer += response[indexxx];
									indexxx++;

									// 当打印完成时，清除定时器
									if (indexxx >= response.length) {
										clearInterval(intervals);
									}
								},
								50); // 每隔50毫秒打印一个字符
						}
						console.log(xhr);
					}
				});
			},
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {}

	.aa {
		border: solid 1px red;
	}
	.cc {
		height: 600rpx;
	}

	.button {
		width: 300rpx;
		height: 100rpx;
		margin: 30rpx auto;
		background: red;
		line-height: 100rpx;
	}


	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>

最后附一个openAI的地址（科学）：

https://platform.openai.com

还有不明白的欢迎留言，我会一一解答~

感兴趣的小伙伴去试试吧~

 

现在大家对于uniapp做前端请求ChatGPT接口的问答小程序的内容应该都清楚了吧，希望大家阅读完这篇文章能有所收获。最后，想要了解更多uniapp做前端请求ChatGPT接口的问答小程序的知识，欢迎关注群英网络，群英网络将为大家推送更多相关知识的文章。

免责声明：本站发布的内容（图片、视频和文字）以原创、转载和分享为主，文章观点不代表本网站立场，如果涉及侵权请联系站长邮箱：mmqy2019@163.com进行举报，并提供相关证据，查实之后，将立刻删除涉嫌侵权内容。