前端如何用安全沙箱防止XSS攻击?
最近在做一个富文本编辑器的功能,用户可以输入HTML内容,但我担心XSS问题。听说可以用沙箱隔离,比如把内容放到iframe里?我试过动态创建iframe然后写入内容,但样式全乱了,而且有些脚本还是能执行。
有没有更靠谱的方案?比如用<iframe sandbox>属性?或者像DOMPurify那样先清洗再渲染?我现在的代码大概是这样:
const iframe = document.createElement('iframe');
iframe.sandbox = 'allow-same-origin';
document.body.appendChild(iframe);
const doc = iframe.contentDocument;
doc.open();
doc.write(userInputHTML); // 这里可能包含恶意脚本
doc.close();
但测试发现如果userInputHTML里有<img src=x onerror=alert(1)>,还是会弹窗,这沙箱好像没起作用?到底该怎么正确实现安全沙箱?
沙箱属性容易漏掉危险脚本,清洗才是王道。累死人的安全问题啊。