Existen muchas maneras de hacer el trabajo, pero en todos los casos hay que tener especial cuidado con el escapado de las comillas. Sin eso se podrían producir efectos no deseados en la aplicación.
Podríamos usar addslashes()
para hacer el trabajo:
<?php
$imagenes = "imagen1.pngimagen2.pngimagen3.png";
?>
<script type="text/javascript">
var img = "<?= addslases($imagenes) ?>";
</script>
Este método no sería completamente seguro debido a que discrepancias en el juego de caracteres (no usar utf-8
) podría permitir el cierre de la etiqueta </script>
originando problemas de seguridad (XSS).
Para mejorar la seguridad y para dar soporte a datos arbitrarios (clases, matrices, etc) es mejor usar json_encode()
:
<?php
$prueba = new stdClass();
$prueba->matriz = [
'imagen1' => 'url1',
'imagen2' => 'url2',
];
$prueba->imagen1 = 'url1';
$prueba->imagen2 = 'url2';
?><script type="text/javascript">
var datos = <?= json_encode($prueba) ?>;
console.log(datos);
</script>
Si $prueba
es una cadena de caracteres json_encode
entrecomillará su contenido y escapará cualquier comilla de su interior. Si es una matriz usará []
, o usará {}
para clases/objetos, etc.
TL;DR (demasiado largo, no es necesario que lo leas)
Si pudieras tener problemas o discrepancias en la codificación de caracteres (el devuelto por las cabeceras del servidor no coincide con el indicado en el HTML o simplemente no usas utf-8
) te recomiendo agregar el parámetro JSON_HEX_QUOT | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS
a json_encode
de la siguiente forma:
<?php
$prueba = new stdClass();
$prueba->matriz = [
'imagen1' => 'url1',
'imagen2' => 'url2',
];
$prueba->imagen1 = 'url1';
$prueba->imagen2 = 'url2';
?><script type="text/javascript">
var datos = <?= json_encode($prueba,
JSON_HEX_QUOT | JSON_HEX_TAG | JSON_HEX_AMP | JSON_HEX_APOS
) ?>;
console.log(datos);
</script>
La seguridad de la función json_encode()
es más que suficiente si todo está correctamente codificado en utf-8
. El RFC indica que por defecto se usa UTF-8
aunque podría usarse UTF-16
también, por lo que si se mezclan diferentes codificaciones de caracteres podrían escaparse incorrectamente una comilla para determinado juego de caracteres.
'<?= $imagenes ?>'
.