以下是「 豆包 MarsCode 体验官」优秀文章，作者 July_lly。
前言
在字节跳动的积极推动下，Coze 平台的 API 接口现已对外开放，这一举措与豆包MarsCode 的高效支持相结合，极大地降低了开发门槛，使得单个开发者也能独立承担起大型项目的设计与实施。只要你具备一定的编程基础，就能轻松利用这些工具来实现个人的 AI 项目构想，极大赋能了个体创新与项目快速迭代的能力。
这里我使用图片来做一个头像生成插件：
先看看输出图：
coze 设计
coze 的设计其实根据你自己需求来，我们的 API 接口收到的是它的返回值，因此如果你需要复杂的功能，你完全可以设计复杂来 Bot 来输出你想要的数据。这里我为了教学随便设计了一个 bot，prompt 的设计如下：
插件调试一些数据的采集，让 Bot 只收集文字信息来生成图片。
因为这里我们只需要图片，限制输出就只需要图片 url 的地址即可，接受添加过多的数据在采集数据时反而更加麻烦。
测试没问题我们直接发布即可，但是一定需要选择 Bot as API 发布,不然你将调用不到这个接口了。
豆包 MarsCode 设计代码结构
为了贯彻我们摸鱼精神，不论多简单的代码我们能不敲就不敲，那么豆包MarsCode 就是我们最好的伙伴，它让我们在处理诸如构建 HTML 结构、发起 Axios 请求等常规任务时，能够减少手动编码的负担，通过智能化的操作大大提升了开发效率。这样一来，我们能将更多精力集中于创新和解决核心问题上，让编程工作变得更加流畅与高效。
html 结构设计
axios 请求设计
这里我们需要注意，它给的 axios 请求报文中的 url，还有请求头，请求体需要我们自己来按照文档的要求来配置，豆包MarsCode 本身并不具有文档阅读功能。
// 构建请求体const body = { bot_id: "7391404153693945907", user: "123456789",//随便配置这个位置 query: name.value||'天气宝宝', stream: false,//使用非流式};
// 配置axios请求const config = { method: 'post', url: url, headers: { 'Authorization': `Bearer ${ApiKey}`, 'Content-Type': 'application/json', 'Connection': 'keep-alive', 'Accept': '*/*' }, data: body};
function generate () { axios(config) .then(res => { img.value=JSON.parse(res.data.messages[1].content).data.image_url }) .catch(error => { console.error('请求失败：', error); });}
复制代码
让豆包 MarsCode 结合
全部代码
<template> <div> <h1>头像生成</h1> <input type="text" v-model="name" placeholder="请输入名称"> <button @click="generate">生成头像</button> <div v-if="img"> <img :src="img"></img> </div> </div></template>
<script setup>import {ref} from 'vue'import axios from 'axios'
let name = ref('')const img = ref('')
const ApiKey='Your APIKey'const url='https://api.coze.cn/open_api/v2/chat'
// 构建请求体const body = { bot_id: "7391404153693945907", user: "123456789", query: name.value||'天气宝宝',//给一个默认值为天气宝宝 stream: false,};
// 配置axios请求const config = { method: 'post', url: url, headers: { 'Authorization': `Bearer ${ApiKey}`, 'Content-Type': 'application/json', 'Connection': 'keep-alive', 'Accept': '*/*' }, data: body};
function generate () { axios(config) .then(res => { img.value=JSON.parse(res.data.messages[1].content).data.image_url }) .catch(error => { console.error('请求失败：', error); });}</script>
<style lang="css" scoped>
</style>
复制代码
总结
豆包MarsCode 会根据你当前的文件代码来生成代码，有时你只需要写好注释，豆包MarsCode 会自动将下面的代码完成只需要 tab 键按下，你的模块就完成这种体验不要太舒服，个人认为与GitHub Copilot Chat可以比较一下，而且它可以在写代码旁边为你实时提示就很舒服了。但是它不能阅读文档，而我们在工作配置接口时需要阅读文档的，所以这里还是可以继续改进一点。
欢迎点赞评论交流。
评论