Comparando 2 elementos html
const htmlElement = `<p myAttr=${attackerValue}>Appended element!</p>`; Es fácil inyectar javascript aquí, puedo usar un valor de attackerValue de </p><script>alert("injected JS") </script>
Sin embargo, si hay comillas simples que envuelven attackerValue en htmlElement, ¿sigue siendo posible inyectar javascript?
const htmlElement = `<p myAttr='${attackerValue}'>Appended element!</p>`;Códigos y caja: https://codesandbox.io/s/young-hill-4nww5k?file=/src/index.js
Editar: Encontré mi respuesta, simplemente puedo escapar de la cadena de comillas simples usando una entrada como '</p><script>alert("injected JS") </script>
Para el código front-end no importa si es posible. Las etiquetas <script/> insertadas a través de innerHTML no se ejecutan:
<html> Example: <script> const injection = '<script>alert("hello")<\/script>'; document.body.innerHTML += ` this is a test ${injection}`; // You will never see the "hello" alert because // browser ignores your script tag. </script> </html>El navegador ignora todas las etiquetas de script insertadas en el DOM exactamente por este motivo: para evitar un ataque de inyección.
Es posible inyectar scripts a través de document.write() :
<html> Example: <script> const injection = '<script>alert("hello")<\/script>'; document.write(` this is a test ${injection}`); // You will see the "hello" alert! </script> </html> La solución a eso es simple: no use document.write() .