

网站上线啦！Claude Code开发AI图片编辑网站（三）

Chris说出海

2025-10-22

导读：用Claude Code开发上线AI图片编辑网站

大家好，我是千爸，90后奶爸，机械学院毕业的十年老码农，AI编程爱好者，专注AI编程和副业变现分享。立志让普通人也能学会AI编程，并通过AI编程开启人生的第二曲线。

千爸最近正在学习AI编程，正在开发一个AI图片编辑网站

这个AI图片编辑网站包含4大功能：图片压缩、抠图去背景、图片识别、AI生图

目前已经用Claude Code开发完了前3个功能，今天开发剩下的最后一个AI生图的功能

然后就可以购买域名并上线啦！

想想真激动呐！又一个网站，这才多久，以前简直不敢想～

好啦，接下去跟着我一起来开发AI生图功能吧

我全程使用的AI编程工具都是Claude Code

大家也可以跟着我的文章教程一起实操一下

Claude Code开发AI文生图功能

今天我们要开发网站的AI文生图功能，并且还要把网站上线

之前的功能可以看看前2天的文章，作为一个系列来看

AI文生图

AI文生图功能，我们还是和图片识别一样，用豆包的API

所以我们还是去火山引擎申请API

获取AI生图的API

火山引擎方舟：https://console.volcengine.com/

点击左侧菜单的【开通管理】--【视觉大模型】

然后选择Doubao-Seedream-4.0

然后我们点击右边的开通服务去开通即可

开通成功以后，如果之前没有API Key，需要先申请API Key

选择API Key管理菜单，然后创建API Key，有的话就不需要重新创建了

然后去【在线推理】菜单创建推理接入点

截图里可以看到我已经有一个推理节点了，是之前图片识别功能用的

现在要创建一个给AI生图用的节点

填写名称和描述后，点击【添加模型】，选择Doubao-Seedream-4.0

最后点击【创建并接入】就行了

节点创建好以后，我们接下去要拷贝示例代码

示例代码是给Claude Code用的，也就是接口文档了

以上，我们就准备好所有的东西了，接下去就可以让Claude Code干活了

Claude Code开发文生图功能

我们打开Claude Code插件

输入提示词：


  
   
    
   
   实现 AI 生图，功能如下：用户输入提示词调用火山引擎 API显示 API 响应结果请求格式：curl -X POST https://ark.cn-beijing.volces.com/api/v3/images/generations \  -H "Content-Type: application/json" \  -H "Authorization: Bearer $ARK_API_KEY" \  -d '{    "model": "你的Model ID",    "prompt": "星际穿越，黑洞，黑洞里冲出一辆快支离破碎的复古列车，抢视觉冲击力，电影大片，末日既视感，动感，对比色，oc 渲染，光线追踪，动态模糊，景深，超现实主义，深蓝，画面通过细腻的丰富的色彩层次塑造主体与场景，质感真实，暗黑风背景的光影效果营造出氛围，整体兼具艺术幻想感，夸张的广角透视效果，耀光，反射，极致的光影，强引力，吞噬"，    "sequential_image_generation": "disabled",    "response_format": "url",    "size": "2K",    "stream": false,    "watermark": true}'