豆包 AI API Key 获取与前端项目接入实战

随后在左侧进入 在线推理 查看详情，复制其中的 Endpoint ID。

最终你会获得两个核心信息：

1. API Key
2. Endpoint ID

前端接入代码示例

拿到这两个参数后，就可以在前端发起请求了。以下是一个基于 Vue3 和 Axios 的封装示例，可以直接参考使用。

// 豆包 AI 接口请求封装
const replyFromDoubaoAI = async (userText) => {
  try {
    const res = await axios.post(
      'https://ark.cn-beijing.volces.com/api/v3/chat/completions',
      {
        model: '你的 Endpoint ID',
        messages: [
          { role: 'user', content: userText },
        ],
      },
      {
        headers: {
          'Content-Type': 'application/json',
          'Authorization': 'Bearer 你的 API Key',
        },
      }
    );
    return res.data.choices[0].message.content;
  } catch (err) {
    return 'AI 服务暂时不可用';
  }
};

注意代码中的 model 字段填入的是 Endpoint ID，而不是模型名称；Authorization 头部必须携带 Bearer Token。

常见问题排查

1. 调用报错 401 通常是 API Key 错误、未复制全或模型未开通。检查密钥是否完整，确认模型已激活。

2. 报错 404 / Model not found Endpoint ID 不对，或者模型实例尚未完全运行。请刷新页面确认状态为'运行中'。

3. 免费额度能用多久？ 个人新用户一般足够开发与小型项目使用，具体以平台实时政策为准。

4. 可以直接前端调用吗？ 学习、演示可以；正式上线建议通过后端中转，避免 API Key 泄露到客户端。