How to prevent user from executing js function in console

Question

Is there anything I can do to prevent users to run js function which is in file from console ? I have this getReward function here:

    function getReward(){

    $('.reward-button').remove();
    $('#rewardBtn').remove();

    document.getElementById("fightInfo").innerHTML = 

    '<strong>You</strong> won the fight.<br><strong>Reward:</strong><br>Gold: ' +gold+' <img src="/img/gold.png" style="margin-top: -1%"><br>EXP: '+exp+'<br>'
    +
    '<br>'
    +
    '<button style="font-size: 24px;" class="btn btn-danger" onclick="backToArena();">⚔️<br>Back To Arena</button>';

    socket.emit('win-fight', {
        gold: gold,
        exp: exp,
        username: userName,
        enemyname: enemyName
    });   

}

    function backToArena(){
        window.location.href = "/arena";
    }

The problem is that user can just type in console getReward(); and he automatically get's the reward because then socket works and it goes to server side from client side. Is there anyway to prevent this ?

UPDATE

 document.getElementById("rewardBtn").innerHTML = 
    '<button style="background-color: blue; font-size: 24px;" class="btn btn-primary" id="reward-button">Get reward 🏆</button>';

And then I do this:

document.querySelector('#reward-button').addEventListener('click', getReward);

But this doesn't run getReward function nothing happens no error.

I know this comment will not answer your question, but given your architecture and implementation, is it to implement the winning logic on the backend side. This way you could export the getReward() logic to a place where the user has no chanc of triggering the rewarding process. — SCO
– SCO, Commented Oct 12, 2018 at 6:58
Any and all client side code is insecure. You can intercept all JavaScript and run it in the console. You can even write your own code to run against the page. You can obscure the code but not make it impossible to execute in dev tools. Web Assembly might be an a possible option but i dare say any features implemented with it can can still be executed through JS so probably wont make any difference. (Not looked into web assembly enough yet.) — ste2425
– ste2425, Commented Oct 12, 2018 at 7:21
Even if you somehow manage to prevent console usage, users can still run js bookmarklets for the same effect — CoderMuffin
– CoderMuffin, Commented May 26, 2023 at 6:52

CertainPerformance · Accepted Answer · 2018-10-12 07:28:34Z

4

Simply wrap the whole script in an IIFE (Immediately Invoked Function Expression) so that getReward (and all your other functions) are not on the top level. Functions (and other variables) on the top level are automatically assigned to window, and are thus callable by simply typing the function name into the console. But, if a function is declared inside another function, the inner function won't be assigned to the global object.

(() => {
  function getReward(){

    $('.reward-button').remove();
    $('#rewardBtn').remove();

    document.getElementById("fightInfo").innerHTML = 

      '<strong>You</strong> won the fight.<br><strong>Reward:</strong><br>Gold: ' +gold+' <img src="/img/gold.png" style="margin-top: -1%"><br>EXP: '+exp+'<br>'
      +
      '<br>'
      +
      '<button style="font-size: 24px;" class="btn btn-danger" onclick="backToArena();">⚔️<br>Back To Arena</button>';

    socket.emit('win-fight', {
      gold: gold,
      exp: exp,
      username: userName,
      enemyname: enemyName
    });   

  }

  function backToArena(){
    window.location.href = "/arena";
  }
})();

Wrapping your scripts in an IIFE is useful not only for security (not good security, but better than open-console-and-type-function insecurity), but also for the sake of avoiding pollution of the global namespace, which is best avoided when possible.

edited Oct 12, 2018 at 7:28

answered Oct 12, 2018 at 6:55

CertainPerformance

373k55 gold badges354 silver badges359 bronze badges

Sign up to request clarification or add additional context in comments.

10 Comments

Quentin Over a year ago

That makes it slightly less trivial for the user, but it still isn't hard to cheat.

zlotte Over a year ago

Okay but now when I click the button for the reward it says that function getReward is not defined

CertainPerformance Over a year ago

@abraom_185 Sounds like you're using inline attribute handlers, which are not a good idea - assign the listener with Javascript instead, inside the IIFE.

zlotte Over a year ago

@CertainPerformance So it would be good idea to run this function inside $(button).on('click', function(){}); ?

CertainPerformance Over a year ago

@abraom_185 Sure, but there's no need to import a big library like jQuery just to attach a listener, you can use addEventListener, for example, document.querySelector('<yourbuttonselector>').addEventListener('click', getReward);

|

Mahesh Thorat · Accepted Answer · 2023-05-26 06:39:10Z

0

here is magic

"use strict";
!function() {
  function detectDevTool(allow) {
    if(isNaN(+allow)) allow = 100;
    var start = +new Date();
    debugger;
    var end = +new Date();
    if(isNaN(start) || isNaN(end) || end - start > allow) {
      consoleCheck();
    }
  }
  if(window.attachEvent)
  {
    if (document.readyState === "complete" || document.readyState === "interactive")
    {
      detectDevTool();
      window.attachEvent('onresize', detectDevTool);
      window.attachEvent('onmousemove', detectDevTool);
      window.attachEvent('onfocus', detectDevTool);
      window.attachEvent('onblur', detectDevTool);
    }
    else
    {
      setTimeout(argument.callee, 0);
    }
  }
  else
  {
    window.addEventListener('load', detectDevTool);
    window.addEventListener('resize', detectDevTool);
    window.addEventListener('mousemove', detectDevTool);
    window.addEventListener('focus', detectDevTool);
    window.addEventListener('blur', detectDevTool);
  }
}();

function consoleCheck()
{
  document.querySelector('body').innerHTML = 'We strongly support to not using console for extra actions!';
}

Just add this script in your project it will definitely stops inspecting.

edited May 26, 2023 at 6:39

answered Oct 21, 2021 at 5:55

Mahesh Thorat

1,7974 gold badges14 silver badges31 bronze badges

3 Comments

Community Over a year ago

Your answer could be improved with additional supporting information. Please edit to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers in the help center.

saf1 Over a year ago

if you have the console open before loading, you can still see the console and execute function.

Mahesh Thorat Over a year ago

Hello @saf1 you can try out above code hope this could helps you and other community.

Collectives™ on Stack Overflow

How to prevent user from executing js function in console

2 Answers 2

10 Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

10 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related