feat(upload): v5.2终极方案-服务器端处理文件转换
This commit is contained in:
parent
db4ce203b9
commit
e37855dc7d
@ -1180,7 +1180,7 @@
|
||||
</div>
|
||||
|
||||
<!-- Scripts -->
|
||||
<script src="/static/js/main.js?v=5.1"></script>
|
||||
<script src="/static/js/main.js?v=5.2"></script>
|
||||
<script src="/static/js/trial-periods.js?v=1.3"></script>
|
||||
<script src="/static/js/trial-periods-page.js?v=1.6"></script>
|
||||
</body>
|
||||
|
||||
@ -61,7 +61,7 @@ function canDelete() {
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
console.log("CRM System Main JS v5.1 Loaded - " + new Date().toLocaleString());
|
||||
console.log("CRM System Main JS v5.2 Loaded - " + new Date().toLocaleString());
|
||||
// 登录守卫
|
||||
const token = localStorage.getItem("crmToken");
|
||||
if (!token && !window.location.pathname.endsWith("login.html")) {
|
||||
@ -3235,59 +3235,53 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
|
||||
const newBase64Images = [];
|
||||
|
||||
// Canvas-based conversion - most compatible method for restricted environments
|
||||
const fileToBase64Canvas = (file) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
// Create object URL from file
|
||||
const url = URL.createObjectURL(file);
|
||||
const img = new Image();
|
||||
|
||||
img.onload = () => {
|
||||
try {
|
||||
// Create canvas and draw image
|
||||
const canvas = document.createElement('canvas');
|
||||
canvas.width = img.width;
|
||||
canvas.height = img.height;
|
||||
|
||||
const ctx = canvas.getContext('2d');
|
||||
ctx.drawImage(img, 0, 0);
|
||||
|
||||
// Convert to base64
|
||||
const base64 = canvas.toDataURL(file.type || 'image/png');
|
||||
|
||||
// Clean up
|
||||
URL.revokeObjectURL(url);
|
||||
resolve(base64);
|
||||
} catch (error) {
|
||||
URL.revokeObjectURL(url);
|
||||
reject(error);
|
||||
}
|
||||
};
|
||||
|
||||
img.onerror = () => {
|
||||
URL.revokeObjectURL(url);
|
||||
reject(new Error('Failed to load image'));
|
||||
};
|
||||
|
||||
img.src = url;
|
||||
});
|
||||
};
|
||||
// Direct server upload - bypassing all client-side file reading
|
||||
const formData = new FormData();
|
||||
let validFileCount = 0;
|
||||
|
||||
for (const file of files) {
|
||||
if (!file.type.startsWith("image/")) {
|
||||
console.warn(`File is not an image: ${file.name}`);
|
||||
continue;
|
||||
}
|
||||
formData.append("screenshots", file);
|
||||
validFileCount++;
|
||||
}
|
||||
|
||||
try {
|
||||
console.log(`[v5.1-Canvas] Converting ${file.name} (${file.size} bytes)...`);
|
||||
const base64 = await fileToBase64Canvas(file);
|
||||
newBase64Images.push(base64);
|
||||
console.log(`✅ Successfully converted ${file.name} using Canvas method`);
|
||||
} catch (error) {
|
||||
console.error(`❌ Canvas method failed for ${file.name}:`, error);
|
||||
alert(`无法处理文件 "${file.name}"。\n\n可能的原因:\n1. 图片格式不受支持\n2. 图片文件损坏\n3. 浏览器内存不足\n\n建议:\n• 尝试使用较小的图片\n• 转换为标准格式(JPG/PNG)\n• 刷新页面后重试`);
|
||||
if (validFileCount === 0) {
|
||||
alert("请选择有效的图片文件");
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
console.log(`[v5.2-ServerUpload] Uploading ${validFileCount} file(s) to server...`);
|
||||
|
||||
// Use native fetch with manual Authorization header
|
||||
const token = localStorage.getItem("crmToken");
|
||||
const response = await fetch("/api/upload", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Authorization": `Bearer ${token}`
|
||||
},
|
||||
body: formData
|
||||
});
|
||||
|
||||
if (response.ok) {
|
||||
const result = await response.json();
|
||||
const uploadedImages = result.filePaths || [];
|
||||
console.log(`✅ Server successfully processed ${uploadedImages.length} image(s)`);
|
||||
|
||||
newBase64Images.push(...uploadedImages);
|
||||
} else {
|
||||
const errorText = await response.text();
|
||||
console.error("❌ Server upload failed:", errorText);
|
||||
alert(`图片上传失败(状态码: ${response.status})\n\n可能的原因:\n1. 图片文件过大(超过32MB)\n2. 服务器存储空间不足\n3. 网络连接不稳定\n\n建议:压缩图片后重试`);
|
||||
return;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error("❌ Upload request failed:", error);
|
||||
alert(`上传请求失败: ${error.message}\n\n请检查:\n1. 服务器是否正常运行\n2. 网络连接是否正常\n3. 是否已登录`);
|
||||
return;
|
||||
}
|
||||
|
||||
if (newBase64Images.length > 0) {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user