0

In my site, there is a div that gets updated dynamically by my system.

Through Ajax, that div contents is retrieved and sent to my server.

This is done through

$("div").find("script").remove();



var data = $("div").html(); 
////ajax request

How can I prevent users from adding their own HTML via inspect element, I've done so through the script tags but not sure how secure that is.

Note, the custom html must be removed, not converted into html entities or url encoded or something

I don't think there's a 100% secure way, but is there a way to make it difficult at least for users to do so.

If users add custom html through inspect element, it shouldn't be removed. Only when the ajax request is made, any custom html should be removed

Osman
  • 303
  • 1
  • 3
  • 14
  • The solution is to not trust rendered HTML as a data source and instead use whatever source is populating that `div` in the first place... – esqew Feb 13 '21 at 17:14
  • @esqew Thanks, how would that work in practice though. The div is getting updated dynamically through Javascript. I'm not too sure how to implement that. – Osman Feb 13 '21 at 17:18
  • 1
    The data is being retrieved from *somewhere* to populate the `div` initially, just hook into that same data source instead of trusting content that’s already been sent to the client – esqew Feb 13 '21 at 17:20
  • @esqew There's a bunch of different functions that populate the div. It's not just done once initially, it happens throughout the page running. Also, the div typically ends up having like 50 elements inside on average – Osman Feb 13 '21 at 17:22
  • You can [remove Inspect Element](https://stackoverflow.com/questions/28690564/is-it-possible-to-remove-inspect-element) or store data in variable instead of html – Mohammad Feb 13 '21 at 17:33
  • @Mohammad I'd rather not do dodgy practices like that, just want to do as the question states, in Javascript. – Osman Feb 13 '21 at 17:34
  • I had faced a similar situation like you, but after a lot of research, I found that it is impossible to prevent the users from rendering the html. Even the answers provided in the link @mohammed provided will not work. The best you can do is to have some server-side tests. – AD-1 Feb 13 '21 at 18:20
  • @AD-1 Rendering the HTML is fine, it's just when it gets sent through the ajax request it should be removed – Osman Feb 13 '21 at 20:43

1 Answers1

-1

Mutatiion Observer can help to prevent changing html via dev-tools.

However in my opion is better to expect correct data on backend side instead of attempts do something extra on frontend which is oftenly untrusted zone.

Alex
  • 255
  • 2
  • 6