Hiding data javascript functions from malicious user

Question

Let's say I'm listing clients into a html page that come from the server side, and these clients can be deleted by a button I include in the code.

 @foreach ($clients as $client) <td>{!! client.name !!}</td><td><button type"button" onclick="delete({!! client.id!!})"> @endforeach 

My question is is it safe to do that? Should I hide this function?

And how to hide it? I thought I could write a jquery that refers to each of the clients listed, but for that I would have to create a javascript function for every single client.

 @foreach ($clients as $client) <td>{!! client.name !!}</td><td><button type"button" id="client{!! client.id !!}"> @endforeach 

and then:

<script type="text/javascript">
@foreach ($clients as $client) 
    $('#client{!! $client.id !!}').click(function(){ doStuff({!! $client.id !!}); });
@endforeach
</script>

Well, I think it is not a good solution because it still shows the client id in the button and I create many instances of the same code. My sense says there's must be another way, maybe a library for that. Does anyone have a little clue?

Thank you.

Obs.: I know I have to do validations in the server side, but this question is still important I think.

Answer 1

Hiding the function won't help.

If you provide an HTTP endpoint to delete users, then anybody can call it with any input they like.

Even if you managed to hide the JS, it would be trivial to use a browser's developer tools to watch the Network tab and see what URL was requested and what data was sent to it.

Thus attempts to conceal the code will have the primary effects of making it more likely to have bugs and being harder for you to debug.

Don't waste you time. Just write code you can maintain easily.

The only protection you can do is to authenticate the user making the request (username + password, OAuth, etc) and then make sure they are authorized to delete the user they are asking to delete before doing it … and you have to do that on the server.

Answer 2

Short answer: No, hiding the function is not secure.

You can use methods such as minifying which will change your code into something very difficult to read but there are tools that can undo this. However, as you say in your question, server-side validation is the only true way to prevent someone from discovering your function and calling it. Most client-side security measures are simply security through obscurity, and although it will fend off any average/unwitting attackers, it is far from 100%.

And, just to touch on: My question is is it safe to do that? Should I hide this function? My question is is it safe to do that? Should I hide this function?

I've mentioned how you can't really hide/stop your code from being run. But is it safe to have this code on the frontend? Well, no; It's never 100% safe to put any code out into the wild. But as long as your server is validating requests properly, and you're following best practices, you can get as close to 100% as is possible in this industry.

Answer 3

simply add style="display:none;" in the <button> or <td> tag. That should make it hidden, and this would make your code reusable.