product/Nano-Banana-AI-Image-Editor
1
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

移除了生成详情中的下载按钮

Browse Source
This commit is contained in:
袁涛
2025-09-19 02:18:53 +08:00
parent 29a326ac7d
commit c5ee5dd2a3
5 changed files with 132 additions and 625 deletions
Download Patch File Download Diff File Expand all files Collapse all files

134
src/components/ImageCanvas.tsx
View File

@@ -318,14 +318,142 @@ export const ImageCanvas: React.FC = () => {
};
const handleDownload = () => {
if (canvasImage) {
if (canvasImage.startsWith('data:')) {
// 直接下载当前画布内容
const stage = stageRef.current;
if (stage) {
try {
// 使用Konva的toDataURL方法获取画布内容
const dataURL = stage.toDataURL();
// 创建下载链接
const link = document.createElement('a');
link.href = canvasImage;
link.href = dataURL;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
console.log('画布内容下载成功');
} catch (error) {
console.error('下载画布内容时出错:', error);
// 如果Konva下载失败，回退到下载原始图像
if (canvasImage) {
// 处理不同类型的URL
if (canvasImage.startsWith('data:')) {
// base64格式
const link = document.createElement('a');
link.href = canvasImage;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} else if (canvasImage.startsWith('blob:')) {
// Blob URL格式
fetch(canvasImage)
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 清理创建的URL
setTimeout(() => URL.revokeObjectURL(url), 100);
})
.catch(error => {
console.error('下载Blob图像时出错:', error);
});
} else {
// 普通URL格式
fetch(canvasImage)
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 清理创建的URL
setTimeout(() => URL.revokeObjectURL(url), 100);
})
.catch(error => {
console.error('下载图像时出错:', error);
// 如果fetch失败，尝试直接下载
const link = document.createElement('a');
link.href = canvasImage;
link.download = `nano-banana-${Date.now()}.png`;
link.target = '_blank';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
}
}
}
} else {
console.warn('Stage未初始化，无法下载画布内容');
// 回退到下载原始图像
if (canvasImage) {
// 处理不同类型的URL
if (canvasImage.startsWith('data:')) {
// base64格式
const link = document.createElement('a');
link.href = canvasImage;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
} else if (canvasImage.startsWith('blob:')) {
// Blob URL格式
fetch(canvasImage)
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 清理创建的URL
setTimeout(() => URL.revokeObjectURL(url), 100);
})
.catch(error => {
console.error('下载Blob图像时出错:', error);
});
} else {
// 普通URL格式
fetch(canvasImage)
.then(response => response.blob())
.then(blob => {
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = `nano-banana-${Date.now()}.png`;
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
// 清理创建的URL
setTimeout(() => URL.revokeObjectURL(url), 100);
})
.catch(error => {
console.error('下载图像时出错:', error);
// 如果fetch失败，尝试直接下载
const link = document.createElement('a');
link.href = canvasImage;
link.download = `nano-banana-${Date.now()}.png`;
link.target = '_blank';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
});
}
}
}
};