We know that, in DOM-Based Attacks, the malicious code is client-side. To prevent this attack developers must be very careful with the type of code used in the browser.
To be more specific, these types of attacks happen when data from a user-controlled source (like user name or redirect URL taken from the URL fragment) reaches a sink, which is a function like
eval() or a property setter like
// Attribute: element.innerHTML = "<HTML> Tags and markup"; // Method: document.write("<HTML> Tags and markup");
Instead, one can replace these methods with an attribute like
// Will add as an actual HTML element. element.innerHTML = "<maliciousHTML>"; // Will render as text on the webpage. element.textContent = "<displaysAsText>";
Ideally, one could take a step further and avoid rendering user input, especially if it affects DOM elements such as the
Lastly, one should validate and sanitize all user input in order to prevent any data manipulation.
In our index.html file, we currently have a line of code within our
<script> tags to display the current Uniform Resource Identifier (URI):
document.write("<b>Current URL</b> : " + document.baseURI);
Note: A URL is a type of URI. The term URL is more specific and specifies details about which protocol to use while the term URI is more general.
<section> tags instead.
- The text
Current URL:should be enclosed in
- Follow that with a
<span>tag that has the
"contentholder". Make sure to leave the content in the
Now, set the
<span>‘s content equal to
- Use the
getElementByIdmethod to target the
- Once targeted, append the
textContentmethod to it.
- Next, make this element’s text content equal to
- Once completed, make sure to comment out the original