Getting Started

How to access your Dashboard

To start using the Jscrambler App head to https://app.jscrambler.com/dashboard. After registering and logging in to your account, you will be prompted to protect a simple demonstration Application. After that, the Dashboard is presented. Here is one more demonstration application, and there is the possibility of creating new ones.

Dashboard

Navigating through the Applications

By hovering the mouse over the Playground app and selecting 'View App' you'll be led into the Playground application.

The Playground is a sample Web Application, and all transformations are available to use. Protections done in the Playground won't lower the account balance, so it is the best application to test transformations without any worries.

Playground

In the File Tree on the left, there are all of our application files. By clicking one of these files, you will see its code on the left side of the Text Editor. On the right, the protected code will appear once a protection is made.

Playground File Tree

On the right side of the application there are three tabs:

  • Application Modes, to set language specifications and what type of application is being protected; Application Modes

  • Templates, to select a default template, or use a personalized template created from a specific set of transformations to your code; Templates

  • Fine-Tuning, to select what transformations will be applied; Fine-Tuning

Adding transformations

Starting with the Fine-Tuning tab, note there is an Advanced Options switch. By clicking it, more transformation options will become available. This happens due to the fact that some of the simpler options represent a set of advanced options, for example, Functions represents Function Outlining and Function Reordering in the Advanced Options.

Basic Mode:

Functions basic mode

Advanced Mode:

Functions advanced mode

By hovering over each transformation in the Advanced Options, a brief explanation will appear explaining the use of each one.

Hover Explanation

Sidenote

Once a transformation is selected a Clear Selection link will appear under the Fine-Tuning tab.

Clear Selection

Clicking this link will clear all the selected transformations.

End Sidenote

Proceed with selecting Booleans, Functions, Identifiers and Objects in the Obfuscation options. In Optimization, select Minification, and in RASP (Runtime Application Self-Protection) select Self Defending. Alternatively, head to Templates and select the Self Defending template, as it has the same options as the ones mentioned above.

Now, by pressing the Protect App button at the bottom, the application will be protected, and the resulting protection will be available on the right side of the text editor.

Run

It is possible to run the Playground application right from this screen. This will allow you to compare the result without having to download the code. This feature is only available on the Playground.

Playground run

You can use Run Source and Run Protected to compare the original application with the protected one.

Playground run modal

Download

Text Editor

By pressing Download App, the protected code will be downloaded.

The selected transformations are good to obfuscate functions and objects, conceal logic, and prevent code tampering through anti-tampering and anti-debugging techniques. Attempts to tamper the code will break its functionality and using JavaScript debuggers will trigger defenses to prevent code analysis.

To test, you just have to open index.html in a browser.

Debugging the app will be impossible due to anti-debugging capability the application now has. The slightest change to the code will trigger anti-tampering and break the app. Finally, understanding the logic within the JavaScript code will of course be unfeasible.

Creating your own template

If the application should only run in a certain Domain, along with the Self Defending template, there's the possibility to save the set of transformations as a template so it is always ready to use. Head into the Fine-Tuning tab, select Domain Lock and insert a domain. We want to see the code failing to run, so as an example we'll use 'www.foo.com' in the domain. Let's protect and download the application again. When running this newly protected code, you will notice that the application does not show up.

Now we'll use a domain we can work with. In this case whatever shows up in the browser's navigator when on the application page. Add this domain to your accepted domains, and remove 'www.foo.com'. Protect and download the application again and run it. The application will be working properly again.

Sidenote

These transformations aren't available in all plans so the template creation might fail. A working template for all plans is achieved by selecting Duplicate Literals Removal, Identifiers Renaming, and Whitespace Removal.

End Sidenote

To save these options as a template, go back to the Jscrambler application page. The transformation options should still be selected. Click the Create Template button below the transformations. Give your template a name and a description, click Save Template and a template will be created.

Template

By going to the Templates tab the new Template will be visible under the Custom section.

App Creation

By going back to the Dashboard, and clicking the Create App button, a new application will be created in the Dashboard.

App Creation

After filling in the Application’s name and clicking the Create App button there will be an automatic redirection into the newly created application.

Test App

File Addition

On the left side of the screen, there’s the File Tree, where users can check what files have been uploaded, or add JavaScript and HTML files, or add a single Zip archive containing a project into the app. By clicking the Add button on the left, a file can be created, uploaded, or gotten through a url.

Add File

With the files added to the project, transformations can be applied to the project, and its JavaScript code protected.

Download your transformations and use with API

To use the API, click the blue download button next to the Application Settings. This will download a JSON file with the selected transformations at the time. To download a template, select it then download the Json file.

Download JSON

The downloaded file will be similar to the one below:

{
  "keys": {
    "accessKey": "myAccessKey",
    "secretKey": "mySecretKey"
  },
  "applicationId": "myApplicationID",
  "params": [
    {
      "name": "stringSplitting"
    }
  ],
  "areSubscribersOrdered": false,
  "applicationTypes": {
    "webBrowserApp": true,
    "desktopApp": false,
    "serverApp": false,
    "hybridMobileApp": false,
    "javascriptNativeApp": false,
    "html5GameApp": false
  },
  "languageSpecifications": {
    "es5": true,
    "es6": false,
    "es7": false
  }
}

The accessKey and secretKey vary from user to user, while applicationId changes according to the application that will be protected.

The applicationId is inside the app, above the text editor.

Playground Id

As for the access and secret keys, these are available in the account settings, at API Credentials.

API Credentials

Further information on the API, and Jscrambler’s transformations is available in our documentation.

If there are any questions regarding this or other issues, feel free to contact us at support@jscrambler.com.