WP-ChatGPT web前端

WP-ChatGPT web前端

介绍

支持双模型,提供了两种非官方 ChatGPT API 方法

方式免费?可靠性质量
ChatGPTAPI(gpt-3.5-turbo-0301)可靠相对较笨
ChatGPTUnofficialProxyAPI(网页 accessToken)相对不可靠聪明

对比:

  1. ChatGPTAPI 使用 gpt-3.5-turbo-0301 通过官方OpenAI补全API模拟ChatGPT(最稳健的方法,但它不是免费的,并且没有使用针对聊天进行微调的模型)
  2. ChatGPTUnofficialProxyAPI 使用非官方代理服务器访问 ChatGPT 的后端API,绕过Cloudflare(使用真实的的ChatGPT,非常轻量级,但依赖于第三方服务器,并且有速率限制)

查看详情

切换方式:

  1. 进入 service/.env.example 文件,复制内容到 service/.env 文件
  2. 使用 OpenAI API Key 请填写 OPENAI_API_KEY 字段 (获取 apiKey)
  3. 使用 Web API 请填写 OPENAI_ACCESS_TOKEN 字段 (获取 accessToken)
  4. 同时存在时以 OpenAI API Key 优先

反向代理:

ChatGPTUnofficialProxyAPI时可用,详情

# service/.env
API_REVERSE_PROXY=

环境变量:

全部参数变量请查看或这里

/service/.env

前置要求

Node

node 需要 ^16 || ^18 版本(node >= 14 需要安装 fetch polyfill),使用 nvm 可管理本地多个 node 版本

node -v

PNPM

如果你没有安装过 pnpm

npm install pnpm -g

填写密钥

获取 Openai Api Key 或 accessToken 并填写本地环境变量 跳转

# service/.env 文件

# OpenAI API Key - https://platform.openai.com/overview
OPENAI_API_KEY=

# change this to an `accessToken` extracted from the ChatGPT site's `https://chat.openai.com/api/auth/session` response
OPENAI_ACCESS_TOKEN=

安装依赖

为了简便 后端开发人员 的了解负担,所以并没有采用前端 workspace 模式,而是分文件夹存放。如果只需要前端页面做二次开发,删除 service 文件夹即可。

后端

进入文件夹 /service 运行以下命令

pnpm install

前端

根目录下运行以下命令

pnpm bootstrap

测试环境运行

后端服务

进入文件夹 /service 运行以下命令

pnpm start

前端网页

根目录下运行以下命令

pnpm dev

打包

使用 Docker

Docker 参数示例

  • OPENAI_API_KEY 二选一
  • OPENAI_ACCESS_TOKEN 二选一,同时存在时,OPENAI_API_KEY 优先
  • OPENAI_API_BASE_URL 可选,设置 OPENAI_API_KEY 时可用
  • OPENAI_API_MODEL 可选,设置 OPENAI_API_KEY 时可用
  • API_REVERSE_PROXY 可选,设置 OPENAI_ACCESS_TOKEN 时可用 参考
  • AUTH_SECRET_KEY 访问权限密钥,可选
  • TIMEOUT_MS 超时,单位毫秒,可选
  • SOCKS_PROXY_HOST 可选,和 SOCKS_PROXY_PORT 一起时生效
  • SOCKS_PROXY_PORT 可选,和 SOCKS_PROXY_HOST 一起时生效
WP-ChatGPT web前端

Docker build & Run

docker build -t chatgpt-web .

# 前台运行
docker run --name chatgpt-web --rm -it -p 3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web

# 后台运行
docker run --name chatgpt-web -d -p 3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web

# 运行地址
http://localhost:3002/

Docker compose

Hub 地址

version: '3'

services:
  app:
    image: chenzhaoyu94/chatgpt-web # 总是使用 latest ,更新时重新 pull 该 tag 镜像即可
    ports:
      - 3002:3002
    environment:
      # 二选一
      OPENAI_API_KEY: xxxxxx
      # 二选一
      OPENAI_ACCESS_TOKEN: xxxxxx
      # API接口地址,可选,设置 OPENAI_API_KEY 时可用
      OPENAI_API_BASE_URL: xxxx
      # API模型,可选,设置 OPENAI_API_KEY 时可用
      OPENAI_API_MODEL: xxxx
      # 反向代理,可选
      API_REVERSE_PROXY: xxx
      # 访问权限密钥,可选
      AUTH_SECRET_KEY: xxx
      # 超时,单位毫秒,可选
      TIMEOUT_MS: 60000
      # Socks代理,可选,和 SOCKS_PROXY_PORT 一起时生效
      SOCKS_PROXY_HOST: xxxx
      # Socks代理端口,可选,和 SOCKS_PROXY_HOST 一起时生效
      SOCKS_PROXY_PORT: xxxx
  • OPENAI_API_BASE_URL 可选,设置 OPENAI_API_KEY 时可用
  • OPENAI_API_MODEL 可选,设置 OPENAI_API_KEY 时可用

使用 Railway 部署

WP-ChatGPT web前端

Railway 环境变量

环境变量名称必填备注
PORT必填默认 3002
AUTH_SECRET_KEY可选访问权限密钥
TIMEOUT_MS可选超时时间,单位毫秒
OPENAI_API_KEYOpenAI API 二选一使用 OpenAI API 所需的 apiKey (获取 apiKey)
OPENAI_ACCESS_TOKENWeb API 二选一使用 Web API 所需的 accessToken (获取 accessToken)
OPENAI_API_BASE_URL可选,OpenAI API 时可用API接口地址
OPENAI_API_MODEL可选,OpenAI API 时可用API模型
API_REVERSE_PROXY可选,Web API 时可用Web API 反向代理地址 详情
SOCKS_PROXY_HOST可选,和 SOCKS_PROXY_PORT 一起时生效Socks代理
SOCKS_PROXY_PORT可选,和 SOCKS_PROXY_HOST 一起时生效Socks代理端口

注意: Railway 修改环境变量会重新 Deploy

手动打包

后端服务

如果你不需要本项目的 node 接口,可以省略如下操作

复制 service 文件夹到你有 node 服务环境的服务器上。

# 安装
pnpm install

# 打包
pnpm build

# 运行
pnpm prod

PS: 不进行打包,直接在服务器上运行 pnpm start 也可

前端网页

1、修改根目录下 .env 文件中的 VITE_APP_API_BASE_URL 为你的实际后端接口地址

2、根目录下运行以下命令,然后将 dist 文件夹内的文件复制到你网站服务的根目录下

参考信息

pnpm build
声明:本站部分文章或资源,整理于网络或由网友提供,主要用于知识性分享与学习用途。若相关内容侵犯了原著者的合法权益,请联系处理。
周边资源开源代码

一个基于Aplayer和MetingJS的静态音乐播放器

2023-3-15 10:54:57

AI插件&API

人工智能 OpenAI ChatGPT 账号国内注册攻略丨图文教程

2023-4-11 15:45:14

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧