Use of unsafe innerHTML
What does this mean ?
This function disallows unsafe coding practices that may result into security vulnerabilities. When a library function dynamically constructs HTML in a potentially unsafe way, that will cause for cross-site scripting attacks.
What can happen ?
The usage of innerHTML poses a security risk to your website. Malicious users can upload malicious client-side scripts that steal confidential user information contained in session cookies via cross-site scripting (XSS).
Recommendation
innerText is one such attribute that is deemed to be secure. Some publications or recommendations recommend it as an alternative to innerHTML for mitigating XSS in innerHTML. Code, on the other hand, can be run based on the tag to which innerText is attached.
Sample Code
Vulnerable :
function createMarkup() { return {__html: 'First · Second'}; };
<div dangerouslySetInnerHTML={createMarkup()} />
Non Vulnerable :
let markup = SomeApiCallToTrustedProvider(); //"<p>foo bar</p>"
return <div dangerouslySetInnerHTML={{__html: markup}} />;