javascript - JS: protecting data from being accessible in console

Question

In a simple HTML page, I have some JS like below

<script>

   let users;

   axios.get(url)
   .then((resp) => {
      users = resp.users;
   }) 
    
   // other stuff
</script>

users is now accessible to access in console since it's on the window object. Would wrapping all that logic in an IFFE protect it from being accessible?

<script>

   (function() {
      let users;

      axios.get(url)
      .then((resp) => {
         users = resp.users;
      }) 
      // other stuff
   })();

</script>

Answer 1

Would wrapping all that logic in an IFFE protect it from being accessible?

Only very minimally. Or in modern environments you could add type="module" to the script so that code is executed as a module (the top level scope of modules isn't global scope).

But, this doesn't really do anything to protect the data. Anyone using your site can inspect the Network tab, or set a breakpoint inside your Axios callback, or use a network sniffer, or...

Any data you send the client is shared with the end user, if they want to see it. If you don't want them to see it, don't send it to them.