Inyección de código XSS almacenado en el front-end basado en el DOM del cliente

Cuando el proyecto front-end buscaba vulnerabilidades de seguridad, surgió el problema de la inyección de código almacenado basado en el DOM del lado del cliente. Después de la investigación, se debió al uso de caché del navegador comoalmacenamiento local, almacenamiento de sesión, cookieA veces, el valor puede ser manipulado en el proceso de almacenamiento y lectura, lo que provoca problemas de seguridad xss

---

Tome el almacenamiento local como ejemplo aquí. Cuando un atacante modifica su valor de almacenamiento local directamente en la consola, correrá el riesgo de ser atacado cuando lea el valor y lo ejecute. La solución es cifrar el valor, por supuesto. Cuanto mayor sea el complejidad de , más seguro será su programa.
Aquí simplemente haz unbase64Cifrado y descifrado, como ejemplo de demostración.

Dado que base64 informará un error cuando encuentre tipos de datos complejos, como objetos o matrices durante el proceso de codificación, también debe serdecodeURIComponent/encodeURIComponentfuncionar.

El valor en el caché también debe ser un tipo de cadena, por lo que también implicaJSON.stringify/JSON.parsemétodo.

método de cifrado

function encrypt(data, key, iv) {
    
    
    return window.btoa(encodeURIComponent(data))
  }

método de descifrado

function decrypt(data, key, iv) {
    
    
    return decodeURIComponent(window.atob(data))
  }

método de valor de tienda

dejar datos = {a: 1, b: []}

localStorage.setItem('a', encrypt(JSON.stringify(data)))

método de valor

var a = JSON.parse(decrypt(localStorage.a)