cloverta/cellpose-web
1
0
Fork 0
mirror of https://github.com/ClovertaTheTrilobita/cellpose-web.git synced 2026-04-01 23:14:50 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feature(preview): 增加下载

Browse source 
fix(flask): 修改后端借口
This commit is contained in:
ClovertaTheTrilobita 2025-09-18 00:12:10 +03:00
parent 0867b97453
commit 6f81e0d07a
2 changed files with 52 additions and 39 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
backend/flaskApp.py
View file

@ -37,8 +37,9 @@ def index():
def test_download(): def test_download():
return send_from_directory("test_output/2025-09-16-20-03-51", "img_overlay.png", as_attachment=True) return send_from_directory("test_output/2025-09-16-20-03-51", "img_overlay.png", as_attachment=True)
@app.get("/dl/<timestamp>") @app.get("/dl")
def download(timestamp): def download():
timestamp = request.args.get("id")
input_dir = os.path.join(BASE_DIR, "output", timestamp) input_dir = os.path.join(BASE_DIR, "output", timestamp)
output_dir = os.path.join(BASE_DIR, "output/tmp", timestamp) # 不要加 .zip，make_archive 会自动加 output_dir = os.path.join(BASE_DIR, "output/tmp", timestamp) # 不要加 .zip，make_archive 会自动加
os.makedirs(BASE_DIR / "output/tmp", exist_ok=True) # 确保 tmp 存在 os.makedirs(BASE_DIR / "output/tmp", exist_ok=True) # 确保 tmp 存在

82
frontend/preview.html
View file

@ -1,50 +1,62 @@
<!DOCTYPE html> <!DOCTYPE html>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<h1>This is preview</h1> <h1>运行结果预览</h1>
<p id="none-exist" hidden></p> <p id="none-exist" hidden></p>
<div id="gallery"></div> <div id="gallery"></div>
<button onclick="downloadTif()">下载tif</button>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script type="module"> <script type="module">
const API_BASE = "http://10.147.18.141:5000/status"; const API_BASE = "http://10.147.18.141:5000/";
const API_PIC = "http://10.147.18.141:5000/preview" const API_STATUS = API_BASE + "status";
const params = new URLSearchParams(window.location.search); const API_PIC = API_BASE + "preview";
const ID = params.get("id"); const API_DL = API_BASE + "dl";
const params = new URLSearchParams(window.location.search);
const ID = params.get("id");
const msg = document.getElementById("none-exist"); const msg = document.getElementById("none-exist");
if (!ID) { if (!ID) {
msg.textContent = "missing id in URL"; msg.textContent = "missing id in URL";
msg.hidden = false; msg.hidden = false;
} else { } else {
try { try {
const res = await axios.get(API_BASE + "?id=" + encodeURIComponent(ID)); const res = await axios.get(API_STATUS + "?id=" + encodeURIComponent(ID));
const { exists, status } = res.data; // exists: boolean, status: "running" | "success" | "failed"... const { exists, status } = res.data; // exists: boolean, status: "running" | "success" | "failed"...
if (!exists) { if (!exists) {
msg.textContent = `id "${ID}" 不存在`; msg.textContent = `id "${ID}" 不存在`;
msg.hidden = false;
} else {
msg.hidden = true;
axios.get(API_PIC + "?id=" + encodeURIComponent(ID)).then(res => {
if (res.data.ok) {
const gallery = document.getElementById("gallery");
res.data.images.forEach(img => {
const el = document.createElement("img");
el.src = "data:image/png;base64," + img.image;
el.alt = img.filename;
el.style.width = "200px"; // 缩略图大小
gallery.appendChild(el);
});
} else {
alert(res.data.error);
}
});
}
} catch (e) {
msg.textContent = "请求失败";
msg.hidden = false; msg.hidden = false;
} else { console.error(e);
msg.hidden = true;
axios.get(API_PIC + "?id=" + encodeURIComponent(ID)).then(res => {
if (res.data.ok) {
const gallery = document.getElementById("gallery");
res.data.images.forEach(img => {
const el = document.createElement("img");
el.src = "data:image/png;base64," + img.image;
el.alt = img.filename;
el.style.width = "200px"; // 缩略图大小
gallery.appendChild(el);
});
} else {
alert(res.data.error);
}
});
} }
} catch (e) {
msg.textContent = "请求失败";
msg.hidden = false;
console.error(e);
} }
}
window.downloadTif = function () {
const a = document.createElement("a");
a.href = API_DL + "?id=" + encodeURIComponent(ID);
a.download = ID; // 留空：文件名由服务端决定；可写具体名称
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
}
</script> </script>