fix(web): 媒体库图片不显示 — 添加 /uploads Vite 代理 + 修复路径前缀
前端图片 URL 使用 ./uploads/... 相对路径导致 404: 1. Vite 添加 /uploads 代理到后端 3000 端口 2. MediaLibrary 和 MediaPicker 图片 src 去掉 ./ 前缀
This commit is contained in:
@@ -59,7 +59,8 @@ export default function MediaPicker({ open, onClose, onSelect, accept = 'image/*
|
||||
|
||||
const handleSelect = (item: MediaItem) => {
|
||||
const token = localStorage.getItem('access_token');
|
||||
const url = token ? `${item.storage_path}?token=${token}` : item.storage_path;
|
||||
const rawPath = (item.storage_path || '').replace(/^\.\//, '/');
|
||||
const url = token ? `${rawPath}?token=${token}` : rawPath;
|
||||
onSelect(url, item);
|
||||
onClose();
|
||||
};
|
||||
@@ -138,7 +139,7 @@ export default function MediaPicker({ open, onClose, onSelect, accept = 'image/*
|
||||
<Image
|
||||
src={(() => {
|
||||
const token = localStorage.getItem('access_token');
|
||||
const base = item.thumbnail_path || item.storage_path;
|
||||
const base = (item.thumbnail_path || item.storage_path || '').replace(/^\.\//, '/');
|
||||
return token ? `${base}?token=${token}` : base;
|
||||
})()}
|
||||
alt={item.alt_text || item.filename}
|
||||
|
||||
@@ -158,7 +158,7 @@ export default function MediaLibrary() {
|
||||
cover={
|
||||
<div onClick={() => toggleSelect(item.id)} style={{ height: 140, display: 'flex', alignItems: 'center', justifyContent: 'center', background: 'var(--ant-color-fill-quaternary, #f5f5f5)', overflow: 'hidden', position: 'relative', cursor: 'pointer' }}>
|
||||
{isImage(item.content_type) ? (
|
||||
<img src={item.thumbnail_path || item.storage_path} alt={item.alt_text || item.filename} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
|
||||
<img src={(item.thumbnail_path || item.storage_path).replace(/^\.\//, '/')} alt={item.alt_text || item.filename} style={{ width: '100%', height: '100%', objectFit: 'cover' }} />
|
||||
) : (
|
||||
<InboxOutlined style={{ fontSize: 36, color: 'var(--ant-color-text-quaternary)' }} />
|
||||
)}
|
||||
|
||||
@@ -11,6 +11,10 @@ export default defineConfig({
|
||||
target: "http://localhost:3000",
|
||||
changeOrigin: true,
|
||||
},
|
||||
"/uploads": {
|
||||
target: "http://localhost:3000",
|
||||
changeOrigin: true,
|
||||
},
|
||||
"/ws": {
|
||||
target: "ws://localhost:3000",
|
||||
ws: true,
|
||||
|
||||
Reference in New Issue
Block a user