visitor (0 QPoints)
  • FR
  • EN
  • NL
  • DE
  • ES
315 experts, 1193 registered users, 1659 questions already answered
European Experts Exchange, the very best site for high-quality IT solutions

New Improved Search!

 


05/10/2011 1h30 : Steve Jobs is dead, the father of Apple ][ is gone, we are all orphaned.

Languages :: DHTML, JScript :: dynamic embedded (inline) image from PHP ?
By: Bernard France  Date: 18/06/2006 11:19:08  English  Points: 20 Status: Answered
Quality : Excellent
I want an image to be ebedded in a current HTML page, generated from PHP, with contents dynamically generated also. How can I do that ?

I could 1) generate an image on disk, and send the reference to the browser in the href of the IMG, but I don't want that.

I could 2) make the classical javascript href= or src= manipulation, but this would require special URIs (PHP scripts) to generate the different images. I don't want that as it implies control outside of the main PHP script.

I want a single PHP script to generate the IMG tag, and its contents also computed from that script. A bit like a "pseudo-screen" display.

Can this be done ?

I get from the web only examples of (2)

thanks
By: VGR Date: 19/06/2006 09:20:15 English  Type : Answer
I am porting some code that requires what you ask for, so I conducted some experiments.

Here's some code you can see in action at http://www.fecj.org/extra/inlineimages.php

It's true that this problem is very very poorly documented on the Web. With one exception, all the web pages relate to dynamically changing the href of the img tag, which is not suitable for you.

The first method is to drop the classical <img tag with this form : <img alt="foo" src="data:image/gif;base64, and then to drop the base64-encoded image binary contents (don't forget to close the tag)
This methos was supposed to be limited to 1024 bytes, but I dropped 4K images with no problem so far. It may be browser dependent.

The second method is a variant to test non-encoded data. Not useful.

The third method is the so-called "src=javascript" method. Drop this : <img alt="foo" src="javascript:' and then the binary data. I tried with and without base64 encoding but couldn't get it to work as expected. At best (base64-encoded), it generates an invalid red cross image. Don't forget to close both the src="" and the javascript:'' parts.

To get the binary contents of a freshly-generated image in memory, you have two solutions :
1) either write to disk with ImageGIF($ref,$path); and then afterwards send to browser via a file() call, OR
2) (better) use ob_start() to catch the contents and spare I/O on disk.

<?php // // inlineimages.php : test inline image handling from PHP with current browsers (FX,IE6) // //VGR16062006 Création // // TODO : Nil // echo <<<STARTHTML <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>VGR's PERT/MPM, GANTT, PERT Cost</title> </head> <body> This page tries to write data into inline images...while other HTML contents are present (such as this line) STARTHTML; $NbLignes=9; $lines=array('test 1st line','2nd line','3rd line','last line','autre ligne','encore une ligne','et encore une...','on va s\'arrêter là ?','on termine ici...'); $imgname='test.gif'; // crée l'image // le chemin doit être absolu (ne marche d'ailleurs pas avec Zindoze et PHP <= 4.2.3 $path_to_font_file=dirname($SCRIPT_FILENAME).'/jGara2.ttf'; $haut=ImageFontHeight(3); $larg=ImageFontWidth(3); $im=imagecreate(80*$larg,40+18*$NbLignes); $black=ImageColorAllocate($im,255,255,255); // est blanc en fait $white=ImageColorAllocate($im,0,0,0); // est noir en fait $grey=ImageColorAllocate($im,153,153,153); $poubBool=True; for ($i=0;$i<$NbLignes;$i++) { //VGR18102004 OLD for bitmaps : ImageString($im,$fontcode,2,20+20*$i,"$lines[$i]",$white); ImageTTFText($im,14,0,2,20+20*$i,$white,$path_to_font_file,"{$lines[$i]}"); } // for ImageTTFText($im,10,0,2,20+20*$NbLignes,$grey,$path_to_font_file,'offert par VGR, http://www.edainworks.com'); // get image real contents ob_start(); ImageGIF($im); //VGR REM add ,$imgname to push to disk and return with a Header('Content-type: image/gif'); $ImageData = ob_get_contents(); $ImageDataEnc = base64_encode($ImageData); ob_end_clean(); // renvoi de l'image - méthode 1 data URL echo 'Méthode 1 - data URL with base64() <img alt="foo" src="data:image/gif;base64,'; echo $ImageDataEnc; echo '">'; echo ' '.strlen($ImageDataEnc)." octets "; echo 'Méthode 2 - data URL without base64() <img alt="foo" src="data:image/gif;'; echo $ImageData; echo '">'; echo 'Méthode 3 - javascript URL <img alt="foo" src="javascript:\''; echo $ImageDataEnc; echo ';\'">'; echo <<<EOR <hr> Résultats : Méthode 1 OK avec FX, KO-BrokenImg avec IE6 Méthode 2 KO-garbage avec FX et IE6 Méthode 3 KO-BrokenImg (enc64) ou KO-garbage avec FX et IE6 EOR; // free memory Imagedestroy($im); // end HTML //footer echo <<<EOS <center><font size="-2">PERT/MPM, GANTT, PERT Cost @1993, 2006 <a href='mailto:vgr@europeanexperts.org?Subject=about%20PERT/MPM%20PHP%20port'>VGR</a></font></center> </body> </html> EOS; ?>



and the results are ...

Méthode 1 OK with FX, KO-BrokenImg with IE6
Méthode 2 KO-garbage with FX & IE6
Méthode 3 KO-BrokenImg (enc64) or KO-garbage with FX & IE6

So the answer is "yes, it's feasible, using the first method, but it will work only with Firefox and Mozilla (and possibly Netscape and other non-IE browsers))

Best regards

Do register to be able to answer

©2010 These pages are served without commercial sponsorship. (No popup ads, etc...). Bandwidth abuse increases hosting cost forcing sponsorship or shutdown. This server aggressively defends against automated copying for any reason including offline viewing, duplication, etc... Please respect this requirement and DO NOT RIP THIS SITE.
Please DO link to this page! Post to Twitter Post to Plurk Post to Yahoo Buzz Post to Delicious Post to Digg Post to Facebook Post to MySpace Post to Ping.fm Post to Reddit Post to StumbleUpon

EContact
browser fav
page generated in 226.073030 milliseconds

Why Google AdSense ads ?
compteur
 Ranking-Hits PageRank for this page