Regex para GENERAR miniaturas!?!?! (¡pero es una locura!)

Question

Así que aquí está mi situación y la solución que he encontrado para resolver el problema. He creado una aplicación que incluye TinyMCE para permitir a los usuarios crear contenido HTML para publicar. El usuario puede incluir imágenes en su marcado y arrastrar/cambiar el tamaño de esas imágenes que afectan a los atributos finales de Ancho/Altura en la etiqueta IMG. Todo esto es genial, los usuarios pueden incluir imágenes y redimensionarlas/cambiarlas a su apariencia deseada. Pero un gran problema es que ahora estoy enviando una imagen (posiblemente) mucho más grande al cliente, solo para que el navegador cambie el tamaño de la imagen en los atributos de Ancho/Altura solicitados. Todo ese ancho de banda y tiempo de carga perdidos ...

Así que mi solución es pre-procesar el contenido de marcado de mis usuarios, escanear todas las etiquetas IMG y analizar los atributos de Altura/Ancho/Src. A continuación, establezca la etiqueta SRC de cada img en una solicitud phpThumb con la altura/ancho analizados pasados ​​a la URL de las miniaturas. Esto creará mi imagen de tamaño reducido (optimizando el ancho de banda a expensas de la CPU y el almacenamiento en caché). ¿Qué piensas de esta solución? He visto otras publicaciones en las que las personas usaban mod_rewrite para hacer algo similar, pero quiero afectar el contenido del servicio de la página y no manipular las solicitudes de imágenes a medida que se reciben. .... ¿Alguna idea sobre este diseño?

Necesito ayuda con los detalles finos ya que mis habilidades de expresión regular necesitan algún trabajo, pero tengo poco tiempo y prometo pagar mi deuda de conocimiento técnico pronto. Para facilitar las expresiones regulares, puedo estar seguro de algunas cosas. Solo las etiquetas de img que necesitan este procesamiento tendrán un ancho = "" height = "" atributos existentes (con las comillas dobles, y el texto con mayúscula inferior, pero supongo que emparejar el texto sin distinción de mayúsculas sería mejor si cambia TinyMCE)

Entonces, ¿una expresión regular para unir solo las etiquetas Img necesarias, y tal vez otras tres expresiones regulares para extraer el src, el ancho y la altura?

Gracias a todos.

Answer 1

creo usando regexs de esto es una mala idea y que estaría mejor analizarlo usando algo como PHP Simple HTML DOM Parser, entonces usted puede hacer algo como:

// Load HTML from a string 
$html->load($your_posted_content); 

// Find all images 
foreach($html->find('img') as $element) 
     echo $element->src . '<br>'; 

Answer 2

En términos generales, RegEx is not good for HTML parsing .. Pero en En su caso, puede salirse con la suya si limita su alcance a ser muy estrecho (es decir, solo busca los atributos width=".." y height=".." ... o algo así).

Una mejor solución podría ser transferir el contenido de TinyMCE de forma asíncrona, transmitir las escenas y procesarlo en el servidor con un analizador HTML/XML adecuado, y luego actualizar el contenido del editor una vez hecho esto.

Answer 3

Prueba esto:

(?i)<img(?>\s+(?>src="([^"]*)"|width="([^"]*)"|height="([^"]*)"|\w+="[^"]*"))+

que coincidirá con cualquier etiqueta de imagen, y si los src, width, y height atributos están presentes, serán almacenados sus valores en los grupos 1, 2 y 3 respectivamente . Pero no se requiere ninguno de esos atributos para estar allí, por lo que querrá verificar que los tres grupos contengan valores antes del procesamiento.