fix: comprehensive security fix for Thumbnails component - only allow data:image/ URIs

- Restrict URL validation to only allow data:image/ URIs with proper base64 format
- Remove support for HTTP/HTTPS URLs as backend openImage() only supports data URIs
- Add regex validation for proper data URI format (data:image/[type];base64,)
- Eliminates both XSS and URL redirect vulnerabilities by design
- Maintains backward compatibility as codebase only uses data:image/ URIs
This commit is contained in:
Sannidhya Sah 2025-06-15 16:26:42 +05:30
parent d75f8649b1
commit 8796617d8d

View file

@ -37,20 +37,19 @@ const Thumbnails = ({ images, style, setImages, onHeightChange }: ThumbnailsProp
}
// Sanitize image URL to prevent XSS and malicious redirects
// Only allow data:image/ URLs since the backend openImage function only supports base64 data URIs
const sanitizeImageUrl = (url: string): string => {
try {
// Only allow data URLs (base64 images) and https URLs
// Only allow data URLs (base64 images) - backend only supports these
if (url.startsWith("data:image/")) {
return url
// Additional validation: ensure it's a proper data URI format
const dataUriRegex = /^data:image\/[a-zA-Z]+;base64,/
if (dataUriRegex.test(url)) {
return url
}
}
// For other URLs, validate they are safe
const parsedUrl = new URL(url)
if (parsedUrl.protocol === "https:" || parsedUrl.protocol === "http:") {
return url
}
// Reject any other protocols (javascript:, file:, etc.)
// Reject all other URLs (http, https, javascript, file, etc.)
return ""
} catch {
// Invalid URL, return empty string