call to innerHTML contains a cross-site scripting (XSS)

Question

Getting cross site scripting (XSS) issue in javascript file in veracode scan report.

It seems the issue is with innerHtml?

{
    var b = document.createElement("div");
    b.innerHTML = g.responseText;

    for(var d=null,b=b.childNodes,e=0,h=b.length;e<h;++e)
    {
        var p=b[e];

);

Answer 1

In general, using innerHTML should be avoided unless you know exactly what you're doing.

I'm unfamiliar with Veracode, but I'd wager it's noticing that you're making a fetch request, then inserting data from the response directly into your page as code . It's sounding the alarm about this, as it should. Inserting XHR content directly as HTML is dangerous , as it could allow a malicious actor to execute code on your page in any of the following hypothetical scenarios:

• You don't control the endpoint you're querying.
  ^{Always assume that third-party data is malicious and act to secure your site accordingly.}
• You control the endpoint, but it becomes compromised.
  ^{Envision the worst-case scenario, where a hacker breaks in and modifies the data you send to the client.}
• The endpoint returns unsanitized user input.
  ^{A user could name themselves <script>alert(1);</script> and cause an alert to appear.}

In any of these cases, it's possible for someone to insert a script or other content into a response, which, because you're using innerHTML , will be executed as HTML in the context of the page. This is a textbook example of an XSS (cross-site scripting) vulnerability. Hackers can ( and very often do ) use exploits like this for malicious purposes, including stealing the passwords, session cookies, and payment information of your end users. You're being warned in your code because hackers could potentially do the same thing to you.

If you're returning HTML code from your endpoint, firstly, don't . Return the data you want to put inside the elements in JSON format, then construct the elements yourself on the client side using document.createElement and Node.textContent . This will ensure that the data you return isn't interpreted as HTML code.

If you're retrieving static, non-HTML data from the endpoint, then you don't even need a workaround-- just switch innerHTML to textContent and you'll be on your way.