如何加密和解密json中的数据angular 8

How to encrypt and decrypt json data in angular 8

尝试使用 crypto-js 加密和解密 json 数据。但没有工作。如何找到解决方案。如果有人知道请帮助找到解决方案。

演示:https://stackblitz.com/edit/angular-ivy-nwhkgz?file=src%2Fapp%2Fapp.component.ts

storageData=
[

  {

  "customerInfo": { 
    "Micheal": 1,
    "Milson": 2 
  },

  "mycart": {
    "Ol1": 1,
    "Ol3": 1
  },


  "cartItemsList": [
    {
      "pid": "Ol1",
      "name": "Avacota",
      "qty": 1 
    },
    {
      "pid": "Ol3",
      "name": "Kaliflower",
      "qty": 1 
    }
  ],
  
  "cartTotal": 2

  }

  ];
 
ngOnInit(){

//Encrypt Info
this.encryptInfo = encodeURIComponent(CryptoJS.AES.encrypt(this.storageData, 'secret key 123').toString());

console.log("encryptInfo");
console.log(this.encryptInfo);


//Decrypt Info
var deData= CryptoJS.AES.decrypt(this.encryptInfo, 'secret key 123'); 
this.decryptedInfo = decodeURIComponent(deData.toString(CryptoJS.enc.Utf8));   

console.log("decryptedInfo");
console.log(this.decryptedInfo);

}

首先:我不建议您在没有咨询精通密码学和网络安全的人的情况下自己将此用于生产用途。

有两个错误阻止了加密部分的工作:

  1. 您尝试加密的数据不是字符串。您应该在加密之前对其进行序列化(字符串化)。我在固定示例中使用 JSON.stringify 完成了它,后来在第 51 和 59 行
  2. 上使用 JSON.parse 解析了它
  3. 您在加密之后使用了encodeURIComponent,所以decodeURIComponent 必须在解密之前完成。参见 ln 58

这是固定的 stackblitz:https://stackblitz.com/edit/angular-ivy-h6zlcv?devtoolsheight=33&file=src/app/app.component.ts