The most effective way to protect JavaScript client apps

Client technology, such as JavaScript, has many useful features. Because of this, it has become one of the most popular languages in the world. It has many advantages, and instant resolution is one of them. Instant resolution has many advantages, such as downloading code in a browser and executing it immediately. However, the higher the degree of freedom, the greater the responsibility. Client technology, such as JavaScript, has many useful features. Because of this, it has become one of the most popular languages in the world. It has many advantages, and instant resolution is one of them. Instant resolution has many advantages, such as downloading code in a browser and executing it immediately. However, the higher the degree of freedom, the greater the responsibility.

We will go deep into JavaScript Security Risks in this article, but the scope is limited to browser-running front-end code. We will pay attention to some other types that will be generated in the future.

As you can imagine, the browser always needs to execute code. It first downloads the page and parses it. The browser has the ability to download and parse at the same time, so it will not wait until everything is downloaded. So what will happen when it encounters JavaScript?

JavaScript will block rendering, which is a huge advantage when it is executed. But this means that the browser will stop parsing until the JavaScript execution is complete. This feature gives the programming language great flexibility, it can open any number of code.

But the question is, what is the impact of this feature?

 Set Value   《script》   document.querySelector('button').addEventListener('click', setValue);     function setValue() {     var value = '2';     document.getElementById('hack-target').innerText = value;   }《script》

This code is used to bind HTML events. When you click a button, a callback is triggered.

For JavaScript on the client side, you can set a breakpoint at the place where the value is set. This breakpoint will be hit when the event is triggered. Var value = '2'; used to set the value and can be modified. The debugger pauses and allows page tampering. This feature is very useful, and when it happens, the browser will not mark it.

Since the debugger pauses the Execution Code, it also suspends the rendering. The debugger itself is one of the tools provided by the browser and can be used by anyone. This is Web Developer Tools ).

The application of this technology can be seen on the Code Pen. The following is about this feature:

This feature is very useful for debugging JavaScript, But how secure is it?

This feature allows attackers to change JavaScript at runtime. Attackers can temporarily execute the Code through a breakpoint, modify the DOM, and enter arbitrary JavaScript code on the console. This type of function can use client vulnerabilities to change data, support sessions, and use JavaScript to make any changes on the page.

For example, open the developer tool, enter the console page, and enter:

document.querySelector('button')         .addEventListener('click', function () {              alert('sacked');         });`

The next time this event is triggered, it will execute the modified JavaScript code.

Why JavaScript?

You might want to ask, where did all this come from? When Netscape launched JavaScript in 1995, the new language became the Web "glue language ".

After Netscape submitted the JavaScript standard to the Ecma International Organization, their version became the standard, known as ECMAScript. Since ECMAScript is a standard, any browser is required to support this standard, so that different browsers will not conflict with each other. That is to say, you can write a piece of code for Google Chrome, but it can also run in Opera, NetScape, Internet Explorer, and Microsoft Edge. JavaScript is created in a flexible environment and has the ability to let you do what you want. These Design Principles use JavaScript to naturally have a dynamic talent and make it a browser language.

These are history, but what is the relationship with JavaScript Security?

Client Security

To prevent malicious JavaScript code, it is best to add runtime protection. Runtime Application Self-Protection (RASP) protects the program when executing the client code. With the advent of Web flexibility and dynamic nature, attackers may launch attacks through the client JavaScript, and runtime security also becomes necessary.

RASP is the most effective client application protection method, which is summarized as follows:

Runtime program self-protection is a security technology that creates or links to an application or its runtime environment, controls application execution, detects and prevents real-time attacks.

Once JavaScript is executed in a browser, nothing is completely protected against it. RASP defends against high-altitude and code tampering attacks at runtime, including offline application modification attacks. A good RASP solution also protects its own code, so that attackers cannot tamper with the solution itself, or directly bypass it. These layers ensure the security of the open network.

If RASP is good, it will send a notification when attackers try to block the Code, so that the user can know and take action, such as canceling the user session.

Jscrambler provides an RASP solution to protect applications from runtime attacks. It defends itself against and detects tampering. Its self-defense capability activates protection for JavaScript applications. Jscrambler uses anti-debugging and anti-tampering technologies-a well-known concept of application protection-to clarify the reality and limitations of JavaScript. The anti-debugging function detects the use of debugging tools (such as DevTools and Firebug) and attempts to prevent reverse engineers from using it to debug applications. It contains some preset code traps that cause the debugger to stop working and cause stack growth, preventing users from exploring the control flow of the application. The anti-tampering function checks the code changes and responds. For example, if you add/delete a semicolon in a function protected by automatic defense, it will detect changes and then stop running the code. The combination of the two technologies and code obfuscation makes it difficult to tamper with applications.

Conclusion

To implement JavaScript Security, you must consider what will happen at runtime. It is essentially a Dynamic Language born for Web flexibility. It is a double-edged sword. You must pay attention to your responsibilities when using it.