需要后端配合加密(java)

把json字符串先encode 编码为utf-8 再加密为字节数组。再把字节数组编码为Base64

前段解密

需要安装 encryptlong 解析长json

npm install -s encryptlong

//加密
let encryptStr = {a:'444',b:'54554'}
const encrypt = new JSEncrypt();
encrypt.setPublicKey(公钥);
const encryptStr = encrypt.decryptLong(JSON.stringify(encryptStr));
console.log(`解密后：${encryptStr}`);

//解密
const decrypt = new JSEncrypt();
decrypt.setPrivateKey(私钥);
const decryptStr = decrypt.decryptLong(encryptStr);//返回的是base64格式的数据
console.log(`解密后：${decryptStr}`);//base64解码之后 获取的是utf-8编码的数据
//解析utf-8为中文。 
//如果utf-8编码有+(就是后端加密之后把空格加密成utf-8格式的+，前端如解析失败需要此行代码) decodeURIComponent(q.replace(/\+/g, '%20'))
decryptData ? JSON.parse(decodeURIComponent(decryptData)) : null;(******)

观察数据如果出现id或者其他唯一标示出现精度丢失问题使用 json-bigint 处理

npm install json-bigint

//decryptData 是json字符串
decryptData ? JSONbig.parse(decodeURIComponent(decryptData)) : null;(******)

数据的处理

--------------------------------------扩展-----------------------------------------

精度丢失问题

通过ajax请求回来的数据在response和preview两种状态显示的id是不同的。

原因

response中的看到的数据格式其实是字符串（ajax请求回来的数据本质上是字符串格式），preview其实是用了JSON.Parse(字符串)
给我们做美化（格式化），这个转换过程中，一般不会出问题，但是，如涉及大数(一个很大的整数，超过了javascript最大的处理能力)，就会产生转换精度丢失-------
就产生了错误了。

JavaScript 能够准确表示的整数范围在-2^53到253之间（不含两个端点），超过这个范围，无法精确表示这个值，这使得
JavaScript 不适合进行科学和金融方面的精确计算。

上面代码中，超出 2 的 53 次方之后，一个数就不精确了。

import JSONbig from 'json-bigint'
 
const str = '{ "id": 1253585734669957885 }'
 
console.log(JSON.parse(str)) // 1253585734669957885
 
// 它会把超出 JS 安全整数范围的数字转为一种类型为 BigNumber 的对象
// 我们在使用的时候需要把这个 BigNumber.toString() 就能得到原来正确的数据了
console.log(JSONbig.parse(str))
// 对于JSONbig 它在处理数据时，会自动识别其中的 大数， 并以数组的格式保存起来
console.log(JSONbig.parse(str).id.toString()) // 1253585734669957885

解决开头说的问题只需要在axios中配置一下就行,用到了transformResponse这个配置属性：

import JSONBig from 'json-bigint'
 
const res = axios.create({
  // 接口的基础连接
  baseURL: 'http:// www.xxxxx.com/',
  // 自定义返回的元素数据,axios会默认用JSON.parse
  // `transformResponse` 在传递给 then/catch 前，允许修改响应数据
  transformResponse: [
    function (data) {
      // 对 data 进行任意转换处理
      try {
        return JSONBig.parse(data)
      } catch (err) {
        return data
      }
    }
  ]