这是否可能作为 Javascript 中的 XSS 漏洞利用

Question

I'm working through some legacy apps and curious whether this would be a viable XSS exploit?

code:

<div id="demo"></div>

<script>

document.getElementById("demo").innerHTML = '<script src="/me.js"></script>';
</script>

I don't think so but there's smarter people out there than me. Is there a variation of this?

Answer 1

This in itself is harmless:

document.getElementById("demo").innerHTML = '<script src="/me.js"></script>';

HTML5 specifies that a tag inserted with innerHTML should not execute. ¹

However (and since you're asking), there may be a remote chance (admittedly) that this could still be exploited:

 // This is the backdoor that an attacker has to inject somehow Object.defineProperty(Element.prototype, 'innerHTML', { set: function (value) { const script = document.createElement('script'); script.textContent = `alert('gotcha! ${value}')`; document.body.appendChild(script); } }); // This is what you're doing in your app document.getElementById("demo").innerHTML = '<script src="/me.js"><\\/script>';

 <div id="demo"></div>

As you can see it'd be easy to parse and extract the url and re-inject the script into the page.

---

Nowadays, using innerHTML is most likely going to be discouraged. Example:

Warning: If your project is one that will undergo any form of security review, using innerHTML most likely will result in your code being rejected. For example, if you use innerHTML in a browser extension and submit the extension to addons.mozilla.org, it will not pass the automated review process. ¹

React has an interesting way (IMHO) to discourage you from using it:

dangerouslySetInnerHTML is React's replacement for using innerHTML in the browser DOM. In general, setting HTML from code is risky because it's easy to inadvertently expose your users to a cross-site scripting (XSS) attack. So, you can set HTML directly from React, but you have to type out dangerouslySetInnerHTML and pass an object with a __html key, to remind yourself that it's dangerous. ²

---

Finally, I think it's worth mentioning that both epascarello and E. Sundin have a valid point. We know that <script> won't load and/or execute when injected via innerHTML but it doesn't mean that you're safe:

 <div id="demo"></div> <script> document.querySelector('#demo').innerHTML = '<img src="x.gif" onerror="alert(42)">'; </script>

References

1. https://developer.mozilla.org/en-US/docs/Web/API/Element/innerHTML#Security_considerations
2. https://reactjs.org/docs/dom-elements.html#dangerouslysetinnerhtml