初窥软件开发：软件工程作业一

这个作业属于哪个课程	H202601软件工程与软件工程实践
这个作业要求在哪里	2026秋软件工程个人作业（第一次）
这个作业的目标	通过对huggingface-API的调用，感受交互式应用的过程；完成GitHub主页的搭建，明确自己的发展方向；发表第一篇博客，完成自我评估与目标。
学号	102401426

初窥软件开发：软件工程作业一(260904)

1. huggingface-API的调用

（1）结果展示

API调用成功的记录：

前端页面最终生成图像截图：

（2）提示词设计过程

因为使用的是国外模型，所以我的最终提示词翻译成了英语：

photorealistic street photography, early morning urban residential street, overcast soft diffused daylight, no harsh highlights, wet dark asphalt pavement with subtle water reflections, sidewalk with concrete texture, ordinary residential storefronts, sparse distant pedestrians wearing daily casual clothes, parked ordinary cars along curb, muted real‑world color palette, natural shadow, moderate depth of field, shot on Sony A7 IV, 50mm f1.8 lens, high material fidelity, no artistic exaggeration, no surreal elements, raw photo style

中文版如下：

写实街头摄影，清晨城市居民区街道，阴天柔和漫射日光，没有刺眼强光，湿润深色柏油路面带有淡淡的水反光，人行道是水泥质感，普通居民街边店铺，远处零星穿着日常便装的行人，路边停放普通家用汽车，贴近现实的低饱和度色彩，自然阴影，中等画面虚化，索尼A7 IV相机拍摄，50mm f1.8镜头，物体质感真实，不要艺术夸张，不要超现实怪异元素，相机直出原图风格

1.基础场景与光线：

写实街头摄影，清晨城市居民区街道，阴天柔和漫射日光，没有刺眼强光

规定图片类型、时间地点，控制整体光照氛围

2.环境物体细节

湿润深色柏油路面带有淡淡的水反光，人行道是水泥质感，普通居民街边店铺，远处零星穿着日常便装的行人，路边停放普通家用汽车

路面、店铺、行人和车辆，搭建街道完整画面内容

3.画面成像效果

贴近现实的低饱和度色彩，自然阴影，中等画面虚化，索尼 A7 IV 相机拍摄，50mm f1.8 镜头

控制颜色、阴影、虚化，模拟真实相机拍摄效果

4.约束与输出风格

 物体质感真实，不要艺术夸张，不要超现实怪异元素，相机直出原图风格

说明：禁止 AI 乱加特效，要求原图直出，拒绝过度美化

一开始我的提示词只包含前两项，结果输出的画面不够真实，最后在网络上搜索了提示词工程的一些规范，同时在AI的帮助下写出了合适的画面质感相关与约束相关的提示词

（3）API调用过程

0.环境准备

需预先安装好依赖库，并且在hugging face上获取HF_TOKEN

我是在pycharm上用conda装的虚拟环境

1.运行后端程序

在终端输入以下命令，启动后端程序

uvicorn main:app --reload

2.前端操作

本地浏览器直接打开html文件

输入提示词后点击生成图片，等待数秒即可生成最终图片

3.查看运行结果

查看后端日志即可观察到本次请求返回：

HTTP 200 OK

说明api调用正常

（4)关键代码

后端部分

from fastapi import FastAPI
import os
import requests
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()
# 跨域，允许本地html访问
app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_methods=["*"],
    allow_headers=["*"],
)

HF_TOKEN = os.environ.get("HF_TOKEN")
MODEL_URL = "https://router.huggingface.co/hf-inference/models/black-forest-labs/FLUX.1-dev"

@app.get("/generate")
def generate(prompt: str):
    headers = {"Authorization": f"Bearer {HF_TOKEN}"}
    payload = {"inputs": prompt}
    resp = requests.post(MODEL_URL, headers=headers, json=payload)
    img_bytes = resp.content
    # 返回图片二进制给前端
    return {"image_base64": base64.b64encode(img_bytes).decode()}

前端关键调用代码

async function generateImage(){
    const prompt = document.getElementById("promptInput").value;
    statusDom.innerText = "生成中，请稍候...";
    const res = await fetch(`http://127.0.0.1:8000/generate?prompt=${encodeURIComponent(prompt)}`);
    const data = await res.json();
    // 将base64渲染到页面图片框
    resultImg.src = "data:image/jpeg;base64," + data.image_base64;
    statusDom.innerText = "";
}