【手把手详细教程】 Trae AI和Vscode~使用第三方中转API配置Claude ,GPT,Gemini等大模型教程

【手把手详细教程】 Trae AI和Vscode~使用第三方中转API配置Claude ,GPT,Gemini等大模型教程

        在人工智能技术迅猛发展的今天,Anthropic 的 Claude 系列模型,Openai的GPT系列模型,Google的Gemini系列因其卓越的推理能力、代码生成和长文本处理技术,已成为全球开发者构建智能应用的重要选择。然而,国内开发者在直接调用官方模型时,普遍面临网络延迟高、访问不稳定、支付繁琐等难题。此帖子为记录我配置TRAE 软件时,配置的详细步骤,以及接入Claude ,GPT,Gemini等大模型过程。(Tips:后续发现Vscode配置也是同流程,也可以进行此帖子参考)

1.安装TRAE

         访问 Trae AI 官网,选择适合自己电脑操作系统进行下载,本文以博主的Windows系统作为举例。

        (国内版官网)https://www.trae.com.cn/

        (国际版官网)https://www.trae.ai/

2.配置TRAE

选择语言(中文/英文)和主题(暗色/亮色/深蓝)

根据需要导入现有编辑器设置(可选)

如果之前使用过 VS Code ,可以一键导入配置

点击从 VS Code 导入" 导入"按钮

系统会自动导入插件、IDE 设置、快捷键设置等信息

如需全新开始,可选择跳过即可

然后添加命令行(可选)

为方便在终端中使用 Trae:

点击"安装 trae 命令"按钮

安装后可在终端使用以下命令:

trae:快速唤起 Trae

trae my-react-app:在 Trae 中打开指定项目

如果不需要可以直接点击跳过即可。 成功后进入TRAE主界面。

进入TRAE的扩展商店搜索Cline进行安装下载。

3.API Key与URL地址的获取

要想在TRAE上正确使用各类大模型我们需要购买官方平台提供的API或者第三方提供的API。

通过对比价格,稳定性,速度,三方面后,我决定选择的第三方魔芋api平台来获取API key。

点击链接前往api平台👉https://www.moyu.info/register?aff=g2d7

使用手机号码或者邮箱来进行账号注册。

注册成功后登录进入【令牌管理】

配置完成后可以使用新配置的令牌或者,初始平台生成的令牌。

返回TRAE的配置地方,填写好相关URL地址->https://www.moyu.info, 平台上复制的api key,

然后Model ID 要去平台复制。(模型广场里面每个模型右上角有复制按钮)

4.接入GPT系列或者Gemini系列模型

安装好后,打开侧边的Cline应用。

勾选第三个[Bring my own API Key] 确定,进入api配置界面。

使用Gemini和GPT模型需要注意不要选择错了 API Provider!!!

保存后,回去主页面测试一下,正常回复,即为成功!!!!

5.接入Claude系列模型

TRAE如果接入Claude系列模型会比较复杂,摸索了许久,最后整理如下。

所以我们要先进行Claude Code的下载以及配置。

Claude Code 安装教程

1. 环境安装

1.1 Node.js 环境安装

  1. 打开浏览器访问 https://nodejs.org/
  2. 点击 "LTS" 版本进行下载(推荐长期支持版本)
  3. 下载完成后双击 .msi 文件
  4. 按照安装向导完成安装,一直 Next 保持默认设置即可

                按下 Win + X 组合键,选择 "终端管理员" 或 "Windows PowerShell (管理员)" 打开         PowerShell,输入以下命令:

node --version npm --version

如果显示版本号,说明安装成功。

1.2 安装 Git Bash

下载并安装 Git for Windows:

  1. 访问 https://git-scm.com/downloads/win
  2. 点击 "Download for Windows" 下载安装包
  3. 运行下载的 .exe 安装文件
  4. 在安装过程中保持默认设置,直接点击 "Next" 完成安装

安装完成后验证 Git Bash 安装,打开 Git Bash 输入以下命令验证:

git --version

2. 安装 配置Claude Code

打开 PowerShell,运行以下命令:

npm install -g @anthropic-ai/claude-code 

安装完成后若出现 Setup notes 提示,运行以下命令:

[Environment]::SetEnvironmentVariable('Path', ([Environment]::GetEnvironmentVariable('Path','User') + ";$HOME\.local\bin"), 'User')

安装完成后输入以下命令查看是否安装成功:

claude --version

安装成功后配置环境变量,在 PowerShell 输入以下命令:

[Environment]::SetEnvironmentVariable("ANTHROPIC_AUTH_TOKEN", "API 密钥", "User") [Environment]::SetEnvironmentVariable("ANTHROPIC_BASE_URL", "平台地址", "User") [Environment]::SetEnvironmentVariable("ANTHROPIC_MODEL", "默认 claude 模型", "User") 

(密钥是填写平台上复制的,平台地址是:https://www.moyu.info,模型名称也要去平台上复制要用的Claude模型)

设置完成后关闭当前 PowerShell,重新打开一个 PowerShell 界面,检查是否配置成功:

echo $env:ANTHROPIC_AUTH_TOKEN echo $env:ANTHROPIC_BASE_URL echo $env:ANTHROPIC_MODEL

显示这样即为安装配置成功!!!

3. 在TRAE上配置Claude Code 插件

在TRAE上扩展商店上搜索Claude Code for VS Code 进行下载。

下载完成后点击左边区域的Claude按钮启动。

然后就会自动打开对话框的了,图示为配置成功展示。我配置是用(Claude Sonnet 4.6)。

6.总结

这次配置过程还是颇为复杂的,但收获良多。在VScode上此教程也是通用的,也可以进行对照参考。

Read more

Java Web 公交线路查询系统系统源码-SpringBoot2+Vue3+MyBatis-Plus+MySQL8.0【含文档】

Java Web 公交线路查询系统系统源码-SpringBoot2+Vue3+MyBatis-Plus+MySQL8.0【含文档】

摘要 随着城市化进程的加速,公共交通系统的复杂性和规模不断扩大,传统的公交线路查询方式已难以满足用户高效、精准的出行需求。公交线路查询系统的开发旨在解决这一问题,通过信息化手段提升公交出行的便捷性和智能化水平。该系统整合了公交线路、站点、换乘等关键信息,为用户提供实时查询、最优路径推荐等功能,同时优化公交资源管理效率。关键词:公交线路查询、智能化出行、信息化管理、SpringBoot、Vue3。 本系统采用前后端分离架构,后端基于SpringBoot2框架,结合MyBatis-Plus实现高效数据持久化操作,MySQL8.0作为数据库存储公交线路、站点及用户信息。前端使用Vue3构建响应式用户界面,提供线路查询、换乘推荐、站点导航等功能。系统支持多条件筛选和动态路径规划,确保用户能够快速获取最优出行方案。关键词:SpringBoot2、Vue3、MyBatis-Plus、MySQL8.0、路径规划。 数据表 公交线路数据表 公交线路数据表用于存储公交线路的基本信息,包括线路名称、运营方向、首末班时间等属性。线路编号是该表的主键,用于唯一标识每条线路。结构表如表3-1所示。

轻松搭建个人WebDAV文件服务器:小白也能快速上手

轻松搭建个人WebDAV文件服务器:小白也能快速上手 【免费下载链接】webdavSimple Go WebDAV server. 项目地址: https://gitcode.com/gh_mirrors/we/webdav 还在为多设备间文件同步而烦恼吗?想要拥有一个安全可靠的文件共享平台吗?这个基于Go语言开发的WebDAV服务器正是你需要的解决方案。它简单易用、功能强大,让你轻松搭建专属的文件管理服务。 🎯 快速上手:三种部署方式任你选 方式一:一键安装(推荐新手) # 使用Homebrew安装 brew install webdav # 使用Go工具链安装 go install github.com/hacdias/webdav/v5@latest 方式二:Docker容器化部署 docker run -p 6060:6060 -v $(pwd)/data:/data

微信 H5 缓存控制:后端重定向 & 前端强制刷新

在 Web 开发中,缓存是一把双刃剑。对于静态资源,它能极大提升加载速度;但对于业务逻辑频繁变动的 H5 页面(如支付、订单页),缓存往往会导致用户看到过期的数据或界面。最近在维护一个 uni-app 项目时,遇到了一段关于 H5 缓存控制的逻辑,引发了我对于“后端重定向加时间戳”和“前端 JS 加时间戳”这两种方案的思考。虽然两者的最终目的一致,但在 Hash 模式下,它们的实现原理和效果有着本质的区别。 一、 问题背景 在应用启动的生命周期中,通常会有这样一段逻辑:当用户访问特定的关键页面(如支付、订单页)时,如果当前 URL 中缺少时间戳参数,前端会自动解析 URL,追加当前时间戳,并强制页面刷新。 这就引出了一个问题:为什么不直接在后端重定向时加时间戳?这两种方式有什么区别? 二、 核心区别:

AI 时代,前端逆向的门槛已经低到离谱 — 以 Upwork 为例

我用 AI 逆向 Upwork 消息系统,2小时搞定数据层开发 前言 作为 Upwork 自由职业者,我一直觉得它的消息管理界面信息量太大,不够直观。我想做一个 Chrome 插件来简化消息管理,核心需求很简单:一眼看出哪些对话需要我回复,哪些在等对方。 传统做法是下载混淆后的 JS 文件慢慢分析,但这次我决定换个思路——全程和 AI 配合,看看能多快搞定。 结果远超预期。从零开始到完全摸清 API、认证方式、数据结构,总共不到 2 小时。 第一步:摸清技术栈(5分钟) 打开 Upwork 消息页面,F12 看 Sources 面板,从加载的 JS 文件名就能判断出技术栈: ThunderNuxt/rooms.fdb6ff58.