Secure Your CSS And JavaScript Files

Introduction

Nowadays securing client-side code is a challenging job. In this article, I come up with some good tips to secure client-side code. You can place either JavaScript or CSS files in your secured server and read those files using JavaScript obfuscated code to prevent the unnecessary access. Step 1 Remove all your CSS and JavaScript files from the solution which needs security and place those files in the secured server. Step 2 Store the base address of your secured server in your database table. Step 3 Get the base address by calling the service (API) method. Step 4 Create one JavaScript file in the solution where the API method is called to get the base address of the secured server. Step 5 Inside JavaScript file append relative address with the base address to form actual address. Actual address = base address + relative address Ex Step 6 For the successful call of the API method from JavaScript file, load all the required CSS and JavaScript file, using JQuery append methods, in the success code blocks In the success event of the API method call in JavaScript file, load all required CSS and JavaScript files by calling the JQuery to append() method. Step 7 Obfuscate the created JavaScript file which has been created in the solution to call the API method. Sample Code The below JavaScript code is the read CSS file dynamically and load it to the header section of the HTML page. Javascript Code