Simplemente haces la solicitud a la URL de la imagen.

Por ejemplo, si tu imagen se llama test1.png y la tienes en un directorio llamado images , harías la URL así:

https://your.domain/images/test1.png

Si desea ocultar la ruta completa a las imágenes y servirlas a través de una página (para que tenga cierto control sobre la solicitud por algún motivo), puede hacer algo más como lo siguiente. Llamemos a la página de PHP img.php . Y la solicitud podría ser como

https://your.domain/img.php/test1

 <?php $request = './default.png'; if (isset($_SERVER['PATH_INFO'])){ $request = './images'.$_SERVER['PATH_INFO'].'.png'; if (! file_exists($request)){ $request = './default.png'; } } // we now know we have a valid request and the file was found header('Content-type: image/png'); header('Content-Length: '.filesize($request)); echo file_get_contents($request); exit; ?>

Con este enfoque, podría tener cualquier cantidad de imágenes en el directorio /images/ y servirlas si coinciden con la solicitud.

El sitio web en su muestra puede usar el mismo enfoque de información $_SERVER['PATH_INFO'] pero estaría creando dinámicamente la imagen usando las variables pasadas y explode('/',$_SERVER['PATH_INFO']) junto con imagecreate()

Una versión hack muy rápida sería algo como lo siguiente. La solicitud sería así:

https://your.domain/test.php/100x50/919/222

Y el código muy rápido, casi sin verificación de errores, podría ser:

 <?php function hexToColor($hx){ $rgb = array(0,0,0); if (strlen($hx) == 3){ $rgb[0] = hexdec($hx[0].$hx[0]); $rgb[1] = hexdec($hx[1].$hx[1]); $rgb[2] = hexdec($hx[2].$hx[2]); } else { $rgb[0] = hexdec($hx[0].$hx[1]); $rgb[1] = hexdec($hx[2].$hx[3]); $rgb[2] = hexdec($hx[4].$hx[5]); } return $rgb; } // default values $sizeW = 100; $sizeH = 100; $bg = array(0,0,0); $fg = array(255,255,255); if (isset($_SERVER['PATH_INFO'])){ $opts = explode('/',substr($_SERVER['PATH_INFO'],1)); $bgSet = false; foreach($opts as $k => $v){ // check for a width x height request if (strpos($v,'x')){ $tmp = explode('x',$v); $sizeW = $tmp[0]; $sizeH = $tmp[1]; } elseif ($bgSet){ // must be a foreground request $fg = hexToColor($v); } else { $bg = hexToColor($v); $bgSet = true; } } } header("Content-Type: image/png"); $im = @imagecreate($sizeW,$sizeH) or die("Cannot Initialize new GD image stream"); $background_color = imagecolorallocate($im,$bg[0],$bg[1],$bg[2]); $text_color = imagecolorallocate($im,$fg[0],$fg[1],$fg[2]); imagestring($im,1,5,5,$sizeW.' x '.$sizeH,$text_color); imagepng($im); imagedestroy($im); exit; ?>

¡Pero recomendaría encarecidamente un montón de verificación de errores antes de usar ese código!

Según tengo entendido, desea actualizar dinámicamente la imagen.

Puede ver que en su sitio web principal crearon un formulario para los valores ingresados:

Después de eso, en la URL de la imagen hay todos los valores que necesita para mostrar esta imagen:

https://dummyimage.com/600x400/8a1a8a/232dba&text=xzcxzcnbngh

cual es esta imagen:

lo que no puede ver es su lado del servidor, que toma los parámetros 600x400/8a1a8a/232dba&text=xzcxzcnbngh , crea una imagen usando su servidor y se la devuelve.

Le sugiero que cree un lado del servidor que devolverá una imagen y texto en función de los parámetros dados.

según su servidor, deberá averiguar cómo crear la imagen y devolverla.

Como puede ver aquí, acabo de modificar el valor "src" de y cambió el texto de la foto.

lo que significa que su servidor recibe la solicitud y devuelve la imagen.

Si desea una solución simple, puede enviar esos parámetros a los scripts de su página y crear este elemento de imagen usando JavaScript. De esa manera, su código html estará limpio incluso sin la etiqueta del elemento img.

cree su img en JS y envíelo, colóquelo en el cuerpo html.

Marcador de posición de imagen que se actualiza mediante secuencias de comandos de código HTML:

 <img id="abc" src="">

Código JavaScript:

 var abcImage = document.getElementById('abc'); abcImage.src = 'https://dummyimage.com/600x400/000/fff';