As the importance of JavaScript grows, so does the need to protect your intellectual property. In this tutorial we'll take a look at JScrambler, a tool you can use to protect your code from competitors and hackers.

What's JScrambler?

JScrambler is a cloud-based, enterprise solution for protecting your JavaScript code in applications destined for the desktop web, HTML5, mobile, Node.js apps, and web gaming.

While most JavaScript protection efforts rarely go beyond simple regular expression transformations, JScrambler is a JavaScript interpreter and parsing engine that creates an Abstract Syntax Tree representing your source code. Therefore, JScrambler can secure your HTML5 and JavaScript in a way that ensures the protected code executes with the same functionality as the source. 

JScrambler's approach requires thorough testing and advanced source code analysis in order to create precision optimizations that 1) run well under limited resources, 2) do not degrade performance, and 3) execute flawlessly in an environment guaranteed 100% compliant with all browsers and platforms. 

Adding JScrambler to your development process protects your intellectual property and prevents a number of problematic scenarios:

• competitors building on your code
• new competitors bootstrapping their work on your code
• clients unlocking premium features
• redistribution of your code on the Internet
• violations of license agreements
• unauthorized access of your code hosted in the cloud or shared hosting environments
• the proliferation of IP legal disputes

In this tutorial, I'll walk you through the benefits of protecting your code with JScrambler and introduce you to its services and the various options available to you. In addition to its cloud-based service, you can also integrate JScrambler into your development environment through its API. If you need additional performance and security, you can host its self-contained enterprise solution.

What Application Types Does JScrambler Support?

JScrambler works best with the following application environments:

• desktop web applications
• mobile web applications
• Node.js applications
• HTML5 applications
• web gaming applications

Benefits for Node.js

With the proliferation of Node.js, JavaScript can be used outside the context of a web browser, both on the server and client sides. It can also be built outside the browser and later be packed and executed inside the browser. This flexibility and elegance has surely contributed to its popularity. 

However, whether you’re working on a library distributed through NPM, a standalone client or a browser application—and like regular web applications developed using JavaScript—it is still sent or installed in clear-text in the end-user device. If are using shared or hosted servers, you may be worried to know that your code is stored in clear-text.

Obviously, JScrambler's code protections can be especially valuable to companies building their intellectual property extensively in Node.js.

What Benefits Does JScrambler Provide?

Enhanced Security

JScrambler enables you to conceal the logic of your application from potential attackers, such as what information is gathered from the user, how it is processed on the client-side, and how it is sent to the server-side. Its obfuscation introduces a certain level of randomness, which allows you to explore code morphing techniques; these can assist in precluding attack automation.

Protects Your Intellectual Property

JScrambler can conceal your client-side JavaScript algorithms from competitors who may try to analyze and steal it. But your development and production versions of your code don't have to be the same. You can test and debug your unprotected code and apply JScrambler to deploy protections exclusively in testing and production.

Enforce License Agreements

If you develop and sell JavaScript applications, be it standard JavaScript, mobile web applications or HTML5, you’ll want to prevent someone who didn’t pay or whose license has expired from executing your code. JScrambler allows you to lock your code to a predefined list of domains and set expiration dates. For example, you can now deliver expirable demos to your clients without incurring the fear of code or client-loss.

Performance Optimization

JScrambler provides optimization transformations that make your code smaller and faster to load. These transformations are designed specifically for your application type and performance requirements. For example, mobile web applications cannot undertake the same degree of obfuscation that a standard JavaScript application running on a desktop CPU can.

What Features Does JScrambler Provide?

JScrambler's approach allows your product to be protected while being easily and affordably maintained. Your development process can evolve naturally while integrating enterprise-level security and anti-debugging methods. Here are some of the features that JScrambler provides:

Flexible Development Process Integration

JScrambler can be used in several different ways. You can:

1. Use the cloud-based web service and apply protections at will.
2. Use its API services with a variety of client libraries to integrate them into your build and deployment scripts. See JScrambler Web API Documentation and API Client Downloads for more information.
3. Use its self-contained JScrambler virtual appliance within your own organization's network with its Enterprise solution.

Minification and Compression

JavaScript travels from server to client before being interpreted by the browser. Therefore, reducing its raw byte size improves load time, contributing to a faster response for your application. Moreover, if used with obfuscation techniques, size code reduction transformations both contribute to logic concealment and reduce the size of the code that might have grown due to the use of these transformations.

Optimization

JScrambler can provide optimization in terms of computational performance; of course, this technique in isolation does not provide any protection to the code.

Obfuscation

Source code obfuscation consists in the transformation of the source code to make it harder to understand, without changing its original functionality. JScrambler's technological approach secures your HTML5 and JavaScript in a way that ensures the protected code executes with the same functionality as the source.

Code Traps

JScrambler allows you to lock your JavaScript to a specific domain or list of domains, e.g. mywebsite.com. Your protected code will fail to work in other domains than the ones that you have chosen. You can also restrict code to a certain expiration date for expirable demos or licenses, or restrict it to certain browsers and operating systems.

Self-Defending Code

One of the main uses of code obfuscation is to protect the intellectual property of your software by concealing its logic, rather than just trying to enforce a software license and relying on legal solutions. Obfuscation used in conjunction with anti-debugging techniques helps defeat attempts at reverse engineering and code reuse, mostly because the code's maintainability and re-usability qualities are degraded for this purpose.

JScrambler provides self-defending capabilities for HTML5 and JavaScript applications. Your application can actively protect itself by detecting source code modification attempts and debugging activities, and breaking down intentionally to mitigate the attack. And all it takes to trigger this defense is a single character being changed.

Anti-debugging aims to thwart the process of reverse engineering and debugging. It's ideal to hinder (dynamic) code analysis, making any attempt to de-obfuscate more difficult.

Anti-tampering aims to thwart changes to your code by using (for instance) techniques that change the behavior of your code or break it if any tamper attempt is detected.

Here's a demonstration of JScrambler's anti-tampering.

Detailed Documentation

The JScrambler help center provides detailed descriptions of each of its features and transformations, e.g. Obfuscation and Optimization Approaches:

Localization for Six Languages

The JScrambler interface is currently available in six languages:

Pricing Plans

JScrambler provides a free plan which offers minification and optimization. Support for larger projects and broader environments begins at $35 per month when billed annually:

Getting Started With JScrambler

Signing up with JScrambler is easy:

Once you're registered, you'll be presented with the New Project screen. JScrambler will include a demonstration static web project.

With each new project, you can direct JScrambler to use one of its application modes:

Standard Mode: JScrambler's standard protection and optimization behavior. Enough for most JavaScript applications. Doesn't fully target HTML5 features or manage mobile performance.

Mobile Compatibility: Transformations are applied taking into account the limitations and needs of mobile devices.

HTML5 Compatibility: JScrambler protects and optimizes your HTML5 and Web Gaming applications by targeting the new HTML5 features.

Node.js Compatibility: JScrambler protects and optimizes your Node.js applications.

Then you must specify one or more protection and optimization templates; advanced plans can choose combinations. You can also set up templates for your project that choose specific transformation(s):

The interface provides helpful explanations for each option:

If you select specific transformations, you may be required to provide configuration settings. For example, providing a domain list for domain locking:

Once you've applied JScrambler's transformations, you'll be returned to the Projects menu. Here you can download your resulting code:

Here's a side-by-side comparison of the JavaScript code in my project before and after my transformations:

Of course, using JScrambler statically may not make sense for every development team. The JScrambler API provides options for continuous integration.

JScrambler Your Code With the API

With the API you'll be able to automate the deployment of all the files in your project by running a simple command.

The API offers a simple REST interface, which means that you only have to implement a few HTTP requests to use it. You can see examples at the JScrambler API documentation center. JScrambler provides client stubs for PHP, Java, Node.js, Atom, Grunt, Gulp, and Python. Visit the full list of Download Clients.

Easy Build Integration

Whether you build your application using a command line script or a task runner, it’s very easy to integrate JScrambler in your existing building process. 

JScrambler is already integrated in all major task runners, and if that does not work for you, there is a JScrambler API CLI executable that you can call from your scripts or your favorite IDE. 

Furthermore, the API allows you to integrate continuous JScrambler transformation into your development process. 

Here's an example of code you would use with PHP to upload code for JScrambler:

require_once 'jscrambler.php';

$accessKey = 'YOUR_ACCESS_KEY';
$secretKey = 'YOUR_SECRET_KEY';
$apiHostname = 'api.jscrambler.com';
$port = '443';

$jscrambler = new Jscrambler($accessKey, $secretKey, $apiHostname, $port);       
  
$response = $jscrambler->post('/code.json', array(
                      'files' => array('index.html', 'script.js'), 
                      'domain_lock' => 'jscrambler.com',
                      'expiration_date' => '2099/12/31'
                  ));

Here's an example of the JSON packet that JScrambler would return:

{   
    "id":"401c600215aab40ea4709a3a0075ef196000cdf0",
    "extension":"zip",
    "received_at":"2012-01-31 18:50:57",
    "sources":[
        {
            "id":"a3b85573d493d803537555f48a1a7ac9778ec19f",
            "extension":"html",
            "filename":"index.html",
            "size":125025
        },
        {
            "id":"091306a8d92c5f8ad61bbfd134367bf5961be436",
            "extension":"js",
            "filename":"script.js",
            "size":113235
        }
    ]
}

JScrambler Enterprise

If you work for a large company or one with high level security and intellectual property requirements, you may need more secure access to JScrambler's services.

JScrambler Enterprise is a virtual appliance that you download and run in your own infrastructure, which means that you never have to transmit any of your code. It also guarantees 100% availability and highest priority.

In Closing

JScrambler's an easy to use sophisticated product. Here's a brief recap of what we covered:

• JScrambler's web interface is simple to use
• It gives thorough protection for your code
• It uses an algorithm to verify your protected code will work across platforms
• It is available on the web (there's no need to download anything)
• There's an API for integration with your build process
• There's an enterprise solution available for on premises installation (if you don't want to send your code anywhere)

I hope you've found this overview of JScrambler's capabilities interesting and useful. 

If you'd like to see more from me, you can browse my other Tuts+ tutorials on my instructor page or follow me on Twitter @reifman.

Related Links

• JScrambler
• JScrambler Web API Documentation / API Client Downloads
• JScrambler Enterprise
  
• JScrambler Blog