fix: 增强剪贴板粘贴的错误提示,说明HTTPS/localhost限制

This commit is contained in:
2026-04-27 18:40:36 +08:00
parent b981e30f46
commit 5433605fec

View File

@@ -979,31 +979,50 @@
// 从剪贴板粘贴图片 // 从剪贴板粘贴图片
async function pasteImageFromClipboard(type) { async function pasteImageFromClipboard(type) {
try { try {
// 检查剪贴板API是否可用需要HTTPS或localhost
if (!navigator.clipboard || !navigator.clipboard.read) {
alert('剪贴板API需要HTTPS或localhost环境。\n当前访问地址不支持请使用文件选择上传。\n\n可改用 localhost:19010 访问来支持粘贴功能。');
return;
}
const clipboardItems = await navigator.clipboard.read(); const clipboardItems = await navigator.clipboard.read();
let found = false;
for (const item of clipboardItems) { for (const item of clipboardItems) {
for (const type of item.types) { for (const itemType of item.types) {
if (type.startsWith('image/')) { if (itemType.startsWith('image/')) {
const blob = await item.getType(type); found = true;
const blob = await item.getType(itemType);
const reader = new FileReader(); const reader = new FileReader();
reader.onload = async (e) => { reader.onload = async (e) => {
const base64 = e.target.result; const base64 = e.target.result;
const res = await fetch('/api/upload/image/base64', { try {
method: 'POST', const res = await fetch('/api/upload/image/base64', {
headers: { 'Content-Type': 'application/json' }, method: 'POST',
body: JSON.stringify({ image: base64 }) headers: { 'Content-Type': 'application/json' },
}); body: JSON.stringify({ image: base64 })
const data = await res.json(); });
if (data.success) { const data = await res.json();
currentImages.push(data.url); if (data.success) {
updateImagePreview(); currentImages.push(data.url);
updateImagePreview();
}
} catch (err) {
alert('上传失败: ' + err.message);
} }
}; };
reader.readAsDataURL(blob); reader.readAsDataURL(blob);
} }
} }
} }
if (!found) {
alert('剪贴板中没有图片,请先复制一张图片');
}
} catch (e) { } catch (e) {
alert('无法从剪贴板获取图片,请使用文件选择'); if (e.name === 'NotAllowedError') {
alert('浏览器拒绝访问剪贴板。\n请使用文件选择上传或改用 localhost:19010 访问。');
} else {
alert('无法从剪贴板获取图片: ' + e.message + '\n请使用文件选择上传');
}
} }
} }
@@ -1221,31 +1240,50 @@
// 从剪贴板粘贴图片 // 从剪贴板粘贴图片
async function pasteSmartImageFromClipboard() { async function pasteSmartImageFromClipboard() {
try { try {
// 检查剪贴板API是否可用需要HTTPS或localhost
if (!navigator.clipboard || !navigator.clipboard.read) {
alert('剪贴板API需要HTTPS或localhost环境。\n当前访问地址不支持请使用文件选择上传。\n\n可改用 localhost:19010 访问来支持粘贴功能。');
return;
}
const clipboardItems = await navigator.clipboard.read(); const clipboardItems = await navigator.clipboard.read();
let found = false;
for (const item of clipboardItems) { for (const item of clipboardItems) {
for (const type of item.types) { for (const type of item.types) {
if (type.startsWith('image/')) { if (type.startsWith('image/')) {
found = true;
const blob = await item.getType(type); const blob = await item.getType(type);
const reader = new FileReader(); const reader = new FileReader();
reader.onload = async (e) => { reader.onload = async (e) => {
const base64 = e.target.result; const base64 = e.target.result;
const res = await fetch('/api/upload/image/base64', { try {
method: 'POST', const res = await fetch('/api/upload/image/base64', {
headers: { 'Content-Type': 'application/json' }, method: 'POST',
body: JSON.stringify({ image: base64 }) headers: { 'Content-Type': 'application/json' },
}); body: JSON.stringify({ image: base64 })
const data = await res.json(); });
if (data.success) { const data = await res.json();
smartAddImages.push(data.url); if (data.success) {
updateSmartImagePreview(); smartAddImages.push(data.url);
updateSmartImagePreview();
}
} catch (err) {
alert('上传失败: ' + err.message);
} }
}; };
reader.readAsDataURL(blob); reader.readAsDataURL(blob);
} }
} }
} }
if (!found) {
alert('剪贴板中没有图片,请先复制一张图片');
}
} catch (e) { } catch (e) {
alert('无法从剪贴板获取图片,请使用文件选择'); if (e.name === 'NotAllowedError') {
alert('浏览器拒绝访问剪贴板。\n请使用文件选择上传或改用 localhost:19010 访问。');
} else {
alert('无法从剪贴板获取图片: ' + e.message + '\n请使用文件选择上传');
}
} }
} }