From ed11371f7f98b0bf4a4212f4311bb39996fdd3be Mon Sep 17 00:00:00 2001
From: tuqin <tuqin@tuqin.cn>
Date: 星期二, 27 十月 2026 14:29:06 +0800
Subject: [PATCH] fix(环保门禁): 上传返回的 fileName 缺 /profile 前缀、url 拼错(IP后无斜杠),前端自己规范成 /profile/upload/... 相对路径
---
src/views/environmentAccess/components/PhotoCapture.vue | 71 ++++++++++++++++++++++++++++++++++-
1 files changed, 68 insertions(+), 3 deletions(-)
diff --git a/src/views/environmentAccess/components/PhotoCapture.vue b/src/views/environmentAccess/components/PhotoCapture.vue
index e42548f..7b3391a 100644
--- a/src/views/environmentAccess/components/PhotoCapture.vue
+++ b/src/views/environmentAccess/components/PhotoCapture.vue
@@ -50,6 +50,48 @@
emit("update:modelValue", "");
};
+/**
+ * 涓婁紶鍓嶅帇缂╁浘鐗囷細鎸夋渶澶у搴︾瓑姣旂缉鏀� + JPEG 璐ㄩ噺鍘嬬缉
+ * 鎵嬫満鍘熷浘 2-5MB 鈫� 閫氬父 200-500KB锛岄伩鍏嶈 nginx 鐨� client_max_body_size 鎷︽埅
+ */
+const compressImage = (file, maxWidth = 1280, quality = 0.75) =>
+ new Promise((resolve) => {
+ // 闈炲浘鐗囨垨鐜涓嶆敮鎸佹椂鐩存帴杩斿洖鍘熸枃浠�
+ if (!/^image\//.test(file.type) || typeof document === "undefined") {
+ resolve(file);
+ return;
+ }
+ const objectUrl = URL.createObjectURL(file);
+ const img = new Image();
+ img.onload = () => {
+ URL.revokeObjectURL(objectUrl);
+ let width = img.naturalWidth || img.width;
+ let height = img.naturalHeight || img.height;
+ if (!width || !height) {
+ resolve(file);
+ return;
+ }
+ if (width > maxWidth) {
+ height = Math.round((height * maxWidth) / width);
+ width = maxWidth;
+ }
+ const canvas = document.createElement("canvas");
+ canvas.width = width;
+ canvas.height = height;
+ canvas.getContext("2d").drawImage(img, 0, 0, width, height);
+ canvas.toBlob(
+ (blob) => resolve(blob || file),
+ "image/jpeg",
+ quality
+ );
+ };
+ img.onerror = () => {
+ URL.revokeObjectURL(objectUrl);
+ resolve(file);
+ };
+ img.src = objectUrl;
+ });
+
const onChange = async (e) => {
const file = e.target.files && e.target.files[0];
e.target.value = "";
@@ -64,8 +106,11 @@
}
loading.value = true;
try {
+ // 涓婁紶鍓嶅厛鍘嬬缉锛氭墜鏈哄師鍥鹃�氬父 2-5MB锛屽帇鍒� 1280px 瀹姐�佽川閲� 0.75 鍚庝竴鑸� 200-500KB
+ // 鏃㈢渷鎵嬫満娴侀噺锛屼篃閬垮厤琚� nginx 鐨� client_max_body_size 鎷︿綇
+ const compressed = await compressImage(file);
const fd = new FormData();
- fd.append("file", file);
+ fd.append("file", compressed, file.name || "photo.jpg");
const res = await axios.post(import.meta.env.VITE_APP_BASE_API + "/common/upload", fd, {
headers: {
Authorization: "Bearer " + getToken(),
@@ -74,13 +119,33 @@
});
const body = res && res.data;
if (body && body.code === 200) {
- emit("update:modelValue", body.url || body.fileName || "");
+ // 鍚庣杩斿洖鍊兼湁涓や釜鍧戯細
+ // fileName = "upload/2026/10/27/x.jpg"锛堢浉瀵� profile 鐩綍锛岀己 /profile 鍓嶇紑锛�
+ // url = "http://10.136.58.73upload/..."锛圛P 鍚庤繛鏂滄潬閮芥病鏈夛紝鏄潖鐨勶級
+ // 鎵�浠ヨ繖閲岀粺涓�瑙勮寖鎴� /profile/upload/... 褰㈠紡锛氱浉瀵硅矾寰勶紝鎵嬫満缁忕鍙h浆鍙戜篃鑳借闂�
+ let path = String(body.fileName || "").replace(/^\/+/, "");
+ if (path && !path.startsWith("profile/")) {
+ path = "profile/" + path;
+ }
+ path = path ? "/" + path : "";
+ emit("update:modelValue", path);
ElMessage.success("涓婁紶鎴愬姛");
} else {
ElMessage.error((body && body.msg) || "涓婁紶澶辫触");
}
} catch (err) {
- ElMessage.error("涓婁紶澶辫触锛岃妫�鏌ョ綉缁滃悗閲嶈瘯");
+ const status = err && err.response ? err.response.status : 0;
+ if (status === 413) {
+ ElMessage.error("鐓х墖澶ぇ锛屼笂浼犺鏈嶅姟鍣ㄦ嫆缁濓紝璇峰帇缂╁悗閲嶈瘯");
+ } else if (status === 401) {
+ ElMessage.error("鐧诲綍宸茶繃鏈燂紝璇烽噸鏂扮櫥褰曞悗鍐嶄笂浼�");
+ } else if (status === 415) {
+ ElMessage.error("鏂囦欢鏍煎紡涓嶆敮鎸侊紝璇烽�夋嫨鍥剧墖鏂囦欢");
+ } else if (status) {
+ ElMessage.error("涓婁紶澶辫触锛圚TTP " + status + "锛夛紝璇烽噸璇�");
+ } else {
+ ElMessage.error("涓婁紶澶辫触锛岃妫�鏌ョ綉缁滃悗閲嶈瘯");
+ }
} finally {
loading.value = false;
}
--
Gitblit v1.9.3