I'm working on a pet project where I generate an HTML + vanilla javascript page. JS will make a POST request to the backend endpoint on some click event. I'm wondering if this is really a secure and real-world production scenario? The javascript code is visible through "inspect" from any browser, so I have doubts that this is really a valid way of doing this.
-
2That's literally how form posting works, so... yes and yes? If you need added security, look up how to add CSRF protection to your post handling. – Mike 'Pomax' Kamermans May 11 '22 at 21:39
-
If you want a route to be protected you need to add authentication. – Cesare Polonara May 11 '22 at 21:45
-
It's worth remembering that at some point, every library or other method of accomplishing this is making it happen in vanilla js and html, to the point it's technically the *only* valid way to (if you're using JS at all I mean). They're just added layers of functionality built on top, some of which make securing the request, etc far easier than self implementation. – TCooper May 11 '22 at 22:08
2 Answers
I believe the POST
request you are making supports HTTPS connection.
Since you are concerned about the code being available in the inspect element tab. You can use an authentication standard to verify that your request is made from a genuine logged in user. Such modern methods like JWT
are easy to implement.
Also, as mentioned in the comment you can add a CSRF token to validate that the request is generated from the same site.
You could also add up rate limiting headers to limit the number of simultaneous requests for a period of time.
And since there is an issue with the developer console that can suspiciously check your requests, you can disallow it using this: Check if devtools are open, this works on latest chrome browsers and probably others too but still has some compatibility issues. or use this: library As soon as you get the trigger for devtools to be open, you can programatically take an action like blocking the page or refreshing it probably or even closing it.
There is no definite way to hide the network calls a client machine can make, since the ownership of hardware is advantageous to the client in this case. If not developer tools, the data can be sniffed from the network requests. There is no definite API to block the use of developer tools for the client.
An example of a website, that very peculiarly hides use of developer tools on their website is kissanime, they actually use this in recursion and call the debugger
statement to shift you to a non-functional script on the sources tab of the developer console whenever it gets and stays open till.

- 2,559
- 2
- 14
- 31
I would say this depends on two factors (assuming that HTTPS is a given)
- POST requests are usually linked to some sort of form scenario so that the user who is posting the data will know them anyway, with and without inspection.
- Is the server validating and filtering the data correctly? This is particulary relevant when they are processed in data-base or file operations where they could do real harm.

- 163
- 1
- 6