Encrypting the client side local storage data using Angularjs

Question

I have a client side data storing in the localStorage. For security reasons i want to encrypt the data. Is there any way to encrypt/decrypt the client data(not server data) using Angularjs?

$scope.accountObj = {
        isErrorMsg:false,
        isReadonly:false,
        createAccountErr:false        
    };

score 9 · Accepted Answer · answered Mar 02 '16 at 06:28

You could use cryptojs library for encrypting/decrypting your data. First you should generate some key to use in encryption process:

 var secretKey = 'your-secret-key';

Then you need method to store and claim data:

store : function (key, value) {
    var encryptedData = CryptoJS.AES.encrypt(angular.toJson(value), secretKey).toString();
    window.localStorage.setItem(key, encryptedData);
},

get : function (key) {
    var encryptedData = window.localStorage.getItem(key);

    if (!_.isNull(encryptedData))
        return angular.fromJson(CryptoJS.AES.decrypt(encryptedValue, secretKey).toString(CryptoJS.enc.Utf8));

    return null;
}

The only problem here is that secret key is stored on the client side and it's kind of breaking logics of such encryptions.

can you plz add a plunkr link of the full working code – balajivaishnav Dec 30 '16 at 10:35 — balajivaishnav, Dec 30 '16 at 10:35
Please add jsfiddle/plunker exmaple – chaitanya Jul 19 '18 at 07:08 — chaitanya, Jul 19 '18 at 07:08

score 1 · Answer 2 · answered Mar 02 '16 at 06:21

These are probably the best out of the box solutions available for cryptography in Javascript until now.

https://www.w3.org/TR/WebCryptoAPI/ https://crypto.stanford.edu/sjcl/

However, you will probably wanna avoid cryptography on the browser if "security" is a concern and seeing as you don't trust the client machine with your localStorage.

Encrypting the client side local storage data using Angularjs

2 Answers2

Linked