普通视图
通过英伟达平台免费调用 GLM4.7 教程
前言
最近在折腾 AI Agent 和模型接入相关的事情时,意外发现英伟达居然提供了一个面向开发者、可以免费调用模型 API 的平台。更关键的是,这个平台上不仅能用到一些主流开源模型,还能直接使用最近热度很高,号称开源 Coding 能力最强的 GLM4.7,以及综合表现相当稳的 minimax-m2.1。
说实话,在如今 API 几乎全面 token 计费、随便一个复杂任务就轻松几十万甚至上百万 token 的背景下,这种可以正经做开发实验、不用一上来就烧钱的平台,对个人开发者和学习阶段的人来说非常友好。所以这篇文章主要做三件事:
- 介绍 NVIDIA Build 平台本身能做什么
- 记录从注册到实际调用 API 的完整流程
- 分享一段真实使用下来的模型体验与限制
整体偏实践,结论也会尽量基于实际使用情况展开。
NVIDIA Build 模型平台
NVIDIA Build可以理解为英伟达官方提供的一个模型集成与调试平台。平台上已经部署了大量模型,涵盖文生文(Chat / Reasoning / Coding)、文生图 / 图生文、语音相关等模型。目前平台上可见的模型数量在 200+,基本覆盖了市面上主流的开源模型生态,例如:deepseek-R1 / deepseek-v3.x、qwen3 / qwen-coder、kimi-k2、minimax-m2.1、z-ai/glm4.7,平台本身还提供了在线 Playground(支持参数调节、tools 调用)、OpenAI 风格的 API 接口、模型示例代码一键生成等能力。
注册账号与 API Key 申请
账号注册说明
注意:疑似因为近期注册用户激增,新账号存在一定概率无法正常申请 API Key 的问题。在不影响账号合规性的前提下,比较稳妥的做法是使用非国内常见的邮箱注册,例如相对少见的邮箱(yeah.net),或国外邮箱(gmail.com)等,以及注册时使用浏览器无痕窗口,避免历史状态干扰。
创建账号
访问:build.nvidia.com/ ,点击左上角 Login。
![]()
在弹窗中输入邮箱并点击 Next,随后填写注册信息并完成人机验证。
这里需要注意:在“更多注册选项”中可以看到 QQ、微信等方式,但不建议使用第三方快捷登录。在当前阶段,使用这些方式注册后,账号更容易出现 API 权限受限的情况。
完成注册后,会进入一些偏个性化设置的步骤(例如名称、偏好选项),按需填写即可。
![]()
如果账号状态正常,稍等片刻后,页面顶部会出现提示:
Please verify your account to get API access
点击右上角的 Verify 进入验证流程。
手机号验证
在验证弹窗中,将默认的 +1 修改为 +86,输入国内手机号即可。这里不需要刻意规避,国内手机号是可以正常通过验证的。
![]()
点击 Send Code via SMS,完成验证码验证。
创建 API Key
验证完成后,点击右上角头像,进入 API Keys 管理页面。
![]()
如果账号状态正常,这里可以看到 Generate API Key 按钮。
点击后,输入一个 Key 名称(仅用于区分),过期时间选择 Never Expire。
![]()
生成完成后,复制并妥善保存该 API Key,后续调用只会展示一次。
![]()
如果在 API Keys 页面完全看不到生成按钮,而是类似下图所示的提示界面,基本可以确认该账号当前无法使用 API 功能,建议更换账号重新注册。
![]()
使用 API Key 调用
本地客户端配置
只要是支持 OpenAI 风格接口的客户端基本都可以直接使用,我这里以 Jan 为例。
进入设置页,添加一个新的模型提供商。
![]()
- Provider Name:自定义(例如
Nvidia) - API Key:填写刚刚生成的 Key
- Base URL:
https://integrate.api.nvidia.com/v1
完成后添加模型。
![]()
例如添加 GLM4.7:
z-ai/glm4.7
![]()
新建会话并选择该模型后,即可正常对话。从体感上看,在普通对话场景下 token 输出速度非常快。
![]()
获取模型列表
Jan 也支持直接调用 /models 接口获取模型列表,点击刷新即可自动拉取并添加。
![]()
需要注意的是:
-
/models返回的是平台全量模型列表 - 其中包含文生图、语音、多模态等模型
- 并非所有模型都支持 chat / text-to-text
因此,如果在客户端中直接选择不支持 chat 的模型发送消息,会直接报错,这是模型能力不匹配,不是接口问题。
Playground 与模型调试
在 NVIDIA Build 平台的 Models 页面中,可以通过搜索 Chat / Reasoning 筛选支持的模型,或者在 Playground 页面的左上角看到所有支持文生文的模型列表。
![]()
以 kimi-k2 为例,点击模型后可以进入在线调试界面。
![]()
- 左侧 Tools:可启用模型支持的工具
- 右侧 Parameters:控制温度、最大 token 等参数
![]()
点击右上角 View Code,可以直接看到对应的 API 调用示例,包括 Base URL、Model ID、Messages 结构等。
![]()
Tools 调用示例
在部分模型中可以直接启用 tools,这里以 minimax-m2 为例演示。
启用 get_current_weather 工具后,询问某地天气,模型会自动进行 tools 规划与调用,并返回结果。
![]()
再次点击 View Code,可以看到完整的 tools 调用示例代码。
![]()
模型与接口
NVIDIA Build 提供的是 OpenAI 风格 API,接口层面兼容 chat.completions / responses,是否支持 chat、tools、多模态,取决于模型本身。所以,最稳妥的方式仍然是在平台 Models 页面中筛选 chat / reasoning,再决定是否接入到本地客户端或代码中。
使用体验与限制
说一下 GLM4.7 这个模型。它并不是我第一次用,在刚发布不久时我就已经通过一些第三方 API 供应商接触过,这次算是第二次较完整地使用。综合两次实际开发体验,说实话体感并不算好。
首先一个比较明显的问题是,在我目前常用的模型里(比如 qwen-code、gpt-5.1、gpt-5.2、Claude 等),只有 GLM4.7 会在生成的文件头部插入 Markdown 的代码块标记。这个问题在代码编辑和文件生成场景下尤其影响体验,需要额外清理,看起来就很蠢。
其次是执行效率问题,这一点让我感觉很奇怪。纯对话场景下它的响应速度是很快的,但一旦进入干活模式,比如稍微复杂一点的任务编排、代码修改或多步执行,单个任务可能会跑十几甚至二十分钟。问题不在于我不能接受模型执行复杂任务耗时,而是过程中偶尔会出现明显的停顿或卡住一段时间再继续,节奏非常不稳定。
一开始我也怀疑是 API 调用频率或限流导致的,但后来在同样的客户端、同样的任务复杂度下切换到 minimax-m2,发现并不是这个原因。minimax 的整体执行节奏要顺畅得多,调用也更激进,甚至可以轻松跑到 40 次 / 分钟 的平台上限,当然代价就是一旦规划稍微激进,就很容易直接撞上限流,接口报错,任务中断。
从平台层面来看,这个平台整体体验其实是非常不错的:模型选择多、接入成本低、示例清晰,对学习和实验阶段的开发者非常友好。平台的限制也比较直观明确,比如 API 调用频率限制在 40 次 / 分钟,超出后直接返回错误,这一点在 minimax-m2 上体现得尤为明显。
回到 GLM4.7 本身,客观来说它的功能是完全正常的:工具调用没问题,代码编辑能用,对话速度也快,只是在复杂任务执行阶段明显偏慢,且稳定性不够好。相比之下,minimax-m2 在相同条件下执行节奏更线性、更听话,只是更容易触发平台限流 (当然了,因为频繁触发限流所以我也没深度使用 minimax)。
总结来说,GLM4.7 并不是不能干活,但实际开发体验一般,尤其是在需要长时间、连续执行任务的场景下,效率和节奏上的问题会被放大。
结语
实话说,这个平台在当前这个时间点,真的算是相当良心的存在。对想学习 AI Agent、工具调用、多模型编排的开发者来说,能够在不额外付费的情况下反复试错,本身就很有价值。
当然了,平台策略和风控状态可能随时变化,如果只是想白嫖一点体验,建议还是尽早注册,至少在账号状态正常的前提下,把 API Key 拿到手。
至于模型怎么选,建议多试、多对比,别迷信单一模型。能稳定把活干完的模型,才是好模型。
相关链接
Nuxt 写后端
写接口
// server/api/test.ts
export default defineEventHandler(async (event) => {
// 写这个接口的逻辑
})
可以直接返回text、json、html、stream(文件流等流)。
放心好了,nuxt支持热模块替换和自动导入。改代码直接看到效果。无需手动写import语句。
// vue
<script setup>
// 要写import
import { ref } from 'vue'
import MyButton from '@/components/MyButton.vue'
import { useFetch } from '@/composables/useFetch'
const count = ref(0)
const { data } = useFetch('/api/data')
</script>
<template>
<MyButton>点击</MyButton>
</template>
Nuxt的自动导入
<script setup>
const count = ref(0) // 自动从`vue`导入ref
const { data } = useFetch('/api/data') // 自动从 composables/ 导入
</script>
<template>
<MyButton>点击</MyButton>
</template>
Nuxt自动导入了哪些
-
Vue API:ref、computed、onMounted等 -
Nuxt Composables:useFetch、useAsyncData等 -
Vue Router:useRouter、useRoute -
组件:components/目录下的所有组件 -
工具函数:utils/或composables/目录下的函数 -
VueUse:如果安装了@vueuse/nuxt
<template>
<div>
<h1>{{ title }}</h1>
<MyComponent />
</div>
</template>
<script setup>
// 1. 不需要导入 MyComponent - 自动导入
// 2. 修改后页面局部更新 - HMR
const title = ref('欢迎') // ref 也是自动导入的
</script>
部署 - 通用
云服务器构建Nuxt应用
CloudflareNetlifyEdge
混合渲染
自定义路由
// nuxt.config.ts
export default defineNuxtConfig({
routeRules: {
// 为 SEO 目的在构建时生成
'/': { prerender: true },
'/api/*': { cache: { maxAge: 60 * 60 } },
'/old-page': {
redirect: { to: '/new-page', statusCode: 302 }
}
}
})
目录结构
- 通过
nuxt.config和app.config在项目之间共享可重用的配置预设。 - 用
components/目录做组件库。 - 用
composables/和utils/目录创建工具和组合式函数库。 - 用
layers/目录做项目的层
每个层的srcDir都会自动创建命名的层别名。可以用#layers/test访问~~/layers/test层。
也可以自定义nuxt.config文件去设置添加extends去加一个层:
// nuxt.config.ts
export default defineNuxtConfig({
extends: [
'../base', // 从本地层去加
'@my-themes/awesome', // 从安装的包去加
'github:my-themes/awesome#v1' // 从git库中加
]
})
github私有库的要加token
// nuxt.config.ts
export default defineNuxtConfig({
extends: [
'../base', // 从本地层去加
'@my-themes/awesome', // 从安装的包去加
['github:my-themes/awesome#v1': { auth: process.env.GITHUB_TOKEN }] // 从git库中加
]
})
起别名
// nuxt.config.ts
export default defineNuxtConfig({
extends: [
[
'github:my-themes/awesome',
{
meta: {
name: 'my-awesome-theme',
},
},
],
]
})
预渲染
Nuxt允许页面在构建时进行静态渲染,提高SEO。
为啥选Nuxt。它SEO优秀啊。在应用中,我们可以选几个页面在构建时进行渲染。有请求时,Nuxt会提供预构建的页面,而不是动态生它们。
基于爬取的预渲染
用nuxt generate命令。通过Nitro爬虫去建和预渲染应用。
建站点,启动一个nuxt实例。
选择性预渲染
// nuxt.config.ts
export default defineNuxtConfig({
nitro: {
prerender: {
routes: ["/user/1", "/user/2"],
ignore: ["/dynamic"],
},
},
});
详细说一下nuxt generate是干啥的
nuxt generate 是 Nuxt.js 框架的一个**静态站点生成(Static Site Generation, SSG)**命令。我来详细解释一下它的含义和作用:
是什么?
nuxt generate 命令会将你的 Nuxt 应用预渲染为静态 HTML 文件。它会:
- 为每个路由生成对应的 HTML 文件
- 将生成的静态文件保存在
dist/目录中 - 包含必要的 CSS、JavaScript 和资源文件
主要作用
1. 性能优化
- 预生成的 HTML 文件无需服务器端渲染,加载速度极快
- CDN 友好,可以轻松缓存
- 减少服务器压力和响应时间
2. SEO 优化
- 搜索引擎可以直接抓取静态 HTML 内容
- 更好的 SEO 表现(相比于纯客户端渲染)
3. 部署简单
- 生成的文件可以部署到任何静态主机:
- Netlify、Vercel、GitHub Pages
- AWS S3、Firebase Hosting
- Nginx、Apache 等传统服务器
4. 成本效益
- 无需专门的 Node.js 服务器
- 可以使用廉价的静态托管服务
使用场景
适合使用 nuxt generate:
✅ 内容型网站:博客、文档、营销页面
✅ 数据不频繁变化:产品展示页、公司官网
✅ 需要优秀 SEO 的应用
✅ 高访问量 的只读页面
不适合使用(需要考虑 SSR 或 CSR):
❌ 用户个性化内容:每个用户看到的内容不同
❌ 实时数据:股票行情、聊天应用
❌ 频繁更新:社交媒体动态
❌ 需要身份验证 的页面(可通过混合模式解决)
基本使用
# 生成静态文件
nuxt generate
# 生成后预览
nuxt generate && nuxt start
# 构建并生成(常用)
npm run generate
# 在 package.json 中通常配置为:
# "scripts": {
# "generate": "nuxt generate"
# }
配置示例
// nuxt.config.js
export default {
target: 'static', // 明确指定为静态站点
generate: {
// 动态路由需要指定
routes: [
'/users/1',
'/users/2',
'/blog/post-1'
],
// 或者异步获取路由
async routes() {
const posts = await $fetch('/api/posts')
return posts.map(post => `/blog/${post.id}`)
}
}
}
工作流程
执行 nuxt generate
↓
Nuxt 启动构建过程
↓
为每个路由生成 HTML
↓
提取 CSS 和 JavaScript
↓
保存到 dist/ 目录
↓
完成!可以部署到任何静态主机
与 nuxt build 的区别
-
nuxt generate:生成静态 HTML 文件,用于静态托管 -
nuxt build:构建应用,用于服务器端渲染(SSR)部署
高级特性
1. 混合模式
// 部分页面静态生成,部分页面动态渲染
export default {
generate: {
exclude: [
'/dashboard', // 这个页面保持动态
'/admin/**' // 所有 admin 页面都动态
]
}
}
2. 增量静态再生
可以通过定时任务重新生成部分页面。
实际示例
# 1. 创建 Nuxt 项目
npx nuxi@latest init my-static-site
# 2. 安装依赖
cd my-static-site
npm install
# 3. 生成静态文件
npm run generate
# 4. 查看生成的文件
ls -la dist/
# 会看到 index.html, about.html 等
# 5. 本地测试生成的文件
npx serve dist/
总之,nuxt generate 是 Nuxt.js 强大的静态站点生成功能,特别适合需要优秀性能、SEO 和低成本部署的场景。对于适合静态化的项目,它能提供极佳的用户体验。
Nuxt state状态如何管理,3秒手把手帮你
用useState。有响应式和支持ssr共享。
useState是支持ssr的ref替代方案。其中,在后端渲染后(前端水合)会被保留,并通过唯一键在所有组件之间共享。
useState中的数据将序列化为JSON。
例子
基本用法
用组件本地的计算器状态。任何用useState('counter')的组件都共享相同的响应式状态。
// app.vue
<script setup lang="ts">
const counter = useState('counter', () => Math.round(Math.random() * 1000))
</script>
<template>
<div>
计算器:{{ counter }}
<button @click="counter++">
+
</button>
<button @click="counter--">
-
</button>
</div>
</template>
初始化状态
异步解析去初始化状态。
// app.vue
<script setup lang="ts">
const websiteConfig = useState('config')
await callOnce(async () => {
websiteConfig.value = await $fetch('https://my-cms.com/api/website-config')
})
</script>
与Pinia一起用
在Pinia 模块创建全局存储并在整个应用中使用它。
// stores/website.ts
export const useWebsiteStore = defineStore('websiteStore', {
state: () => ({
name: '',
description: ''
}),
actions: {
async fetch() {
const infos = await $fetch('https://api.nuxt.com/modules/pinia')
this.name = infos.name
this.description = infos.description
}
}
})
高级用法
// composables/locale.ts
export const useLocale = () => {
return useState('locale', () => useDefaultLocale().value)
}
export cosnt useDefautLocale = (fallback = 'en-US') => {
const locale = ref(fallback)
return locale
}
export const useLocales = () => {
const locale = useLocale()
const locales = ref([
'en-US',
'en-GB',
...
])
if (!locales.value.includes(locale.value)) {
locales.value.unshift(locale.value)
}
return locales
}
export const useLocaleDate = (date: Ref<Date> | Date, locale = useLocale()) => {
return computed(() => new Intl.DateTimeFormat(locale.value, {
dateStyle: 'full'
}).format(unref(date)))
}
// app.vue
<script setup lang="ts">
const locales = useLocales()
const locale = useLocale()
const date = useLocaleDate(new Date('2026-1-16'))
</script>
<template>
<div>
<h1>生日</h1>
<p>{{ date }}</p>
<label for="locale-chooser">语言</label>
<select id="locale-chooser" v-model="locale">
<option v-for="loc of locales" :key="loc" :value="loc">
{{ loc }}
</option>
</select>
</div>
</template>
共享状态
自动导入的组合式函数
// composables/states.ts
export const useColor = () => useState<string>('color', () => 'pink')
// app.vue
<script setup lang="ts">
const useColor = () => useState<string>('color', () => 'pink')
const color = useColor() // 与 useState('color')相同
</script>
<template>
<p>{{ color }}</p>
</template>
用库 - 第三方的
- Pinia
- Harlem
- XState