软件工程第一次作业
| 这个作业属于哪个课程 | https://edu.cnblogs.com/campus/fzu/202601SofwareEngineering |
|---|---|
| 这个作业要求在哪里 | https://edu.cnblogs.com/campus/fzu/202601SofwareEngineering/homework/15712 |
| 这个作业的目标 | 创建hugging face和GitHub账号，熟悉API调用和markdown编写博客的流程，明确职业规划，为后续课程打下基础 |
| 学号 | 102401137 |
一·准备工作
github账号： https://github.com/ace7-Max ， 已完善头像、昵称和个人资料。
博客园：账号为Oribitix，已申请开通博客。
已关注吴越钟、张明圣、王奇蕊，加入博客园班级（202601 软件工程）
二，Hugging Face API 调用实验报告
1.注册 Hugging Face 账号并获取 API Token
1.1 访问 Hugging Face 官网注册账号
1.2 进入 Settings → Access Tokens → New token
1.3 选择 Fine-grained 类型，Presets 勾选 Inference
1.4 点击 Create token，复制保存生成的 Token
Token 创建成功截图：
2.项目代码实现
项目文件结构：
2. 项目代码实现
项目文件结构：
flux_project/
├── app.py
└── templates/
└── index.html
2.1 后端代码（app.py）
import os
from flask import Flask, request, render_template, jsonify
from huggingface_hub import InferenceClient
from PIL import Image
import io
import base64
app = Flask(__name__)
HF_TOKEN = "hf_你的Token"
client = InferenceClient(api_key=HF_TOKEN)
MODEL_ID = "XLabs-AI/flux-RealismLora"
@app.route('/')
def index():
return render_template('index.html')
@app.route('/generate', methods=['POST'])
def generate():
data = request.get_json()
prompt = data.get('prompt', '')
if not prompt:
return jsonify({'error': '请输入提示词'}), 400
try:
print(f"正在生成: {prompt}")
image = client.text_to_image(prompt=prompt, model=MODEL_ID)
buffered = io.BytesIO()
image.save(buffered, format="PNG")
img_str = base64.b64encode(buffered.getvalue()).decode("utf-8")
print("生成成功")
return jsonify({'image': img_str})
except Exception as e:
return jsonify({'error': str(e)}), 500
if __name__ == '__main__':
app.run(debug=True, host='0.0.0.0', port=5000)
2.2 前端代码（templates/index.html）
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Flux Realism 图像生成器</title>
<style>
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
background: #f5f5f5;
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
padding: 40px 20px;
}
.container {
background: #ffffff;
border-radius: 16px;
box-shadow: 0 4px 24px rgba(0,0,0,0.10);
padding: 40px 36px;
max-width: 560px;
width: 100%;
}
.container h1 {
font-size: 26px;
font-weight: 600;
margin-bottom: 8px;
color: #1f1f1f;
}
.container .sub {
color: #888;
font-size: 14px;
margin-bottom: 24px;
border-left: 4px solid #007bff;
padding-left: 12px;
}
textarea {
width: 100%;
height: 110px;
padding: 14px 16px;
font-size: 15px;
border: 1px solid #d0d7de;
border-radius: 10px;
resize: vertical;
font-family: inherit;
transition: border 0.2s;
background: #fafbfc;
}
textarea:focus {
border-color: #007bff;
outline: none;
background: #ffffff;
box-shadow: 0 0 0 3px rgba(0,123,255,0.15);
}
.btn {
width: 100%;
margin-top: 16px;
background: #007bff;
color: #fff;
border: none;
padding: 14px 0;
font-size: 17px;
font-weight: 500;
border-radius: 40px;
cursor: pointer;
transition: background 0.2s, transform 0.1s;
letter-spacing: 0.3px;
}
.btn:hover { background: #0056b3; }
.btn:active { transform: scale(0.97); }
#loading {
display: none;
margin-top: 20px;
text-align: center;
color: #555;
font-size: 15px;
}
#loading::before {
content: "⏳ ";
}
#result {
margin-top: 24px;
text-align: center;
min-height: 60px;
}
#result img {
max-width: 100%;
border-radius: 12px;
box-shadow: 0 4px 16px rgba(0,0,0,0.12);
border: 1px solid #e9ecef;
}
.error {
color: #d32f2f;
background: #ffebee;
padding: 12px 16px;
border-radius: 10px;
font-size: 14px;
}
.footer {
margin-top: 28px;
font-size: 13px;
color: #aaa;
text-align: center;
border-top: 1px solid #f0f0f0;
padding-top: 18px;
}
.footer a {
color: #007bff;
text-decoration: none;
}
</style>
</head>
<body>
<div class="container">
<h1>✨ Flux Realism</h1>
<div class="sub">输入提示词，生成照片级真实图像</div>
<textarea id="prompt" placeholder="描述你想要的画面，例如：A photorealistic cat sitting on a wooden table, soft natural light, blurred background, highly detailed">A photorealistic cat sitting on a wooden table, soft natural light, blurred background, highly detailed</textarea>
<button class="btn" onclick="generateImage()">生成图像</button>
<div id="loading">正在生成，请稍候...</div>
<div id="result"></div>
<div class="footer">Powered by Hugging Face · XLabs-AI/flux-RealismLora</div>
</div>
<script>
async function generateImage() {
const prompt = document.getElementById('prompt').value.trim();
const resultDiv = document.getElementById('result');
const loadingDiv = document.getElementById('loading');
if (!prompt) {
resultDiv.innerHTML = '<div class="error">请先输入描述文字。</div>';
return;
}
loadingDiv.style.display = 'block';
resultDiv.innerHTML = '';
try {
const response = await fetch('/generate', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ prompt: prompt })
});
const data = await response.json();
if (response.ok && data.image) {
resultDiv.innerHTML = '<img src="data:image/png;base64,' + data.image + '" alt="生成图片">';
} else {
resultDiv.innerHTML = '<div class="error">错误：' + (data.error || '生成失败') + '</div>';
}
} catch (err) {
resultDiv.innerHTML = '<div class="error">请求失败：' + err.message + '</div>';
} finally {
loadingDiv.style.display = 'none';
}
}
</script>
</body>
</html>
3. 运行项目
3.1 在 PyCharm 中打开 app.py，右键选择 Run
3.2 终端显示：Running on http://127.0.0.1:5000
3.3 浏览器访问 http://127.0.0.1:5000
3.4 输入提示词，点击生成图像
前端生成效果截图：
4、提示词设计思路与修改过程
以生成"最贴近真实世界的图像"为目标，提示词包含以下要素：
| 要素 | 描述 | 作用 |
|---|---|---|
| 主体 | cat（猫） | 明确视觉焦点 |
| 环境 | wooden table（木质桌面） | 增加场景真实感 |
| 光线 | soft natural light（柔和的自然光） | 模拟真实光照 |
| 摄影效果 | blurred background（背景虚化） | 模拟景深效果 |
| 画质要求 | photorealistic、highly detailed | 提升细节与真实度 |
修改过程如下：
| 版本 | 提示词 | 效果分析 |
|---|---|---|
| v1 | A cat | 画面简单，缺乏场景感 |
| v2 | A cat sitting on a table | 有场景但光影平淡 |
| v3 | A cat sitting on a wooden table, soft light | 光影改善，真实感提升 |
| v4 | A photorealistic cat sitting on a wooden table, soft natural light, blurred background, highly detailed | 画面逼真，符合照片效果 |
最终提示词：
A photorealistic cat sitting on a wooden table, soft natural light, blurred background, highly detailed
5、实验总结与心得
5.1 API 调用体验
Hugging Face 的 InferenceClient 封装简洁，仅需几行代码即可调用强大的文生图模型。免费版 API 响应时间约 5-20 秒，整体体验流畅。
5.2 技术收获
（1）掌握了 Flask 搭建轻量级后端的方法
（2）学习了前后端通过 Fetch API 异步交互
（3）理解了 base64 编码在图片传输中的应用
（4）体会到 LoRA 技术对模型风格的精准控制
5.3 提示词工程感悟
具体、结构化的提示词能显著提升生成质量。摄影术语的加入（如背景虚化、自然光）对真实感有直接帮助，提示词的精准度与生成效果呈正相关。
三，Github个人主页搭建
个人技术随笔
一、技能树与自我评估
- 已具备的专业知识与能力
- 掌握计算机专业基础课程：数据结构、算法、操作系统、计算机网络，能够独立完成课程习题与实验。
- 具备基础编码能力，会使用C/C++、Python、Java进行简单程序编写。
- 熟悉Git与GitHub基础操作，可以完成代码提交、版本管理，能够阅读简单开源项目代码。
-
感兴趣的技术方向
我对后端开发、机器学习与大模型应用比较感兴趣，希望了解软件系统如何搭建，以及AI技术如何落地解决实际问题。 -
欠缺的能力
- 缺少完整的实战项目经验，没有独立完整开发过软件项目。
- 对软件工程流程、项目规范、团队协作开发流程不熟悉。
- 工程实践能力薄弱，框架、工具链使用经验不足，代码质量有待提升。
二、代码量现状与目标
目前我的代码总量大概3000行左右，大多来源于课程作业、算法练习题，没有大型项目代码。
希望本学期结束之后，代码总量可以达到8000行，主要通过课程实验、算法刷题、小型实践练习进行积累。
三、本课程最期待学习的知识与收获
我最期待学习软件工程整套开发流程，包括需求分析、版本管理、项目规范、测试、团队协作开发等内容。
希望通过课程收获：学会规范化写代码，理解真实软件项目的开发模式，掌握Git团队协作，弥补自己工程实践方面的短板，具备完成小型软件项目的能力。
四、AI生成软件工程学习指南以及个人分析
使用DeepSeek生成的软件工程课程学习指南：
- 夯实理论基础：认真学习软件工程核心概念，理解需求分析、软件设计、软件测试、软件维护等生命周期各个环节，做好课堂笔记。
- 重视版本控制工具：熟练掌握Git、GitHub，掌握分支管理、冲突解决，养成提交代码写规范注释的习惯。
- 动手实践优先：不要只看书，结合课程实验，完整走完小型项目的全部开发流程，练习文档编写。
- 重视代码规范：学习编码规范，养成写注释、写文档的习惯，拒绝只实现功能忽略可读性。
- 学会团队协作：体验小组项目，练习分工、沟通、代码评审，模拟真实开发场景。
- 定期复盘总结：做完实验后复盘问题，把踩过的坑记录下来，持续改进自己的开发习惯。
个人分析：
这份指南整体比较合理。它兼顾理论和动手实践，强调Git工具、代码规范和团队协作，正好对应我目前欠缺的工程能力。
但AI给出的指南偏向通用，没有针对课程作业给出具体落地步骤。对我来说可以作为学习参考，但不能直接照搬，后续我需要结合课程实验，把里面的每一条落实到自己的练习中，以此弥补自己项目经验不足的短板。
浙公网安备 33010602011771号