爱极客专注分享-好玩的docker应用-源码分享

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

推荐国内稳定中转API:GeekHub

## 1. 前言

推荐一

今天我们再来介绍一个更高级的版本,除了可以免注册,免代理,随时随地访问之外,它还支持语音输入输出,识别图像信息的功能

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

2. 项目展示

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

2.1 视觉模型支持

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

LobeChat 现在支持 OpenAI 最新的 gpt-4-vision 模型,具备视觉识别能力,这是一种能够感知视觉内容的多模态智能。用户可以轻松上传或拖放图片到对话框中,代理将能够识别图片内容,并基于此进行智能对话,创造更智能、更多样化的聊天场景。

这一功能开启了新的互动方式,让交流超越文本,包含丰富的视觉元素。无论是在日常使用中分享图片,还是在特定行业内解读图片,该代理提供了卓越的对话体验。

2.2 TTS 和 STT 语音识别

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

LobeChat 支持文本到语音(TTS)和语音到文本(STT)技术,使我们的应用程序能够将文本消息转换成清晰的语音输出,允许用户与我们的会话代理进行交互,就像他们在与真人交谈一样。用户可以从多种声音中选择一种与代理搭配。

此外,TTS 为那些偏好听觉学习或希望在忙碌时接收信息的人提供了一个极佳的解决方案。在 LobeChat 中,我们精心挑选了一系列高质量的语音选项(OpenAI Audio、Microsoft Edge Speech),以满足来自不同地区和文化背景用户的需求。用户可以选择适合他们个人喜好或特定场景的语音,从而获得个性化的沟通体验。

2.3 函数调用插件系统

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

LobeChat 的插件生态系统是其核心功能的重要扩展,极大地增强了 ChatGPT 的实用性和灵活性。通过利用插件,ChatGPT 可以执行实时信息检索和处理,例如自动获取最新新闻头条,为用户提供即时且相关的信息。此外,这些插件不仅限于新闻聚合,还可以扩展到其他实用功能,如快速文档检索、电子商务平台数据访问以及各种第三方服务。

2.4 自带很多 Prompt “角色”

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

在 LobeChat 代理市场中,创作者可以发现一个充满活力和创新的社区,这里汇集了众多设计精良的代理,它们不仅在工作场景中扮演着重要角色,还在学习过程中提供了极大的便利。我们的市场不仅仅是一个展示平台,也是一个协作空间。在这里,每个人都可以贡献自己的智慧,并分享他们开发的代理。

支持 PWA

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

我们深刻理解在当今多设备环境中为用户提供无缝体验的重要性。因此,我们采用了渐进式网页应用(PWA)技术,这是一种现代网络技术,它使网页应用的体验接近于原生应用。

通过 PWA,LobeChat 能够在桌面和移动设备上提供高度优化的用户体验,同时保持其轻量级和高性能的特点。在视觉和感觉方面,我们还精心设计了界面,确保它与原生应用无法区分,提供流畅的动画、响应式布局,并适应不同设备屏幕分辨率。

2.5 移动设备适配

2.6 各种主题模式选择

3. 相关地址

官方 GitHub 地址:https://github.com/lobehub/lobe-chat
官方 Demo:https://chat-preview.lobehub.com
官方文档:https://github.com/lobehub/lobe-chat/wiki

4. 搭建环境

服务器建议:1 核 1G 即可,不要用大陆的服务器

5. 搭建方式

如果你不是用的腾讯云的轻量应用服务器,可以直接跳到 5.1 部分。

安装系统(腾讯云轻量应用服务器)

[【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

腾讯云轻量服务器最大的特点就是 “轻量”,相比 CVM,更适合小白上手,这边我们之间选择 Docker 基础镜像,就可以省去后面安装 Docker 的步骤 (如果你非要用国内的服务器,这边装的 Docker 镜像还会帮你配置好国内镜像源,让你加速访问 docker 镜像资源) 不建议用国内的 。

登陆(腾讯云轻量应用服务器)

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

5.1 安装 Docker 与 Nginx Proxy Manager

可以直接参考这篇内容:

https://iigeek.com/archives/331

5.2 创建安装目录

创建一下安装的目录:

sudo -i

mkdir -p /home/data/docker_data/lobe

cd /home/data/docker_data/lobe

vim docker-compose.yml

英文输入法下,按 i

version: "3"
services:
    lobe-chat:
        ports:
            - 8080:3210
        environment:
            - OPENAI_API_KEY=XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX # 你的API Key
            - ACCESS_CODE=iigeekgpt # 设置一个密码
        image: lobehub/lobe-chat

简单说一下:

  • OPENAI_API_KEY 可以在这边获取: https://platform.openai.com/api-keys
  • ACCESS_CODE 自己随意取一个密码,以后想要使用的人只要有这个密码即可使用,可以不用填 API KEY(就用你的这个 API KEY 了)

切换成英文输入法,修改好之后,按一下 esc,然后 :wq 保存退出。

5.3 打开服务器防火墙(非必需)并访问网页

打开防火墙的端口 8090为例

举例,腾讯云打开方法如下(部分服务商没有自带的面板防火墙,就不用这步操作了):

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

图中示例填的是 5230,备注填的是 memos,这边我们填 8090,示例填 shop ,确定即可(如果你在 docker-compose 文件里换了 9009,这边就需要填 9009,以此类推)

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

查看端口是否被占用(以 8090 为例),输入:

lsof -i:8090  #查看 8090 端口是否被占用,如果被占用,重新自定义一个端口

如果啥也没出现,表示端口未被占用,我们可以继续下面的操作了~

如果出现:

-bash: lsof: command not found

运行:

apt install lsof  #安装 lsof

如果端口没有被占用(被占用了就修改一下端口,比如改成 8081,注意 docker 命令行里和防火墙都要改)

理论上我们就可以输入 http://ip:8090 访问了。

注意:

1、不知道服务器 IP,可以直接在命令行输入:curl ip.sb,会显示当前服务器的 IP。

2、遇到访问不了的情况,请再次检查在宝塔面板的防火墙和服务商的后台防火墙是否打开对应了端口。

一般情况下,我们都需要给网页加上 https!让网页更安全!

namesilo 上面 xyz 后缀的域名一年就 7 块钱,可以年抛。(冷知识,namesilo 上 6 位数字的 xyz 续费永远都是 0.99 美元 = =)

如果想要长期使用,还是建议买 com 后缀的域名,更加正规一些,可以输入 laodade 来获得 1 美元的优惠(不知道现在还有没有)

namesilo 自带隐私保护,我一直在用这家,价格也是这些注册商里面比较低的,关键是他家不像其他家域名注册商,没有七七八八的套路!(就是后台界面有些古老 = =)

我们接着往下看!

6. 反向代理

6.1 利用 Nginx Proxy Manager

在添加反向代理之前,确保你已经完成了域名解析,不会的可以看这个:域名一枚,并做好解析到服务器上域名购买、域名解析

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

之后,登陆 Nginx Proxy Manager(不会的看这个:安装 Nginx Proxy Manager相关教程))

注意:

Nginx Proxy Manager(以下简称 NPM)会用到 80443 端口,所以本机不能占用(比如原来就有 Nginx)

直接丢几张图:

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

注意填写对应的 域名IP端口,按文章来的话,应该是 8090

IP 填写:

如果 Nginx Proxy Manager 和 shop 在同一台服务器上,可以在终端输入:

bash

ip addr show docker0

查看对应的 Docker 容器内部 IP。

[【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

否则直接填 shop 所在的服务器 IP 就行。

[【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

再次打开,勾选这些:

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

然后就可以用域名来安装访问了。

6.2 利用宝塔面板

发现还是有不少小伙伴习惯用宝塔面板,这边也贴一个宝塔面板的反代配置:

直接新建一个站点,不要数据库,不要 PHP,纯静态即可。

然后打开下面的配置,修改 Nginx 的配置。

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型[【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

代码如下:

location / {
  proxy_pass http://127.0.0.1:8090/;       # 注意改成你实际使用的端口
  rewrite ^/(.*)$ /$1 break;
  proxy_redirect off;
  proxy_set_header Host $host;
  proxy_set_header X-Forwarded-Proto $scheme;
  proxy_set_header X-Real-IP $remote_addr;
  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
  proxy_set_header Upgrade-Insecure-Requests 1;
  proxy_set_header X-Forwarded-Proto https;
}

此方法对 90% 的反向代理都能生效,然后就可以用域名来安装访问了。

有同学可能会问,为什么不直接用宝塔自带的反向代理功能。

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

也可以,不过我自己之前遇到过当有多个网站需要反代的时候,在这边设置会报错的情况 = =

所以后来就不用了,直接用上面的方法来操作了。

7. 使用教程

自己尝试一下。

7.1 更新 lobe

项目最近更新比较频繁,建议大家及时跟着更新。

cd /root/data/docker_data/lobe

docker-compose pull

docker-compose up -d    # 请不要使用 docker-compose stop 来停止容器,因为这么做需要额外的时间等待容器停止;docker-compose up -d 直接升级容器时会自动停止并立刻重建新的容器,完全没有必要浪费那些时间。

docker image prune  # prune 命令用来删除不再使用的 docker 对象。删除所有未被 tag 标记和未被容器使用的镜像

提示:

WARNING! This will remove all dangling images.
Are you sure you want to continue? [y/N] 

输入 y

利用 Docker 搭建的应用,更新非常容易~

7.2 卸载 lobe

同样进入安装页面,先停止所有容器。

cd /root/data/docker_data/lobe

docker-compose down

cd ..

rm -rf /root/data/docker_data/lobe  # 完全删除

可以卸载得很干净。

8. 常见问题及注意点

1、如果你要使用读图功能,需要使用 gpt-4-vision-preview 这个模型

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

2、语音输入,如果设置关闭了自动结束语音识别说完话记得再点一下图标。

【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型
【好玩儿的 Docker 项目】支持图片识别 + 语音输入!10 分钟搭建无门槛 ChatGPT WEB 应用 ——LobeChat,随时随地使用 ChatGPT!|GPT-4 模型

9. 结尾

祝大家用得开心,有问题可以去 GitHub 提 Issues,也可以在评论区互相交流探讨。

同时,有能力给项目做贡献的同学,也欢迎积极加入到 项目 中来,贡献自己的一份力量!

最后,感谢开发人员们的辛苦付出,让我们能用到这么优秀的项目!

参考资料

官方 GitHub 地址:https://github.com/lobehub/lobe-chat
官方 Demo:https://chat-preview.lobehub.com
官方文档:https://github.com/lobehub/lobe-chat/wiki

© 版权声明
THE END
喜欢就支持一下吧
点赞5赞赏 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容