React.js 中的安全问题

Question

I am building my first application on React.JS and I am wondering how to implement simple security in on the client-side because there are some vulnerabilities that I see such as if you view page source the script tags show you all the Components that you made with all the functioning and rendered pages, Also if there is a basic method to stop XSS from happening that I can build on I would like to see that as well.

I am concerned about how anyone can view a page source on react and see the components from the script tag

Answer 1

You're not going to be able to prevent people from looking at the code source on the browser, since the browser has to see it and render it. You can make it a little harder for people to get to the inspect element, but there is always a way to get to it.

As for XSS, all you can do on the client side is validating input and sanitizing, but you can get around that via watching the network traffic and submitting bad data directly through your own http requests.

Client side is just that, served to the client.

Answer 2

What do you mean by sources? It's still a JavaScript and everybody can see the sources, but they will be uglified and minified by Webpack. Regarding XSS. Don't worry about it using React. Your code is already protected thanks to JSX. String variables in views are escaped automatically.

Answer 3

I suggest you to secure you're service in back-end, because anyone can request to the server trough Postman and can record and repeat your request in BurpSuite; then use security solutions in your back-end code after that use Object Schema validator in your React app to prevent users XSS attacks.