无需搭建js服务，方便把已有的非流式代码改为流式代码，提高响应速度
反向代理访问接口，据说这样被openai屏蔽的可能性更小
浏览器指纹统计用户
页面可以自定义设置tokens长度，gpt创造力指数
具有代码高亮显示
Python flask提供接口
Python 文件app.py代码如下：
from flask import Flask,request, abort,Response
import os
import openai
import json
app = Flask(__name__)
# 设置JSONIFY_TIMEOUT为5秒
app.config['JSONIFY_TIMEOUT'] = 60000
@app.route('/chat', methods=['POST'])
def chat():
openai.api_key = "你的api key"
json_data = request.get_json()
conversation = [] # 创建空列表
conversation.append({
"role": "system", "content": "You are a helpful assistant."})
questions = json_data['myArray']
answers = json_data['assistant']
temperatures = 0.7
if 'temperatures' in json_data:
if json_data['temperatures']=='适中':
temperatures = 0.7
if json_data['temperatures']=='更有创造力':
temperatures = 1.4
if json_data['temperatures']=='更精准':
temperatures = 0.2
tokens = 1000
if 'tokens' in json_data:
tokens = int(json_data['tokens'])
if tokens>4000:
tokens =4000
if len(questions) > 2:
questions = questions[-2:]
answers = answers[-2:]
if len(questions):
# 遍历数组并添加到对话列表中
for i in range(len(questions)):
conversation.append({
"role": "user", "content": questions[i]})
conversation.append({
"role": "assistant", "content": answers[i]})
conversation.append({
"role": "user", "content": json_data['text']})
else:
conversation.append({
"role": "user", "content": json_data['text']})
inp_text = json_data['text']
try:
response = openai.ChatCompletion.create(
model="gpt-3.5-turbo",
messages = conversation,
temperature=temperatures,
max_tokens=tokens,
stream=True,#指明为流式输出
# frequency_penalty=0.5,
# presence_penalty=0.5,
# top_p=0.9
)
except Exception as e:
response = False
if 's maximum context length is' in str(e):
pattern = r'\d+'
matches = re.findall(pattern, str(e))
if len(matches) >= 2:
number = int(matches[1]) -4000
return ["maximum",number]
return ["maximum"]
if 'a deactivated account' in str(e):
return {
'error': '当前api key已经用完额度或者失效，可以通知管理员更新'}, 401
return {
'error': '出错了稍后重试'}, 401
if response:
//采用流式输出
return Response(generate(response), mimetype='json')
def generate(response):
for text in response:
yield json.dumps(text['choices'][0])+'\n##'
if __name__ == "__main__":
app.run(port=端口, host="ip", debug=True)
写好这个代码后可以在linux系统中app.py文件所在目录下，命令行输入 python app.py运行这个文件，成功运行就可以接着部署下面方前端代码了。如果是正式的环境推荐用Gunicorn服务器来管理，用supervisor来自动重启。
接下来是前端代码：
@extends('layouts.capp')
@section('title')
首页
@endsection
@section('sidebar')
@parent
@endsection
@section('content')
<body class="antialiased1">
<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.11/vue.min.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fingerprintjs2/2.1.0/fingerprint2.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.1.1/crypto-js.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/2.1.3/marked.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/10.7.2/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
<div id="existing-element"></div>
<div id="app">
<div class="b-i-c1">
<div class="b-i-c">
<textarea type="text" v-model="message1" class="input-box" id="input-box" oninput="autoResize()" rows="1" placeholder="输入信息">
</textarea>
<!-- `greet` 是在下面定义的方法名 -->
<button class="button-c" v-on:click="greet" id="button-c">
<svg stroke="currentColor" fill="none" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round"
stroke-linejoin="round" class="h-4 w-4 mr-1" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg">
<line x1="22" y1="2" x2="11" y2="13"></line><polygon points="22 2 15 22 11 13 2 9 22 2"></polygon>
</svg>
<div class="h-4 w-4 mr-1 fa">发送</div>
<div class="text-2xl" id="text-box">
<span class="dot">.</span>
<span class="dot">.</span>
<span class="dot">.</span>
</div>
</button>
</div>
</div>
<ul ref="myList" id="myList"></ul>
<h1 class="text-4xl font-semibold text-center mt-6 sm:mt-[20vh] ml-auto mr-auto mb-10 sm:mb-16 flex gap-2 items-center justify-center">
欢迎使用智能助手
</h1>
<div class="dio-m">选择对话模式</div>
<div class="container2">
<div class="item" onclick="toggleActive(this)">更有创造力</div>
<div class="item active" onclick="toggleActive(this)">适中</div>
<div class="item" onclick="toggleActive(this)">更精准</div>
</div>
<div class="container3">
<label for="rangeInput">单次聊天回复的最大 Token 数，如果预计输出的内容比较多，把它调大一些。如果你输入内容过多，可能会超过Token数限制则要调小一点。</label>
<div class="v_my input-range_input-range__QBkD1 ">
<span id="rangeValueFormatted">1000</span>
<!--<input type="range" min="1" max="4000" step="1" value="600" id="rangeInput">-->
<input type="range" min="1" max="3500" step="1" v-model="rangeValue" id="rangeInput">
<span class="t-t">tokens</span>
</div>
</div>
<div class="text-gray-800 w-full md:max-w-2xl lg:max-w-3xl md:h-full md:flex md:flex-col px-6 dark:text-gray-100" id="text-gray-800">
<br>
<div class="md:flex items-start text-center gap-3.5">
<div class="flex flex-col mb-8 md:mb-auto gap-3.5 flex-1">
<h2 class="flex gap-3 items-center m-auto text-lg font-normal md:flex-col md:gap-2" >
<svg
stroke="currentColor"
fill="none"
stroke-width="1.5"
viewBox="0 0 24 24"
stroke-linecap="round"
stroke-linejoin="round"
class="h-6 w-6"
height="1em"
width="1em"
xmlns="http://www.w3.org/2000/svg"
>
<circle cx="12" cy="12" r="5"></circle>
<line x1="12" y1="1" x2="12" y2="3"></line>
<line x1="12" y1="21" x2="12" y2="23"></line>
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64"></line>
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78"></line>
<line x1="1" y1="12" x2="3" y2="12"></line>
<line x1="21" y1="12" x2="23" y2="12"></line>
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36"></line>
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22"></line>
</svg>
例子
</h2>
<ul class="flex flex-col gap-3.5 w-full sm:max-w-md m-auto" id="container" v-on:click="getText($event)">
<button class="w-full bg-gray-50 dark:bg-white/5 p-3 rounded-md hover:bg-gray-200 dark:hover:bg-gray-900">
<font style="vertical-align: inherit">
<font style="vertical-align: inherit"></font></font>
<font style="vertical-align: inherit">
<font style="vertical-align: inherit">
我今天见了3个客户帮我写一个工作日报，需要包含今日工作内容，明日工作计划，心得。
</font></font><font style="vertical-align: inherit">
<font style="vertical-align: inherit"></font></font>
</button>
<button class="w-full bg-gray-50 dark:bg-white/5 p-3 rounded-md hover:bg-gray-200 dark:hover:bg-gray-900">
<font style="vertical-align: inherit">
<font style="vertical-align: inherit">“</font></font>
<font style="vertical-align: inherit">
<font style="vertical-align: inherit">
js 实现点击并列元素中的一个获取里面的text赋值到input中
</font></font><font 
最低0.47元/天 解锁文章
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
