fix #171: CSP-compliant image preview (data: URL instead of blob:) #186

Merged
fen merged 1 commits from fix-171 into dev 2026-09-10 16:42:15 +00:00
Showing only changes of commit f947415b23 - Show all commits
+15 -6
View File
@@ -254,16 +254,25 @@ function extOf(name) {
const IMAGE_RE = /^image\//; const IMAGE_RE = /^image\//;
let previewURL = null; let previewURL = null;
// #171: CSP img-src only allows 'self' and data:, so blob: URLs are
// blocked — read the file as a data: URL via FileReader instead.
function readFileDataURL(file, cb) {
const r = new FileReader();
r.onload = () => cb(r.result);
r.readAsDataURL(file);
}
async function showFileInEditor(file) { async function showFileInEditor(file) {
const wrap = document.querySelector('.editor-wrap'); const wrap = document.querySelector('.editor-wrap');
const img = $('file-preview'); const img = $('file-preview');
if (IMAGE_RE.test(file.type)) { if (IMAGE_RE.test(file.type)) {
if (previewURL) URL.revokeObjectURL(previewURL); readFileDataURL(file, (dataURL) => {
previewURL = URL.createObjectURL(file); previewURL = dataURL;
img.src = previewURL; img.src = dataURL;
img.alt = file.name; img.alt = file.name;
wrap.classList.add('previewing'); wrap.classList.add('previewing');
img.classList.remove('hidden'); img.classList.remove('hidden');
});
return; return;
} }
wrap.classList.remove('previewing'); wrap.classList.remove('previewing');