añadir automáticamente el ancho y la altura de los atributos etiquetas con una función de PHP

StackOverflow https://stackoverflow.com/questions/3157516

Pregunta

Lo que quiero es una función que se puede ejecutar en la entrada del usuario que de forma inteligente encontrará y añadir el width y atributos height a cualquier etiqueta <img> en una burbuja de HTML con el fin de problemas página-reflujo de evitar mientras las imágenes se cargan.

Estoy escribiendo el guión de contabilización para un foro de PHP, donde la entrada de un usuario es verificada y generalmente hace más agradable antes de escribirla en la base de datos para su visualización posterior. Como un ejemplo de lo que hago para hacer las cosas mejor, tengo un script que los insertos alt atributos en las imágenes de esta manera:

Here are two images: <img src="http://example.com/image.png"> <img src="http://example.com/image2.png">

que, tras la desinfección por el script publicación, se convierte

Here are two images: <img src="http://example.com/image.png" alt="Posted image"> <img src="http://example.com/image2.png" alt="Posted image">

(Esto hace que sea valida bajo HTML 4 estricto, pero tal vez no está en el espíritu de los atributos alt-ay!)

Así que, por mi función, tengo una vaga idea de que el servidor tendrá que ejecutar getimagesize() en cada imagen externa que encuentra en el bloque de HTML, a continuación, aplicar los atributos que la función genera a todos y cada etiqueta <img> se topa . Asumo que esta función se ha escrito antes, pero no han tenido suerte en Google Docs o php.net. ¿Tengo que empezar de cero, o es alguien consciente de un (relativamente) la función robusta que pueda usar o adaptar para hacer este trabajo?

¿Fue útil?

Solución

Tienes razón en getimagesize(). Simplemente puede hacer algo como esto:

$img = 'image2.png';
$info = getimagesize($img);
printf('<img src="%s" %s>', $img, $info[3]);

Si la imagen está alojada en una ubicación remota, usted tiene que descargar todas las imágenes, aunque (la función se encarga de ello), por lo que es posible que desee almacenar en caché el resultado a acelerar las cosas en las solicitudes posteriores.

Editar acabamos de ver que tiene una cadena que contiene diversos elementos <img>. Esto debería hacer el truco:

<?php
$html = <<<EOF
something <img src="https://www.google.com/images/logos/ssl_logo_lg.gif"> hello <img src="https://mail.google.com/mail/images/2/5/logo1.png">
EOF;

$dom = new DOMDocument();
$dom->loadHTML($html);

foreach ($dom->getElementsByTagName('img') as $img) {
    list($width, $height) = getimagesize($img->getAttribute('src'));
    $img->setAttribute('width', $width);
    $img->setAttribute('height', $height);
}

$xpath = new DOMXpath($dom);
$newDom = new DOMDocument();
foreach ($xpath->query('//body/p')->item(0)->childNodes as $node) {
    $newDom->appendChild($newDom->importNode($node, true));
}

$newHtml = $newDom->saveHTML();
?>

Otros consejos

El problema es que se está requiriendo el servidor para hacer una gran cantidad de trabajo en la delantera. Sospecho que sería mucho más eficiente para poblar una base de datos de tamaños fuera de línea (o mantener una caché de tamaños).

Y después de haber hecho esto, se podía empujar el trabajo a cabo al navegador utilizando un javascript cacheables que establece los tamaños de imagen y se llama línea al final del html (que tiene la ventaja de la que no es necesario pulsar todo el hTML a través de su código PHP para volver a escribir). Pista: iterar a través de document.images []

HTH

C.

Puede utilizar getimagesize () pero sería inteligente para almacenar esta información una vez y volver a utilizarlo, o al menos caché agresiva (ya que es poco probable que cambie a menudo) o su servidor se arrastrará a un alto con mayor carga

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top