diff --git a/apps/web/src/components/common/uploader/AvatarUploader.tsx b/apps/web/src/components/common/uploader/AvatarUploader.tsx
index 6579947..7360f0a 100644
--- a/apps/web/src/components/common/uploader/AvatarUploader.tsx
+++ b/apps/web/src/components/common/uploader/AvatarUploader.tsx
@@ -35,6 +35,8 @@ const AvatarUploader: React.FC<AvatarUploaderProps> = ({
 	const [file, setFile] = useState<UploadingFile | null>(null);
 	const avatarRef = useRef<HTMLImageElement>(null);
 	const [previewUrl, setPreviewUrl] = useState<string>(value || "");
+
+	const [compressedUrl, setCompressedUrl] = useState<string>(value || "");
 	const [url, setUrl] = useState<string>(value || "");
 	const [uploading, setUploading] = useState(false);
 	const inputRef = useRef<HTMLInputElement>(null);
@@ -45,7 +47,9 @@ const AvatarUploader: React.FC<AvatarUploaderProps> = ({
 	const handleChange = async (event: React.ChangeEvent<HTMLInputElement>) => {
 		const selectedFile = event.target.files?.[0];
 		if (!selectedFile) return;
-
+		// Create an object URL for the selected file
+		const objectUrl = URL.createObjectURL(selectedFile);
+		setPreviewUrl(objectUrl);
 		setFile({
 			name: selectedFile.name,
 			progress: 0,
@@ -68,7 +72,7 @@ const AvatarUploader: React.FC<AvatarUploaderProps> = ({
 							compressedUrl: result.compressedUrl,
 						}));
 						setUrl(result.url);
-						setPreviewUrl(result.compressedUrl);
+						setCompressedUrl(result.compressedUrl);
 						// 直接使用 result 中的最新值
 						resolve(compressed ? result.compressedUrl : result.url);
 					},