I'm developing a simple post application using the React for a front-end and NodeJS MySQL for back-end. Considering the security I'm wondering where the user input sanitizing should take place - on the client side on the React form component level or rather on the server side in the NodeJS code after the user sends the data? I'm asking especially about the xss attacks , for example to prevent for posting a JS code as a post content/body.

CodePudding user response：

Don't sanitize on the client-side before the data is sent to the server - clients are free to run whatever JavaScript validation code they want (including none), and to POST to your server whatever they want.

A good approach is to sanitize as soon as safely possible. Doing this will result in your database will storing sanitized values, which means that security will not depend on also remembering to sanitize on the client whenever rendering something from the database. There wouldn't be any harm in also sanitizing on the client when rendering, though - it wouldn't add any noticeable overhead, and would provide an extra layer in case you had an endpoint that you mistakenly didn't sanitize before saving to the database.

CodePudding user response：

If you are letting React do the DOM manipulation itself rather than doing it by hand imperatively you don't have a lot to worry about. As long as you stay away from things like dangerouslySetInnerHTML or mutating the DOM by hand.

That being said, there are some things that you can adopt to make it even safer like using DOMPurify when you have no alternative to dangerouslySetInnerHTML.

You could also sanitize user generated content before persisting it to the database to not only prevent XSS but any sort of RCE if you know these values might be consumed by other programs and want to be defensive. But for XSS in React I wouldn't worry too much, It's only through the escape hatches in React that you would manage to get yourselve into an XSS issue.

Here is a good read on the topic https://www.stackhawk.com/blog/react-xss-guide-examples-and-prevention