|
| 1 | +# ChatGPT Web |
| 2 | + |
| 3 | +> 声明:此项目只发布于 GitHub,基于 MIT 协议,免费且作为开源学习使用。并且不会有任何形式的卖号、付费服务、讨论群、讨论组等行为。谨防受骗。 |
| 4 | +
|
| 5 | +[English](README.md) |
| 6 | + |
| 7 | + |
| 8 | + |
| 9 | + |
| 10 | +- [ChatGPT Web](#chatgpt-web) |
| 11 | + - [介绍](#介绍) |
| 12 | + - [待实现路线](#待实现路线) |
| 13 | + - [前置要求](#前置要求) |
| 14 | + - [Node](#node) |
| 15 | + - [PNPM](#pnpm) |
| 16 | + - [填写密钥](#填写密钥) |
| 17 | + - [安装依赖](#安装依赖) |
| 18 | + - [后端](#后端) |
| 19 | + - [前端](#前端) |
| 20 | + - [测试环境运行](#测试环境运行) |
| 21 | + - [后端服务](#后端服务) |
| 22 | + - [前端网页](#前端网页) |
| 23 | + - [环境变量](#环境变量) |
| 24 | + - [打包](#打包) |
| 25 | + - [使用 Docker](#使用-docker) |
| 26 | + - [Docker 参数示例](#docker-参数示例) |
| 27 | + - [Docker build \& Run](#docker-build--run) |
| 28 | + - [Docker compose](#docker-compose) |
| 29 | + - [防止爬虫抓取](#防止爬虫抓取) |
| 30 | + - [使用 Railway 部署](#使用-railway-部署) |
| 31 | + - [Railway 环境变量](#railway-环境变量) |
| 32 | + - [使用 Sealos 部署](#使用-sealos-部署) |
| 33 | + - [手动打包](#手动打包) |
| 34 | + - [后端服务](#后端服务-1) |
| 35 | + - [前端网页](#前端网页-1) |
| 36 | + - [常见问题](#常见问题) |
| 37 | + - [参与贡献](#参与贡献) |
| 38 | + - [赞助](#赞助) |
| 39 | + - [License](#license) |
| 40 | +## 介绍 |
| 41 | + |
| 42 | +支持双模型,提供了两种非官方 `ChatGPT API` 方法 |
| 43 | + |
| 44 | +| 方式 | 免费? | 可靠性 | 质量 | |
| 45 | +| --------------------------------------------- | ------ | ---------- | ---- | |
| 46 | +| `ChatGPTAPI(gpt-3.5-turbo-0301)` | 否 | 可靠 | 相对较笨 | |
| 47 | +| `ChatGPTUnofficialProxyAPI(网页 accessToken)` | 是 | 相对不可靠 | 聪明 | |
| 48 | + |
| 49 | +对比: |
| 50 | +1. `ChatGPTAPI` 使用 `gpt-3.5-turbo` 通过 `OpenAI` 官方 `API` 调用 `ChatGPT` |
| 51 | +2. `ChatGPTUnofficialProxyAPI` 使用非官方代理服务器访问 `ChatGPT` 的后端`API`,绕过`Cloudflare`(依赖于第三方服务器,并且有速率限制) |
| 52 | + |
| 53 | +警告: |
| 54 | +1. 你应该首先使用 `API` 方式 |
| 55 | +2. 使用 `API` 时,如果网络不通,那是国内被墙了,你需要自建代理,绝对不要使用别人的公开代理,那是危险的。 |
| 56 | +3. 使用 `accessToken` 方式时反向代理将向第三方暴露您的访问令牌,这样做应该不会产生任何不良影响,但在使用这种方法之前请考虑风险。 |
| 57 | +4. 使用 `accessToken` 时,不管你是国内还是国外的机器,都会使用代理。默认代理为 [pengzhile](https://github.com/pengzhile) 大佬的 `https://ai.fakeopen.com/api/conversation`,这不是后门也不是监听,除非你有能力自己翻过 `CF` 验证,用前请知悉。[社区代理](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)(注意:只有这两个是推荐,其他第三方来源,请自行甄别) |
| 58 | +5. 把项目发布到公共网络时,你应该设置 `AUTH_SECRET_KEY` 变量添加你的密码访问权限,你也应该修改 `index.html` 中的 `title`,防止被关键词搜索到。 |
| 59 | + |
| 60 | +切换方式: |
| 61 | +1. 进入 `service/.env.example` 文件,复制内容到 `service/.env` 文件 |
| 62 | +2. 使用 `OpenAI API Key` 请填写 `OPENAI_API_KEY` 字段 [(获取 apiKey)](https://platform.openai.com/overview) |
| 63 | +3. 使用 `Web API` 请填写 `OPENAI_ACCESS_TOKEN` 字段 [(获取 accessToken)](https://chat.openai.com/api/auth/session) |
| 64 | +4. 同时存在时以 `OpenAI API Key` 优先 |
| 65 | + |
| 66 | +环境变量: |
| 67 | + |
| 68 | +全部参数变量请查看或[这里](#环境变量) |
| 69 | + |
| 70 | +``` |
| 71 | +/service/.env.example |
| 72 | +``` |
| 73 | + |
| 74 | +## 待实现路线 |
| 75 | +[✓] 双模型 |
| 76 | + |
| 77 | +[✓] 多会话储存和上下文逻辑 |
| 78 | + |
| 79 | +[✓] 对代码等消息类型的格式化美化处理 |
| 80 | + |
| 81 | +[✓] 访问权限控制 |
| 82 | + |
| 83 | +[✓] 数据导入、导出 |
| 84 | + |
| 85 | +[✓] 保存消息到本地图片 |
| 86 | + |
| 87 | +[✓] 界面多语言 |
| 88 | + |
| 89 | +[✓] 界面主题 |
| 90 | + |
| 91 | +[✗] More... |
| 92 | + |
| 93 | +## 前置要求 |
| 94 | + |
| 95 | +### Node |
| 96 | + |
| 97 | +`node` 需要 `^16 || ^18 || ^19` 版本(`node >= 14` 需要安装 [fetch polyfill](https://github.com/developit/unfetch#usage-as-a-polyfill)),使用 [nvm](https://github.com/nvm-sh/nvm) 可管理本地多个 `node` 版本 |
| 98 | + |
| 99 | +```shell |
| 100 | +node -v |
| 101 | +``` |
| 102 | + |
| 103 | +### PNPM |
| 104 | +如果你没有安装过 `pnpm` |
| 105 | +```shell |
| 106 | +npm install pnpm -g |
| 107 | +``` |
| 108 | + |
| 109 | +### 填写密钥 |
| 110 | +获取 `Openai Api Key` 或 `accessToken` 并填写本地环境变量 [跳转](#介绍) |
| 111 | + |
| 112 | +``` |
| 113 | +# service/.env 文件 |
| 114 | +
|
| 115 | +# OpenAI API Key - https://platform.openai.com/overview |
| 116 | +OPENAI_API_KEY= |
| 117 | +
|
| 118 | +# change this to an `accessToken` extracted from the ChatGPT site's `https://chat.openai.com/api/auth/session` response |
| 119 | +OPENAI_ACCESS_TOKEN= |
| 120 | +``` |
| 121 | + |
| 122 | +## 安装依赖 |
| 123 | + |
| 124 | +> 为了简便 `后端开发人员` 的了解负担,所以并没有采用前端 `workspace` 模式,而是分文件夹存放。如果只需要前端页面做二次开发,删除 `service` 文件夹即可。 |
| 125 | +
|
| 126 | +### 后端 |
| 127 | + |
| 128 | +进入文件夹 `/service` 运行以下命令 |
| 129 | + |
| 130 | +```shell |
| 131 | +pnpm install |
| 132 | +``` |
| 133 | + |
| 134 | +### 前端 |
| 135 | +根目录下运行以下命令 |
| 136 | +```shell |
| 137 | +pnpm bootstrap |
| 138 | +``` |
| 139 | + |
| 140 | +## 测试环境运行 |
| 141 | +### 后端服务 |
| 142 | + |
| 143 | +进入文件夹 `/service` 运行以下命令 |
| 144 | + |
| 145 | +```shell |
| 146 | +pnpm start |
| 147 | +``` |
| 148 | + |
| 149 | +### 前端网页 |
| 150 | +根目录下运行以下命令 |
| 151 | +```shell |
| 152 | +pnpm dev |
| 153 | +``` |
| 154 | + |
| 155 | +## 环境变量 |
| 156 | + |
| 157 | +`API` 可用: |
| 158 | + |
| 159 | +- `OPENAI_API_KEY` 和 `OPENAI_ACCESS_TOKEN` 二选一 |
| 160 | +- `OPENAI_API_MODEL` 设置模型,可选,默认:`gpt-3.5-turbo` |
| 161 | +- `OPENAI_API_BASE_URL` 设置接口地址,可选,默认:`https://api.openai.com` |
| 162 | +- `OPENAI_API_DISABLE_DEBUG` 设置接口关闭 debug 日志,可选,默认:empty 不关闭 |
| 163 | + |
| 164 | +`ACCESS_TOKEN` 可用: |
| 165 | + |
| 166 | +- `OPENAI_ACCESS_TOKEN` 和 `OPENAI_API_KEY` 二选一,同时存在时,`OPENAI_API_KEY` 优先 |
| 167 | +- `API_REVERSE_PROXY` 设置反向代理,可选,默认:`https://ai.fakeopen.com/api/conversation`,[社区](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy)(注意:只有这两个是推荐,其他第三方来源,请自行甄别) |
| 168 | + |
| 169 | +通用: |
| 170 | + |
| 171 | +- `AUTH_SECRET_KEY` 访问权限密钥,可选 |
| 172 | +- `MAX_REQUEST_PER_HOUR` 每小时最大请求次数,可选,默认无限 |
| 173 | +- `TIMEOUT_MS` 超时,单位毫秒,可选 |
| 174 | +- `SOCKS_PROXY_HOST` 和 `SOCKS_PROXY_PORT` 一起时生效,可选 |
| 175 | +- `SOCKS_PROXY_PORT` 和 `SOCKS_PROXY_HOST` 一起时生效,可选 |
| 176 | +- `HTTPS_PROXY` 支持 `http`,`https`, `socks5`,可选 |
| 177 | +- `ALL_PROXY` 支持 `http`,`https`, `socks5`,可选 |
| 178 | + |
| 179 | +## 打包 |
| 180 | + |
| 181 | +### 使用 Docker |
| 182 | + |
| 183 | +#### Docker 参数示例 |
| 184 | + |
| 185 | + |
| 186 | + |
| 187 | +#### Docker build & Run |
| 188 | + |
| 189 | +```bash |
| 190 | +docker build -t chatgpt-web . |
| 191 | + |
| 192 | +# 前台运行 |
| 193 | +docker run --name chatgpt-web --rm -it -p 127.0.0.1:3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web |
| 194 | + |
| 195 | +# 后台运行 |
| 196 | +docker run --name chatgpt-web -d -p 127.0.0.1:3002:3002 --env OPENAI_API_KEY=your_api_key chatgpt-web |
| 197 | + |
| 198 | +# 运行地址 |
| 199 | +http://localhost:3002/ |
| 200 | +``` |
| 201 | + |
| 202 | +#### Docker compose |
| 203 | + |
| 204 | +[Hub 地址](https://hub.docker.com/repository/docker/chenzhaoyu94/chatgpt-web/general) |
| 205 | + |
| 206 | +```yml |
| 207 | +version: '3' |
| 208 | + |
| 209 | +services: |
| 210 | + app: |
| 211 | + image: chenzhaoyu94/chatgpt-web # 总是使用 latest ,更新时重新 pull 该 tag 镜像即可 |
| 212 | + ports: |
| 213 | + - 127.0.0.1:3002:3002 |
| 214 | + environment: |
| 215 | + # 二选一 |
| 216 | + OPENAI_API_KEY: sk-xxx |
| 217 | + # 二选一 |
| 218 | + OPENAI_ACCESS_TOKEN: xxx |
| 219 | + # API接口地址,可选,设置 OPENAI_API_KEY 时可用 |
| 220 | + OPENAI_API_BASE_URL: xxx |
| 221 | + # API模型,可选,设置 OPENAI_API_KEY 时可用,https://platform.openai.com/docs/models |
| 222 | + # gpt-4, gpt-4-1106-preview, gpt-4-0314, gpt-4-0613, gpt-4-32k, gpt-4-32k-0314, gpt-4-32k-0613, gpt-3.5-turbo-16k, gpt-3.5-turbo-16k-0613, gpt-3.5-turbo, gpt-3.5-turbo-0301, gpt-3.5-turbo-0613, text-davinci-003, text-davinci-002, code-davinci-002 |
| 223 | + OPENAI_API_MODEL: xxx |
| 224 | + # 反向代理,可选 |
| 225 | + API_REVERSE_PROXY: xxx |
| 226 | + # 访问权限密钥,可选 |
| 227 | + AUTH_SECRET_KEY: xxx |
| 228 | + # 每小时最大请求次数,可选,默认无限 |
| 229 | + MAX_REQUEST_PER_HOUR: 0 |
| 230 | + # 超时,单位毫秒,可选 |
| 231 | + TIMEOUT_MS: 60000 |
| 232 | + # Socks代理,可选,和 SOCKS_PROXY_PORT 一起时生效 |
| 233 | + SOCKS_PROXY_HOST: xxx |
| 234 | + # Socks代理端口,可选,和 SOCKS_PROXY_HOST 一起时生效 |
| 235 | + SOCKS_PROXY_PORT: xxx |
| 236 | + # HTTPS 代理,可选,支持 http,https,socks5 |
| 237 | + HTTPS_PROXY: http://xxx:7890 |
| 238 | +``` |
| 239 | +- `OPENAI_API_BASE_URL` 可选,设置 `OPENAI_API_KEY` 时可用 |
| 240 | +- `OPENAI_API_MODEL` 可选,设置 `OPENAI_API_KEY` 时可用 |
| 241 | + |
| 242 | +#### 防止爬虫抓取 |
| 243 | + |
| 244 | +**nginx** |
| 245 | + |
| 246 | +将下面配置填入nginx配置文件中,可以参考 `docker-compose/nginx/nginx.conf` 文件中添加反爬虫的方法 |
| 247 | + |
| 248 | +``` |
| 249 | + # 防止爬虫抓取 |
| 250 | + if ($http_user_agent ~* "360Spider|JikeSpider|Spider|spider|bot|Bot|2345Explorer|curl|wget|webZIP|qihoobot|Baiduspider|Googlebot|Googlebot-Mobile|Googlebot-Image|Mediapartners-Google|Adsbot-Google|Feedfetcher-Google|Yahoo! Slurp|Yahoo! Slurp China|YoudaoBot|Sosospider|Sogou spider|Sogou web spider|MSNBot|ia_archiver|Tomato Bot|NSPlayer|bingbot") |
| 251 | + { |
| 252 | + return 403; |
| 253 | + } |
| 254 | +``` |
| 255 | +
|
| 256 | +### 使用 Railway 部署 |
| 257 | +
|
| 258 | +[](https://railway.app/new/template/yytmgc) |
| 259 | +
|
| 260 | +#### Railway 环境变量 |
| 261 | +
|
| 262 | +| 环境变量名称 | 必填 | 备注 | |
| 263 | +| --------------------- | ---------------------- | -------------------------------------------------------------------------------------------------- | |
| 264 | +| `PORT` | 必填 | 默认 `3002` |
| 265 | +| `AUTH_SECRET_KEY` | 可选 | 访问权限密钥 | |
| 266 | +| `MAX_REQUEST_PER_HOUR` | 可选 | 每小时最大请求次数,可选,默认无限 | |
| 267 | +| `TIMEOUT_MS` | 可选 | 超时时间,单位毫秒 | |
| 268 | +| `OPENAI_API_KEY` | `OpenAI API` 二选一 | 使用 `OpenAI API` 所需的 `apiKey` [(获取 apiKey)](https://platform.openai.com/overview) | |
| 269 | +| `OPENAI_ACCESS_TOKEN` | `Web API` 二选一 | 使用 `Web API` 所需的 `accessToken` [(获取 accessToken)](https://chat.openai.com/api/auth/session) | |
| 270 | +| `OPENAI_API_BASE_URL` | 可选,`OpenAI API` 时可用 | `API`接口地址 | |
| 271 | +| `OPENAI_API_MODEL` | 可选,`OpenAI API` 时可用 | `API`模型 | |
| 272 | +| `API_REVERSE_PROXY` | 可选,`Web API` 时可用 | `Web API` 反向代理地址 [详情](https://github.com/transitive-bullshit/chatgpt-api#reverse-proxy) | |
| 273 | +| `SOCKS_PROXY_HOST` | 可选,和 `SOCKS_PROXY_PORT` 一起时生效 | Socks代理 | |
| 274 | +| `SOCKS_PROXY_PORT` | 可选,和 `SOCKS_PROXY_HOST` 一起时生效 | Socks代理端口 | |
| 275 | +| `SOCKS_PROXY_USERNAME` | 可选,和 `SOCKS_PROXY_HOST` 一起时生效 | Socks代理用户名 | |
| 276 | +| `SOCKS_PROXY_PASSWORD` | 可选,和 `SOCKS_PROXY_HOST` 一起时生效 | Socks代理密码 | |
| 277 | +| `HTTPS_PROXY` | 可选 | HTTPS 代理,支持 http,https, socks5 | |
| 278 | +| `ALL_PROXY` | 可选 | 所有代理 代理,支持 http,https, socks5 | |
| 279 | +
|
| 280 | +> 注意: `Railway` 修改环境变量会重新 `Deploy` |
| 281 | +
|
| 282 | +### 使用 Sealos 部署 |
| 283 | +
|
| 284 | +[](https://cloud.sealos.io/?openapp=system-fastdeploy%3FtemplateName%3Dchatgpt-web) |
| 285 | +
|
| 286 | +> 环境变量与 Docker 环境变量一致 |
| 287 | +
|
| 288 | +### 手动打包 |
| 289 | +#### 后端服务 |
| 290 | +> 如果你不需要本项目的 `node` 接口,可以省略如下操作 |
| 291 | +
|
| 292 | +复制 `service` 文件夹到你有 `node` 服务环境的服务器上。 |
| 293 | +
|
| 294 | +```shell |
| 295 | +# 安装 |
| 296 | +pnpm install |
| 297 | +
|
| 298 | +# 打包 |
| 299 | +pnpm build |
| 300 | +
|
| 301 | +# 运行 |
| 302 | +pnpm prod |
| 303 | +``` |
| 304 | + |
| 305 | +PS: 不进行打包,直接在服务器上运行 `pnpm start` 也可 |
| 306 | + |
| 307 | +#### 前端网页 |
| 308 | + |
| 309 | +1、修改根目录下 `.env` 文件中的 `VITE_GLOB_API_URL` 为你的实际后端接口地址 |
| 310 | + |
| 311 | +2、根目录下运行以下命令,然后将 `dist` 文件夹内的文件复制到你网站服务的根目录下 |
| 312 | + |
| 313 | +[参考信息](https://cn.vitejs.dev/guide/static-deploy.html#building-the-app) |
| 314 | + |
| 315 | +```shell |
| 316 | +pnpm build |
| 317 | +``` |
| 318 | + |
| 319 | +## 常见问题 |
| 320 | +Q: 为什么 `Git` 提交总是报错? |
| 321 | + |
| 322 | +A: 因为有提交信息验证,请遵循 [Commit 指南](./CONTRIBUTING.md) |
| 323 | + |
| 324 | +Q: 如果只使用前端页面,在哪里改请求接口? |
| 325 | + |
| 326 | +A: 根目录下 `.env` 文件中的 `VITE_GLOB_API_URL` 字段。 |
| 327 | + |
| 328 | +Q: 文件保存时全部爆红? |
| 329 | + |
| 330 | +A: `vscode` 请安装项目推荐插件,或手动安装 `Eslint` 插件。 |
| 331 | + |
| 332 | +Q: 前端没有打字机效果? |
| 333 | + |
| 334 | +A: 一种可能原因是经过 Nginx 反向代理,开启了 buffer,则 Nginx 会尝试从后端缓冲一定大小的数据再发送给浏览器。请尝试在反代参数后添加 `proxy_buffering off;`,然后重载 Nginx。其他 web server 配置同理。 |
| 335 | + |
| 336 | +## 参与贡献 |
| 337 | + |
| 338 | +贡献之前请先阅读 [贡献指南](./CONTRIBUTING.md) |
| 339 | + |
| 340 | +感谢所有做过贡献的人! |
| 341 | + |
| 342 | +<a href="https://github.com/Chanzhaoyu/chatgpt-web/graphs/contributors"> |
| 343 | + <img src="https://contrib.rocks/image?repo=Chanzhaoyu/chatgpt-web" /> |
| 344 | +</a> |
| 345 | + |
| 346 | +## 赞助 |
| 347 | + |
| 348 | +如果你觉得这个项目对你有帮助,并且情况允许的话,可以给我一点点支持,总之非常感谢支持~ |
| 349 | + |
| 350 | +<div style="display: flex; gap: 20px;"> |
| 351 | + <div style="text-align: center"> |
| 352 | + <img style="max-width: 100%" src="./docs/wechat.png" alt="微信" /> |
| 353 | + <p>WeChat Pay</p> |
| 354 | + </div> |
| 355 | + <div style="text-align: center"> |
| 356 | + <img style="max-width: 100%" src="./docs/alipay.png" alt="支付宝" /> |
| 357 | + <p>Alipay</p> |
| 358 | + </div> |
| 359 | +</div> |
| 360 | + |
| 361 | +## License |
| 362 | +MIT © [ChenZhaoYu](./license) |
0 commit comments