Block SVG uploads for storefront logos/covers/product images.
Deploy Ladill Merchant / deploy (push) Successful in 24s

SVG can embed JavaScript and would run as stored XSS when served inline on a
public storefront page, and we have no SVG sanitizer. Allow only raster
formats:
- item_images validation: image rule (permits SVG) -> mimes:jpeg,jpg,png,gif,webp
- QrCodeManagerService: reject image/svg+xml / .svg(z) in brand-image and
  item-image storage (defense in depth, since those only checked the image/* prefix)
- file pickers: accept raster mimes only

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
isaacclad
2026-06-10 10:42:04 +00:00
co-authored by Claude Opus 4.8
parent 8b68fad82c
commit f48592077f
3 changed files with 25 additions and 13 deletions
@@ -64,7 +64,7 @@ class StorefrontController extends Controller
'menu_cover' => ['nullable', 'image', 'mimes:jpeg,jpg,png,gif,webp', 'max:8192'],
'item_images' => ['nullable', 'array'],
'item_images.*' => ['array'],
'item_images.*.*' => ['image', 'max:4096'],
'item_images.*.*' => ['mimes:jpeg,jpg,png,gif,webp', 'max:4096'],
]);
$data = array_merge($request->all(), [
@@ -103,7 +103,7 @@ class StorefrontController extends Controller
'menu_cover' => ['nullable', 'image', 'mimes:jpeg,jpg,png,gif,webp', 'max:8192'],
'item_images' => ['nullable', 'array'],
'item_images.*' => ['array'],
'item_images.*.*' => ['image', 'max:4096'],
'item_images.*.*' => ['mimes:jpeg,jpg,png,gif,webp', 'max:4096'],
]);
$data = array_merge($request->all(), [
+15 -3
View File
@@ -330,7 +330,7 @@ class QrCodeManagerService
continue;
}
$mime = $file->getMimeType() ?: '';
if (! str_starts_with($mime, 'image/')) {
if (! str_starts_with($mime, 'image/') || $this->isSvgUpload($file)) {
continue;
}
$subdir = $type === QrCode::TYPE_SHOP ? 'shop-items' : 'menu-items';
@@ -472,11 +472,23 @@ class QrCodeManagerService
return ['path' => $path, 'type' => $type, 'size' => (int) $file->getSize()];
}
/**
* SVG is rejected for customer uploads: it can embed JavaScript and would
* execute as stored XSS when served inline on a public storefront page.
*/
private function isSvgUpload(UploadedFile $file): bool
{
$mime = strtolower($file->getMimeType() ?: '');
$ext = strtolower($file->getClientOriginalExtension() ?: '');
return $mime === 'image/svg+xml' || $mime === 'image/svg' || $ext === 'svg' || $ext === 'svgz';
}
private function storeMenuBrandImage(User $user, UploadedFile $file, string $subdir): string
{
$mime = $file->getMimeType() ?: '';
if (! str_starts_with($mime, 'image/')) {
throw new RuntimeException('Only image files are supported.');
if (! str_starts_with($mime, 'image/') || $this->isSvgUpload($file)) {
throw new RuntimeException('Logos and images must be PNG, JPG, GIF or WebP (SVG is not allowed).');
}
$ext = $file->getClientOriginalExtension() ?: 'jpg';
@@ -92,11 +92,11 @@
<div class="grid gap-4 sm:grid-cols-2">
<div>
<label class="block text-xs font-semibold text-slate-600">Logo (optional)</label>
<input type="file" name="menu_logo" accept="image/*" class="mt-1.5 block w-full rounded-xl border border-slate-200 bg-white px-3.5 py-2.5 text-sm">
<input type="file" name="menu_logo" accept="image/png,image/jpeg,image/gif,image/webp" class="mt-1.5 block w-full rounded-xl border border-slate-200 bg-white px-3.5 py-2.5 text-sm">
</div>
<div>
<label class="block text-xs font-semibold text-slate-600">Cover image (optional)</label>
<input type="file" name="menu_cover" accept="image/*" class="mt-1.5 block w-full rounded-xl border border-slate-200 bg-white px-3.5 py-2.5 text-sm">
<input type="file" name="menu_cover" accept="image/png,image/jpeg,image/gif,image/webp" class="mt-1.5 block w-full rounded-xl border border-slate-200 bg-white px-3.5 py-2.5 text-sm">
</div>
</div>
</div>
@@ -116,12 +116,12 @@
<div class="grid gap-3 sm:grid-cols-3">
<div>
<label class="block text-[11px] font-medium text-slate-500">Logo</label>
<input type="file" name="menu_logo" accept="image/*"
<input type="file" name="menu_logo" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-indigo-50 file:px-2 file:py-1 file:text-xs file:font-semibold file:text-indigo-700">
</div>
<div>
<label class="block text-[11px] font-medium text-slate-500">Cover Image</label>
<input type="file" name="menu_cover" accept="image/*"
<input type="file" name="menu_cover" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-indigo-50 file:px-2 file:py-1 file:text-xs file:font-semibold file:text-indigo-700">
<x-qr.cover-image-hint />
</div>
@@ -166,7 +166,7 @@
class="mt-2 w-full rounded-lg border border-slate-200 px-3 py-2 text-sm">
<div class="mt-2">
<label class="block text-[11px] font-medium text-slate-500">Photo (optional)</label>
<input type="file" :name="'item_images[' + sIdx + '][' + iIdx + ']'" accept="image/*"
<input type="file" :name="'item_images[' + sIdx + '][' + iIdx + ']'" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-slate-100 file:px-2 file:py-1 file:text-xs file:font-medium file:text-slate-600">
</div>
</div>
@@ -199,12 +199,12 @@
<div class="grid gap-3 sm:grid-cols-3">
<div>
<label class="block text-[11px] font-medium text-slate-500">Logo</label>
<input type="file" name="menu_logo" accept="image/*"
<input type="file" name="menu_logo" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-indigo-50 file:px-2 file:py-1 file:text-xs file:font-semibold file:text-indigo-700">
</div>
<div>
<label class="block text-[11px] font-medium text-slate-500">Cover Image</label>
<input type="file" name="menu_cover" accept="image/*"
<input type="file" name="menu_cover" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-indigo-50 file:px-2 file:py-1 file:text-xs file:font-semibold file:text-indigo-700">
<x-qr.cover-image-hint />
</div>
@@ -256,7 +256,7 @@
class="mt-2 w-full rounded-lg border border-slate-200 px-3 py-2 text-sm">
<div class="mt-2">
<label class="block text-[11px] font-medium text-slate-500">Product photo (optional)</label>
<input type="file" :name="'item_images[' + sIdx + '][' + iIdx + ']'" accept="image/*"
<input type="file" :name="'item_images[' + sIdx + '][' + iIdx + ']'" accept="image/png,image/jpeg,image/gif,image/webp"
class="mt-1 block w-full text-xs text-slate-600 file:mr-2 file:rounded-lg file:border-0 file:bg-slate-100 file:px-2 file:py-1 file:text-xs file:font-medium file:text-slate-600">
</div>
</div>