The script and img tags are dangerous, so they has been banned on this page. This page is secure!

HTML
CSS
JavaScript
<center>
<input type="text" id="input"/>
<div id="screen"></div>
</center>

document.querySelector('#input').addEventListener('keyup', function(e) {
  if (e.keyCode === 13) {
    let tagString = document.querySelector('#input').value;

    /* XSS filters */

    // disable script tag
    tagString = tagString.replace(/<script>/ig, '').replace(/<\/script>/g, '');
    // disable img tag
    tagString = tagString.replace(/<img /ig, '');

    const range = document.createRange();
    range.selectNode(document.getElementsByClassName('applet').item(0));
    const documentFragment = range.createContextualFragment(tagString);
    document.querySelector('#screen').appendChild(documentFragment);
  }
});
#input {
  font-size: 16px;
  height: 26px;
  width: 100%;
  margin-bottom: 10px;
  padding: 20px;
}
.applet-html {
  padding: 20px;
}
.applet {
  margin-bottom: 20px;
}

Takeaways and notes#

  • Are you sure?
  • Eg: <Img/SrC/onerror=alert(1)>
  • img + onerror event is not the only way to trigger XSS
  • How about a iframe?
  • Eg: <iframe onload=alert(1)>
  • Eg: <iframe/onload=alert(1)>
  • Eg: <iframe/onload=(alert)(1)>
  • Or an a?
  • Eg: <a onmouseover=alert(1)>FREE</a>
  • Event handlers from other elments can be used to trigger JavaScript
Tweet this | Share on LinkedIn |