0 
var str = '<script>alert(1)</script>';
var decoded = $("<div/>").html(str).text();


 //document.write(decoded); THIS WORKS, but I want to avoid using document.write

var para = document.createElement("script");
var node = document.createTextNode(decoded);
para.appendChild(node);
var element = document.getElementById("div1");
element.appendChild(para);

jsfiddle.net/1bz9mL7k/2

问题是由于存在 script 标签，这个 createElement 方法不起作用。关闭编码 str 中的脚本标记将导致语法错误（未捕获的 SyntaxError：意外标记 '<'）。Document.write 完美无缺，但由于解析器块等的缺点，我想避免。

在实际用例中，编码字符串将是用户输入的一些广告。请注意，我们无法从他们输入的代码中删除脚本标签，而是使用 htmlentities($adcode) 将其保存在数据库中。

用户输入是可信的，因此不存在任何可能由所提出的解决方案发生的 xss 漏洞问题。

示例用户输入之一：

            <script async="async" src="someURL.js"></script>
            <script>
            var googletag = googletag || {};
            googletag.cmd = googletag.cmd || [];
            </script>
            <div id="xyzid">
            <script type="text/javascript">
            googletag.cmd.push(function() {
            googletag.pubads().display("Mobile_ATF_300x250", [300,250],"div-gpt-ad-0");
            });
            </script>
            </div>

可以有各种不同版本的广告集，其模式未知。

其他不太相关的信息：我们将进一步使用<script>if(var==1) { codeblock1 } else { codeblock2} </script>（这里的代码块是第一个代码块集）。因此，任何包含直接使用解码的用户输入的解决方案都不会有用，因为脚本块将在 if-else 中中断。

4

2 回答 2

0

因此，为了回答这个问题，我必须首先更改 ad2，因为它在脚本标签内，这不再是必要的，你可以做的是创建一个名为 Script 的元素，类型为 text/javascript 并插入文本，然后插入它进入身体。

var ad2 = `alert(12)`;
var decoded = decodeHtml(ad2);
decoded = decoded.replace(/(<([^>]+)>)/ig,'')
var para = document.createElement("script");
para.type = "text/javascript";
para.text = decoded
var element = document.getElementById("div12")
element.appendChild(para)

这是 jsfiddle 中关于如何做的工作演示。

https://jsfiddle.net/59g24do1/

编辑 对于多个脚本，请改用它；我们在这里所做的是首先我们创建一个标签数组，然后我们使用前面的函数一个一个地创建，执行一个 for 循环以执行它们。=>

function getParagraphs(htmlString) {
  const div = document.createElement("div");
  div.insertAdjacentHTML("beforeend", htmlString);
  
  return Array.from(div.querySelectorAll("script"))                 
              .map(script => script.outerHTML);
}


for(let i = 0;i<decoded.length;i++){
  if(decoded[i].includes("src")){   
            let srcString = decoded[i].match('src="(.*)"')
        var para = document.createElement("script");
        let aux = decoded[i].replace(/(<([^>]+)>)/ig,'')
        para.type = "text/javascript";
        para.src = srcString[1]
        para.text = aux
        var element = document.getElementById("div12")
        element.appendChild(para)
  }else{
        let aux = decoded[i].replace(/(<([^>]+)>)/ig,'')
        let para = document.createElement("script");
      para.type = "text/javascript";
      para.text = aux
      let element = document.getElementById("div12")
            element.appendChild(para)
  }
        
  }

完整的示例使用有一个 jsfiddle https://jsfiddle.net/f2Leu74g/2/

于 2020-06-30T15:33:02.837 回答
-1

我能够通过下面的代码解决它，如果将来有人遇到同样的问题，我想更新它。

var ad = "whatever encoded here script code";

function decodeHtml(html) {
            return $("<textarea/>").html(html).text();
        }

function fetch(id, html) {
  var elm = document.getElementById(id);  
  elm.innerHTML = html;  
  var scripts = elm.getElementsByTagName("script");
  var scriptsClone = [];
  for (var i = 0; i < scripts.length; i++) {
    scriptsClone.push(scripts[i]);
  }
  
for (var i = 0; i < scriptsClone.length; i++) {
    var currentScript = scriptsClone[i];
    var s = document.createElement("script");
    // Copy all the attributes from the original script
    for (var j = 0; j < currentScript.attributes.length; j++) {
      var a = currentScript.attributes[j];
      s.setAttribute(a.name, a.value);
    }
    s.appendChild(document.createTextNode(currentScript.innerHTML));
    currentScript.parentNode.replaceChild(s, currentScript);
  }
}

var decoded = decodeHtml(ad);
fetch('YourDivID',decoded);
于 2020-07-05T08:28:09.713 回答