valknar/convert-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

debug: verify WebP blob data integrity and URL lifecycle

Browse Source
This commit is contained in:
Sebastian Krüger
2025-11-17 12:19:25 +01:00
parent edbb5d1388
commit 00c0522b85
2 changed files with 28 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/converter/ConversionPreview.tsx
View File

@@ -46,12 +46,17 @@ export function ConversionPreview({ job, onDownload }: ConversionPreviewProps) {
// Create preview URL for result // Create preview URL for result
React.useEffect(() => { React.useEffect(() => {
if (job.result && job.status === 'completed') { if (job.result && job.status === 'completed') {
console.log('[Preview] Creating object URL for blob');
const url = URL.createObjectURL(job.result); const url = URL.createObjectURL(job.result);
setPreviewUrl(url); setPreviewUrl(url);
console.log('[Preview] Object URL created:', url);
return () => { return () => {
console.log('[Preview] Revoking object URL:', url);
URL.revokeObjectURL(url); URL.revokeObjectURL(url);
}; };
} else {
setPreviewUrl(null);
} }
}, [job.result, job.status]); }, [job.result, job.status]);

23
lib/converters/imagemagickService.ts
View File

@@ -85,6 +85,10 @@ export async function convertWithImageMagick(
quality: options.imageQuality, quality: options.imageQuality,
}); });
// Verify the data looks like valid image data by checking magic bytes
const first4Bytes = Array.from(result.slice(0, 4)).map(b => b.toString(16).padStart(2, '0')).join(' ');
console.log('[ImageMagick] First 4 bytes:', first4Bytes);
// Create blob from result // Create blob from result
const mimeType = getMimeType(outputFormat); const mimeType = getMimeType(outputFormat);
const blob = new Blob([result as BlobPart], { type: mimeType }); const blob = new Blob([result as BlobPart], { type: mimeType });
@@ -94,6 +98,25 @@ export async function convertWithImageMagick(
type: blob.type, type: blob.type,
}); });
// Verify blob can be read
try {
const testReader = new FileReader();
const testPromise = new Promise((resolve) => {
testReader.onloadend = () => {
if (testReader.result instanceof ArrayBuffer) {
const testArr = new Uint8Array(testReader.result);
console.log('[ImageMagick] Blob verification - first 4 bytes:',
Array.from(testArr.slice(0, 4)).map(b => b.toString(16).padStart(2, '0')).join(' '));
}
resolve(true);
};
});
testReader.readAsArrayBuffer(blob.slice(0, 4));
await testPromise;
} catch (err) {
console.error('[ImageMagick] Blob verification failed:', err);
}
if (onProgress) onProgress(100); if (onProgress) onProgress(100);
const duration = Date.now() - startTime; const duration = Date.now() - startTime;