【案例共创】在开发者空间使用 MateChat 和Mass快速开发智能对话界面
【摘要】 开发者空间快速验证 MateChat !
一、案例介绍
MateChat 致力于构建不同业务场景下高一致性的 GenAI 体验系统语言,同时匹配各种工具/平台的原生业务场景和界面特征,提供更适合研发工具领域的对话组件,打造流畅亲和、跨界一致、易学易用的用户体验,以及易接入、易维护、易扩展的开发体验。
开源仓库地址: https://gitcode.com/DevCloudFE/MateChat
Mass(即 ModelArts Studio 大模型即服务平台)是华为云面向 AI 开发者推出的一站式大模型开发平台,支持开发者一键体验大模型能力,快速构建大模型应用。Mass 平台提供大模型训练、推理、部署、管理、监控等全生命周期管理能力,帮助开发者快速构建大模型应用,加速 AI 开发。
开发者空间是华为云面向开发者提供的云上开发环境,支持开发者快速创建、部署、调试、运行、管理应用。开发者空间提供丰富的开发工具和资源,支持开发者快速构建应用,加速开发。
本案例中我们使用华为云开发者空间,基于 MateChat 和 Mass 快速开发智能对话界面。
二、免费领取云主机
如您还没有云主机,可点击链接,根据领取指南进行操作。
如您已领取云主机,可直接开始案例实践。
三、操作流程
💡 说明:
- ① 通过开发者空间云主机的 Firefox 浏览器访问并开通 ModelArts Studio 模型即服务。本次实验采用的 Qwen2_5-72B-Instruct 。
- ② 通过终端从 https://gitcode.com/huqi/MateChat-Web 获取源代码,源代码基于 Vite+Vue3+Express 实现 MateChat 的应用。
- ③ 通过 Firefox 浏览器访问本地部署的 MateChat 应用,体验智能对话。
四、用到资源
云资源 |
消耗/时 |
时长 |
---|---|---|
开发者空间-云主机 |
免费 |
30min |
ModelArts Studio |
免费 |
30min |
合计:0 元
五、实践步骤
1、环境开通及源代码获取
1.1 配置云主机
工欲善其事必先利其器,首先配置云主机并使用 Euler 的 JS 工具集(Nodejs + Git),当然如果您已经使用了其他环境,我们需要安装 NodeJS(https://nodejs.org/zh-cn/download)。
如上图点击“安装”我们即可获得一个 NodeJS 环境,进入桌面后,我们可以打开终端执行命令查看当前的 NodeJS 版本和 Git 版本,确认环境已初始化成功:
node -v
npm -v
git --version
1.2 源代码获取
本案例涉及的代码已发布在 GitCode 平台上: https://gitcode.com/huqi/MateChat-Web
执行 git clone
拉取源代码
git clone [https://gitcode.com/huqi/MateChat-Web](https://gitcode.com/huqi/MateChat-Web)
2. ModelArts Studio 模型服务
2.1 访问 ModelArts Studio 模型部署
进入云主机,打开浏览器,输入 https://console.huaweicloud.com/modelarts/?region=cn-east-4&locale=zh-cn#/model-studio/deployment
,即可访问 ModelArts Studio。
2.2 领取免费 Token 额度
领取千万免费 token 额度,可用于体验 Qwen、Chatglm 等系列模型,免费额度仅适合用于体验模型。Qwen2.5 系列预置服务还支持 Function Calling,可以用于构建 Agent。
2.3 获取大模型 API 和名称
以 Qwen2_5-72B-Instruct
为例,点击更多-调用,获取 API 地址和模型名称。
2.4 创建 API Key
左侧鉴权管理-创建 API Key,保存创建的密钥信息
最多创建 5 个密钥,密钥只会在新建后显示一次,请妥善保存。
2.5 调试大模型 API
我们使用 curl 脚本调试大模型 API,确保 API 配置可用,在终端执行以下命令。
# 调试API
curl -X POST "yourBaseUrl" \
-H "Content-Type: application/json" \
-H "Authorization: Bearer yourApiKey" \
-d '{
"model": "yourModelName",
"max_tokens": 20,
"messages": [
{"role": "system", "content": "You are a helpful assistant."},
{"role": "user", "content": "你好"}
],
"stream": false,
"temperature": 1.0
}'
💡 请把
yourBaseUrl
、yourApiKey
、yourModelName
替换为步骤 2.1.3 和步骤 2.1.4 中的信息。
能看到类似的返回即为 API 配置可用。
{"id":"chat-1d324bf7eb884c728b2542ddc53f7218","object":"chat.completion","created":1734748674,"model":"Qwen2.5-72B","choices":[{"index":0,"message":{"role":"assistant","content":"你好!很高兴见到你!你有什么问题或者需要帮助吗?","tool_calls":[]},"logprobs":null,"finish_reason":"stop","stop_reason":null}],"usage":{"prompt_tokens":20,"total_tokens":35,"completion_tokens":15},"prompt_logprobs":null}
3 运行 MateChat
通过上面两步,我们已经获取到了所需要环境、代码、大模型 API 配置,接来我们将安装依赖并修改配置最终运行 MateChat。
3.1 安装依赖
我们进入到项目并执行命令安装依赖:
cd MateChat-Web && npm install
安装结果如下图则说明依赖安装成功.
3.2 修改配置
我们可以通过 cat
命令查看 .env.example
cat .env.example
其内容为:
VITE_OPENAI_API_KEY=你的API密钥
VITE_OPENAI_PROXY_URL=你的API地址
VITE_OPENAI_MODEL=你的模型名称
VITE_PORT=8090
VITE_OPENAI_BASE_URL=http://localhost:8090
这是因为 Maas 提供的大模型 API 不支持客户端调用的缘故,我们需要通过 express 转发请求。
接着我们通过 cp
命令复制一份名为 .env
的配置文件
cp .env.eample .env
cat .env
接着我们通过云主机自带的 emacs 软件打开并编辑 .env
文件:
emacs .env
💡 也可以使用 vi 命令修改 .env ; 目的是配置好大模型 API,注意 chat/completion 这部分需删除
3.3 运行 MateChat
确认配置无误后,通过以下命令运行程序:
npm run start
按住 Ctrl,鼠标单击 http://localhost:5173 即可访问 MateChat:
尝试问个问题能看到 MaasAPI 的回复:
至此,我们成功运行了 MateChat!
我正在参加【案例共创】第 1 期 书写云产品应用构建开发最佳实践/评测,共创官方文档 https://bbs.huaweicloud.com/forum/thread-0217170307934787108-1-1.html
【声明】本内容来自华为云开发者社区博主,不代表华为云及华为云开发者社区的观点和立场。转载时必须标注文章的来源(华为云社区)、文章链接、文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱:
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
作者其他文章
周周的奇妙编程2025/01/28 08:07:411楼编辑删除举报
胡琦2025/02/08 02:03:28编辑删除举报