Coder Social home page Coder Social logo

yidadaa / chatgpt-next-web Goto Github PK

View Code? Open in Web Editor NEW
67.2K 388.0 54.5K 13.86 MB

A cross-platform ChatGPT/Gemini UI (Web / PWA / Linux / Win / MacOS). 一键拥有你自己的跨平台 ChatGPT/Gemini 应用。

Home Page: https://app.nextchat.dev/

License: MIT License

TypeScript 87.41% JavaScript 0.80% SCSS 10.90% Dockerfile 0.23% Shell 0.59% Rust 0.06%
chatgpt nextjs vercel webui cross-platform tauri tauri-app react desktop gemini fe gemini-pro gemini-server gemini-ultra ollama groq claude calclaude

chatgpt-next-web's Introduction

icon

NextChat (ChatGPT Next Web)

English / 简体中文

One-Click to get a well-designed cross-platform ChatGPT web UI, with GPT3, GPT4 & Gemini Pro support.

一键免费部署你的跨平台私人 ChatGPT 应用, 支持 GPT3, GPT4 & Gemini Pro 模型。

Web Windows MacOS Linux

Web App / Desktop App / Discord / Twitter

网页版 / 客户端 / 反馈

Deploy with Vercel

Deploy on Zeabur

Open in Gitpod

cover

Features

  • Deploy for free with one-click on Vercel in under 1 minute
  • Compact client (~5MB) on Linux/Windows/MacOS, download it now
  • Fully compatible with self-deployed LLMs, recommended for use with RWKV-Runner or LocalAI
  • Privacy first, all data is stored locally in the browser
  • Markdown support: LaTex, mermaid, code highlight, etc.
  • Responsive design, dark mode and PWA
  • Fast first screen loading speed (~100kb), support streaming response
  • New in v2: create, share and debug your chat tools with prompt templates (mask)
  • Awesome prompts powered by awesome-chatgpt-prompts-zh and awesome-chatgpt-prompts
  • Automatically compresses chat history to support long conversations while also saving your tokens
  • I18n: English, 简体中文, 繁体中文, 日本語, Français, Español, Italiano, Türkçe, Deutsch, Tiếng Việt, Русский, Čeština, 한국어, Indonesia

Roadmap

  • System Prompt: pin a user defined prompt as system prompt #138
  • User Prompt: user can edit and save custom prompts to prompt list
  • Prompt Template: create a new chat with pre-defined in-context prompts #993
  • Share as image, share to ShareGPT #1741
  • Desktop App with tauri
  • Self-host Model: Fully compatible with RWKV-Runner, as well as server deployment of LocalAI: llama/gpt4all/rwkv/vicuna/koala/gpt4all-j/cerebras/falcon/dolly etc.
  • Plugins: support network search, calculator, any other apis etc. #165

What's New

  • 🚀 v2.10.1 support Google Gemini Pro model.
  • 🚀 v2.9.11 you can use azure endpoint now.
  • 🚀 v2.8 now we have a client that runs across all platforms!
  • 🚀 v2.7 let's share conversations as image, or share to ShareGPT!
  • 🚀 v2.0 is released, now you can create prompt templates, turn your ideas into reality! Read this: ChatGPT Prompt Engineering Tips: Zero, One and Few Shot Prompting.

主要功能

  • 在 1 分钟内使用 Vercel 免费一键部署
  • 提供体积极小(~5MB)的跨平台客户端(Linux/Windows/MacOS), 下载地址
  • 完整的 Markdown 支持:LaTex 公式、Mermaid 流程图、代码高亮等等
  • 精心设计的 UI,响应式设计,支持深色模式,支持 PWA
  • 极快的首屏加载速度(~100kb),支持流式响应
  • 隐私安全,所有数据保存在用户浏览器本地
  • 预制角色功能(面具),方便地创建、分享和调试你的个性化对话
  • 海量的内置 prompt 列表,来自中文英文
  • 自动压缩上下文聊天记录,在节省 Token 的同时支持超长对话
  • 多国语言支持:English, 简体中文, 繁体中文, 日本語, Español, Italiano, Türkçe, Deutsch, Tiếng Việt, Русский, Čeština, 한국어, Indonesia
  • 拥有自己的域名?好上加好,绑定后即可在任何地方无障碍快速访问

开发计划

  • 为每个对话设置系统 Prompt #138
  • 允许用户自行编辑内置 Prompt 列表
  • 预制角色:使用预制角色快速定制新对话 #993
  • 分享为图片,分享到 ShareGPT 链接 #1741
  • 使用 tauri 打包桌面应用
  • 支持自部署的大语言模型:开箱即用 RWKV-Runner ,服务端部署 LocalAI 项目 llama / gpt4all / rwkv / vicuna / koala / gpt4all-j / cerebras / falcon / dolly 等等,或者使用 api-for-open-llm
  • 插件机制,支持联网搜索、计算器、调用其他平台 api #165

最新动态

  • 🚀 v2.0 已经发布,现在你可以使用面具功能快速创建预制对话了! 了解更多: ChatGPT 提示词高阶技能:零次、一次和少样本提示
  • 💡 想要更方便地随时随地使用本项目?可以试下这款桌面插件:https://github.com/mushan0x0/AI0x0.com
  • 🚀 v2.7 现在可以将会话分享为图片了,也可以分享到 ShareGPT 的在线链接。
  • 🚀 v2.8 发布了横跨 Linux/Windows/MacOS 的体积极小的客户端。
  • 🚀 v2.9.11 现在可以使用自定义 Azure 服务了。

Get Started

简体中文 > 如何开始使用

  1. Get OpenAI API Key;
  2. Click Deploy with Vercel, remember that CODE is your page password;
  3. Enjoy :)

FAQ

简体中文 > 常见问题

English > FAQ

Keep Updated

简体中文 > 如何保持代码更新

If you have deployed your own project with just one click following the steps above, you may encounter the issue of "Updates Available" constantly showing up. This is because Vercel will create a new project for you by default instead of forking this project, resulting in the inability to detect updates correctly.

We recommend that you follow the steps below to re-deploy:

  • Delete the original repository;
  • Use the fork button in the upper right corner of the page to fork this project;
  • Choose and deploy in Vercel again, please see the detailed tutorial.

Enable Automatic Updates

If you encounter a failure of Upstream Sync execution, please manually sync fork once.

After forking the project, due to the limitations imposed by GitHub, you need to manually enable Workflows and Upstream Sync Action on the Actions page of the forked project. Once enabled, automatic updates will be scheduled every hour:

Automatic Updates

Enable Automatic Updates

Manually Updating Code

If you want to update instantly, you can check out the GitHub documentation to learn how to synchronize a forked project with upstream code.

You can star or watch this project or follow author to get release notifications in time.

Access Password

简体中文 > 如何增加访问密码

This project provides limited access control. Please add an environment variable named CODE on the vercel environment variables page. The value should be passwords separated by comma like this:

code1,code2,code3

After adding or modifying this environment variable, please redeploy the project for the changes to take effect.

Environment Variables

简体中文 > 如何配置 api key、访问密码、接口代理

CODE (optional)

Access password, separated by comma.

OPENAI_API_KEY (required)

Your openai api key, join multiple api keys with comma.

BASE_URL (optional)

Default: https://api.openai.com

Examples: http://your-openai-proxy.com

Override openai api request base url.

OPENAI_ORG_ID (optional)

Specify OpenAI organization ID.

AZURE_URL (optional)

Example: https://{azure-resource-url}/openai/deployments/{deploy-name}

Azure deploy url.

AZURE_API_KEY (optional)

Azure Api Key.

AZURE_API_VERSION (optional)

Azure Api Version, find it at Azure Documentation.

GOOGLE_API_KEY (optional)

Google Gemini Pro Api Key.

GOOGLE_URL (optional)

Google Gemini Pro Api Url.

ANTHROPIC_API_KEY (optional)

anthropic claude Api Key.

ANTHROPIC_API_VERSION (optional)

anthropic claude Api version.

ANTHROPIC_URL (optional)

anthropic claude Api Url.

HIDE_USER_API_KEY (optional)

Default: Empty

If you do not want users to input their own API key, set this value to 1.

DISABLE_GPT4 (optional)

Default: Empty

If you do not want users to use GPT-4, set this value to 1.

ENABLE_BALANCE_QUERY (optional)

Default: Empty

If you do want users to query balance, set this value to 1.

DISABLE_FAST_LINK (optional)

Default: Empty

If you want to disable parse settings from url, set this to 1.

CUSTOM_MODELS (optional)

Default: Empty Example: +llama,+claude-2,-gpt-3.5-turbo,gpt-4-1106-preview=gpt-4-turbo means add llama, claude-2 to model list, and remove gpt-3.5-turbo from list, and display gpt-4-1106-preview as gpt-4-turbo.

To control custom models, use + to add a custom model, use - to hide a model, use name=displayName to customize model name, separated by comma.

User -all to disable all default models, +all to enable all default models.

WHITE_WEBDEV_ENDPOINTS (可选)

You can use this option if you want to increase the number of webdav service addresses you are allowed to access, as required by the format:

  • Each address must be a complete endpoint

https://xxxx/yyy

  • Multiple addresses are connected by ', '

Requirements

NodeJS >= 18, Docker >= 20

Development

简体中文 > 如何进行二次开发

Open in Gitpod

Before starting development, you must create a new .env.local file at project root, and place your api key into it:

OPENAI_API_KEY=<your api key here>

# if you are not able to access openai service, use this BASE_URL
BASE_URL=https://chatgpt1.nextweb.fun/api/proxy

Local Development

# 1. install nodejs and yarn first
# 2. config local env vars in `.env.local`
# 3. run
yarn install
yarn dev

Deployment

简体中文 > 如何部署到私人服务器

Docker (Recommended)

docker pull yidadaa/chatgpt-next-web

docker run -d -p 3000:3000 \
   -e OPENAI_API_KEY=sk-xxxx \
   -e CODE=your-password \
   yidadaa/chatgpt-next-web

You can start service behind a proxy:

docker run -d -p 3000:3000 \
   -e OPENAI_API_KEY=sk-xxxx \
   -e CODE=your-password \
   -e PROXY_URL=http://localhost:7890 \
   yidadaa/chatgpt-next-web

If your proxy needs password, use:

-e PROXY_URL="http://127.0.0.1:7890 user pass"

Shell

bash <(curl -s https://raw.githubusercontent.com/Yidadaa/ChatGPT-Next-Web/main/scripts/setup.sh)

Synchronizing Chat Records (UpStash)

| 简体中文 | English | Italiano | 日本語 | 한국어

Documentation

Please go to the [docs][./docs] directory for more documentation instructions.

Screenshots

Settings

More

Translation

If you want to add a new translation, read this document.

Donation

Buy Me a Coffee

Special Thanks

Sponsor

仅列出捐赠金额 >= 100RMB 的用户。

@mushan0x0 @ClarenceDan @zhangjia @hoochanlon @relativequantum @desenmeng @webees @chazzhou @hauy @Corwin006 @yankunsong @ypwhs @fxxxchao @hotic @WingCH @jtung4 @micozhu @jhansion @Sha1rholder @AnsonHyq @synwith @piksonGit @ouyangzhiping @wenjiavv @LeXwDeX @Licoy @shangmin2009

Contributors

LICENSE

MIT

chatgpt-next-web's People

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

chatgpt-next-web's Issues

ui好看

ui和排版挺好看的,用的是什么ui库呢

想请教一下项目的入口是哪个文件

本人才疏学浅,看您写的代码框架应该是基于 React,但是我找不到它的入口文件(index.js之类的),烦请作者指教。
另附:作者您画的界面真的好看!请问您是 UI 设计师吗,请问您一般在什么地方浏览最新的视觉设计,还有我应该如何描述您当前构建的页面风格,是否有一个可以概括的词呢?
辛苦您!

libpng warning: iCCP: cHRM chunk does not match sRGB

libpng warning: iCCP: cHRM chunk does not match sRGB
[Chat Stream] [TypeError: fetch failed] {
cause: [ConnectTimeoutError: Connect Timeout Error] {
name: 'ConnectTimeoutError',
code: 'UND_ERR_CONNECT_TIMEOUT',
message: 'Connect Timeout Error'
}

安卓手机浏览器打开页面无法复制

机型:红米k50pro
问题:用夸克和手机自带浏览器访问,复制功能无法使用,弹出提示“复制失败,请给予粘贴板权限。”,但是我已反复确认权限已给,将网页打包成webapp也是这个问题。

全屏聊天框宽度

全屏聊天气泡间距会不会太宽了,不过我改的也没有好太多,大佬可以考虑下怎们调整下。
width

有两点建议

  1. 代码复制功能
  2. 文本消息转语音

另外内容复制功能好像不能用。

大佬,

大佬,请问这个
1.本项目提供有限的权限控制功能,请在环境变量页增加名为 CODE 的环境变量,值为用英文逗号分隔的自定义控制码:
code1,code2,code3
这个控制码是怎么用呢?
我部署完您的项目打开网页后提问它一直显示出错了。
2.另外能不能在页面上加一个让用户自己输入api-key的输入框呢

请求增加重试按钮

尊敬的开发者,

首先,我要感谢您对这个开源项目的贡献和辛勤工作。在使用这个项目的过程中,我遇到了一些问题,希望您能给予帮助。

我发现,在某些情况下,请求可能会因超时而失败。这导致我需要重新复制粘贴对话。因此,我想提出一个建议,即在项目中报错时添加一个重试按钮。这将使用户能够轻松地重新发起请求,从而减少了不必要的麻烦。

如果您能够考虑我的建议并加入这个功能,我会非常感激。我相信,这将使项目更加完善和易于使用。再次感谢您的努力和贡献。期待您的回复。

谢谢!
image

成功部署但无法访问

您好,非常感谢您的工作,非常简单便捷!
但成功部署之后发现无法打开,可能涉及到网络环境。我现有的网络可以正常登录chatgpt访问,但无法打开xxx.vercel.app,请问可能是什么问题吗?

ps. 对于这种国外的服务器我之前使用过netlify,当时也是访问很慢,后来用cloudflare配合阿里云进行加速,请问对于本工程有什么加速方案吗?

非常感谢您的时间,以上。

favicon分辨率提升建议

目前favicon的分辨率有点低,使用iOS Safari保存到桌面后,图标显示模糊,希望能提高分辨率,谢谢。

怎么本地启动

大佬,我刚接触前端代码,我想加一些日志输出,想知道这个怎么在本地启动调试呢?
对node版本有什么要求吗 ?

现在执行

npm install --save next react react-dom
next build
bash: next: command not found

npm run dev 启动会报错

[email protected] dev
cross-env COMMIT_ID=$(git rev-parse --short HEAD) next dev

'rev-parse' 不是内部或外部命令,也不是可运行的程序
或批处理文件。
node:events:491
throw er; // Unhandled 'error' event
^

Error: spawn rev-parse ENOENT
at notFoundError (C:\Users\里面\Desktop\biye\ChatGPT-Next-Web\node_modules\cross-spawn\lib\enoent.js:6:26)
at verifyENOENT (C:\Users\里面\Desktop\biye\ChatGPT-Next-Web\node_modules\cross-spawn\lib\enoent.js:40:16)
at ChildProcess.cp.emit (C:\Users\里面\Desktop\biye\ChatGPT-Next-Web\node_modules\cross-spawn\lib\enoent.js:27:25)
at Process.ChildProcess._handle.onexit (node:internal/child_process:293:12)
Emitted 'error' event on ChildProcess instance at:
at ChildProcess.cp.emit (C:\Users\里面\Desktop\biye\ChatGPT-Next-Web\node_modules\cross-spawn\lib\enoent.js:30:37)
at Process.ChildProcess._handle.onexit (node:internal/child_process:293:12) {
code: 'ENOENT',
errno: 'ENOENT',
syscall: 'spawn rev-parse',
path: 'rev-parse',
spawnargs: [ '--short', 'HEAD)', 'next', 'dev' ]

手机UI建议

在手机浏览器使用时,输入字符后输入框会刷新到最下方,被输入法遮挡,导致无法看到之前输入的内容。
复现环境:安卓版Edge 110 百度输入法 MIUI14。

另外,建议输入页面展示使用类似于聊天软件的形式,只在发送信息后展示对话框,而不是对话框随着输入框实时更新,视觉上感觉有一点点儿怪。

关于回复的内容换行符渲染的问题

Markdown 规范 1 2 中,单个 回车 不换行,行尾 两个空格+回车\+回车 才换行。
但是 ChatGPT 的回复没有遵循这个规范,完全按规范渲染会导致内容堆叠。

另外:Github 的 Issues 也是没完全按规范,一个换行符就换行。

ChatGPT-Next-Web 渲染显示内容:

好的,以下是一个可能的课程大纲:

一、引言 1.1 xxx 1.2 xxx

复制出来的内容:

好的,以下是一个可能的课程大纲:

一、引言
1.1 xxx
1.2 xxx

建议对话列表 × 二次确认

建议对删除对话做二次确认,防止误触。

另外还有一点:建议移动端对话列表的×默认显示,否则要长按一下才显示,长按一般会触发浏览器菜单,不是很符合移动端的操作逻辑。

将 README.md 中的中英文分离

同时放置中英文是一件好事,但是如果在将其掺杂在一起我认为会降低阅读体验。

ChatGPT 给出的解决方案 (prompt: 在 Github 的 README.md 中中英文版本是否应该分开):

在同一个README文件中包含中英文内容:

如果你的项目受众包括中英文用户,你可以在同一个README文件中提供中英文两个版本的内容。通常情况下,可以按顺序放置各个语言版本,例如先放英文版本,然后是中文版本。这样,读者可以根据自己的需求选择合适的语言阅读。

缺点是,如果README文件内容较多,这会使得文件变得很长,可能导致阅读体验不佳。

将中英文版本分开到不同的文件:

另一种选择是将中英文版本的README内容分开到不同的文件。例如,你可以将英文版放在名为README.md的文件中,将中文版放
在名为README.zh.md的文件中。在每个文件开头,添加指向其他语言版本的链接,方便用户切换。

这种做法的优点是,每个文件都更容易阅读和维护。然而,缺点是你需要确保在更新文档时,所有语言版本的内容保持一致。

综上所述,是否将中英文版本分开取决于你的实际需求。如果你认为在同一个文件中提供多语言内容可能会导致阅读体验不佳,那么将它们分开到不同的文件可能是更好的选择。相反,如果你认为维护多个单独的文件可能会导致内容不一致,那么将它们放在同一个文件中可能更合适。

访问控制逻辑的优化建议

马上更新体验了访问控制功能。
为了用户的良好体验,可否前10个提问不限制,谁都可以提。
超过10个提问就开启访问控制,必须输授权码才能继续

图片无法显示

image

原始markdown为:

要将一个矩阵的值转换为颜色并将其可视化,可以使用 matplotlib 库中的 imshow 函数。在 imshow 函数中,矩阵的每个元素会被映射到一个颜色上,这个映射是根据 cmap 参数来指定的。

下面是一个示例代码:

import numpy as np
import matplotlib.pyplot as plt

# 生成随机的二维矩阵a
a = np.random.randn(10, 10)

# 使用 imshow 函数可视化二维矩阵a
plt.imshow(a, cmap='Blues')

# 显示图像
plt.colorbar()
plt.show()

在上面的代码中,我们首先生成一个 $10\times 10$ 的随机二维矩阵 a,然后使用 imshow 函数可视化该二维矩阵。函数中的 cmap 参数指定了使用的颜色映射,这里我们使用了 "Blues" 映射,也就是随着矩阵元素值越大,颜色越深。执行上述代码,输出的结果类似于下图所示:

二维矩阵可视化

在输出的图像中,颜色越深的地方代表的是矩阵中值越大的位置,而颜色越浅的地方代表的是矩阵中值越小的位置。可以看出,这个可视化方式能够清晰地反映矩阵中的数值信息。

非常喜欢这个项目,简便快捷,但有一些建议

感谢您创建这个项目,非常喜欢您的设计,因为工作的关系,我没有很多功能的开发能力。我使用过很多chatgpt项目,对比其他项目,我在使用中发现一些问题,想要向您请求一些意见:

  1. 是否可以加入页面密码功能
  2. 是否有加入prompt列表功能的计划
  3. 代码部分是否可以加入颜色美化,light或dark模式
  4. AI回复过程中是否可以加入停止或者重新生成的按钮
  5. 在Enter输入过程中,没有其他快捷键换行
  6. 查询API余额功能

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.