1

So while working in my React based application, found one issue with HTML disabled attribute. So any one can go in developer console and remove this property which will enable the element. And further click action can be triggered(which causes interaction with API, etc).

How to prevent this?

  • 2
    You can't prevent this, anyone can edit the dom however they wish – mousetail Jun 08 '23 at 07:27
  • 1
    Sadly, frontend it is better to think browser is never 100% safe. You can check other answers listed here: https://stackoverflow.com/questions/49746832/what-is-the-standard-to-stop-browser-dev-tool-editing-to-bypass-disabled-element – Jhilton Jun 08 '23 at 07:33
  • Does this answer your question? [What is the standard to stop browser dev tool editing to bypass disabled elements?](https://stackoverflow.com/questions/49746832/what-is-the-standard-to-stop-browser-dev-tool-editing-to-bypass-disabled-element) – phuzi Jun 08 '23 at 10:50

1 Answers1

0

As you already mention that anyone with the knowledge of developer console can tweak the DOM you can also read about it here Preventing users to enter into developers tools and therefore you should not give the APIs to the user which are irrelevant.

If you still want a solution, then this will hugely depend upon the use case but you can use EJS if you're using Express and restrict the rendering of a particular block of HTML!

You can also apply some server side logic to preprocess the request and depending upon that you can give a proper response whichever necessary.

For example if a user is not authenticated to request a recourse, from the server you can have a server side logic for there authentication and response with a 401 status with a message that you're not authorized to do this action.