ERROR TypeError: Cannot read property ‘salt’ of null

I am having troubles trying to encrypt and decrypt the values of local and session storage.

Thank you for your time and your help.

import { Injectable } from "@angular/core";
import { environment } from "../../../environments/environment";
import * as CryptoJS from 'crypto-js';



@Injectable({
  providedIn: "root"
})
export class StorageService {
  constructor() {}

  // If the logged in user details are stored in local storage the user will stay logged in if they refresh
  // the browser and also between browser sessions until they logout

  // Para cambiar el tipo de storage a utilizar modificar el valor en el archivo de enviorment correspondiente
  // los valores posibles son LOCALSTORAGE o SESSIONSTORAGE

  encryptation(value: string, llave: string) {
    return CryptoJS.AES.encrypt(value, llave);
  }

  decrypt(value: string, llave: string) {
    return CryptoJS.AES.decrypt(value, llave);
  }

  llave: string = "prueba";

  setItem(key: string, value: string): void {
    value = this.encryptation(value, this.llave);
    if (environment.storage === "SESSIONSTORAGE") {
      console.log(key,value);
      sessionStorage.setItem(key, value);
    } else {
      console.log(key,value);
      localStorage.setItem(key, value);
    }
  }

  getItem(key: string): string {
    let value;
    let value1 = sessionStorage.getItem(key);
    let value2 = localStorage.getItem(key);
    if (environment.storage === "SESSIONSTORAGE") {
      value = this.decrypt(value1, this.llave);
      console.log(value);
      return value;
    } else {
      value = this.decrypt(value2, this.llave);
      console.log(value);
      return value;
    }
  }

  key(index: number): string {
    if (environment.storage === "SESSIONSTORAGE") {
      return sessionStorage.key(index);
    } else {
      return localStorage.key(index);
    }
  }

  removeItem(key: string): void {
    if (environment.storage === "SESSIONSTORAGE") {
      sessionStorage.removeItem(key);
    } else {
      localStorage.removeItem(key);
    }
  }
}

I need to encrypt the values of local and session storage, and decrypt when it’s necessary.

I do not know where it’s the failure.

Which one it’s the easiest way to achieve the encryption?

Answer

The error isn’t that informative, but basically, when decrypting a value with crypto-js, it has a step where it converts string inputs to an “encrypted object” that contains e.g. the salt. If you pass a non-string to the decrypt function, crypto-js assumes it’s already such an object. Therefore, if you pass null, it will later on try to access (null).salt and error.

This basically means your getItem is trying to read a value that isn’t in the storage. Add proper null checks. E.g. if you try to access a value that is null, return that immediately without trying to decrypt it.