可编辑的 iframe 不允许 JavaScript 到运行

Question

我有一个 iframe：

<iframe id="msgContainer" sandbox="allow-same-origin"></iframe>

并且我想将 HTML 插入其中，但不要让 HTML 运行中可能包含的任何 JavaScript（这包括 <script> 标签和 on* 属性。我知道如何插入 HTML（只需使用 document.getElementById('msgContainer').contentDocument.body.innerHTML=myHTML 但我想防止 myHTML 中的任何 JS 来自运行ning。我尝试这样做的方法是使用 sandbox 属性并且只允许同源，但 JS 仍然运行s。有什么办法可以做到这一点吗？

谢谢

Answer 1

除了从插入 iframe 的 html 字符串中解析出 JS 之外，我找不到任何答案。这是我的代码（如果对其他人有帮助的话）：

/** Removes javascript from html string
 * html: the string to be cleaned
*/
function clean(html) {
    function stripHTML(){
        html = html.slice(0, strip) + html.slice(j);
        j = strip;
        strip = false;
    }

    var strip = false,
    lastQuote = false,
    tag = false;
    const prefix = "ANYTHING",
    sandbox = " sandbox=''";

    for(var i=0; i<html.length; i++){
        if(html[i] === "<" && html[i+1] && isValidTagChar(html[i+1])) {
            i++;
            tag = false;
            /* Enter element */
            for(var j=i; j<html.length; j++){
                if(!lastQuote && html[j] === ">"){
                    if(strip) {
                        stripHTML();
                    }
                    /* sandbox iframes */
                    if(tag === "iframe"){
                        var index = html.slice(i, j).toLowerCase().indexOf("sandbox");
                        if(index > 0) {
                            html = html.slice(0, i+index) + prefix + html.slice(i+index);
                            j += prefix.length;
                        }
                        html = html.slice(0, j) + sandbox + html.slice(j);
                        j += sandbox.length;
                    }
                    i = j;
                    break;
                }
                if(!tag && html[j] === " "){
                    tag = html.slice(i, j).toLowerCase();
                }
                if(lastQuote === html[j]){
                    lastQuote = false;
                    continue;
                }
                if(!lastQuote && html[j-1] === "=" && (html[j] === "'" || html[j] === '"')){
                    lastQuote = html[j];
                }
                /* Find on statements */
                if(!lastQuote && html[j-2] === " " && html[j-1] === "o" && html[j] === "n"){
                    strip = j-2;
                }
                if(strip && html[j] === " " && !lastQuote){
                    stripHTML();
                }
            }
        }
    }
    html = stripScripts(html);
    return html;
}

/** Returns whether or not the character is a valid first character in a tag
 * str: the first character
*/
function isValidTagChar(str) {
    return str.match(/[a-z?\\/!]/i);
}

/** Strips scripts from a string of html
 * html: the string of html to be stripped
*/
// NOTE: <script> tags won't run in this context
function stripScripts(html) {
    var div = document.createElement('div');
    div.innerHTML = html;
    var scripts = div.getElementsByTagName('script');
    var i = scripts.length;
    while (i--) {
      scripts[i].parentNode.removeChild(scripts[i]);
    }
    return div.innerHTML;
}

可编辑的 iframe 不允许 JavaScript 到 运行

Editable iframe without allowing JavaScript to run

javascript

iframe

sandbox

可编辑的 iframe 不允许 JavaScript 到运行