I need to display an image which is in Base64 format. When I build the img tag in PHP it doesn't show the image (just the defualt 'broken image' icon). When I view the page source and click on the Base64 data is shows the picture as expected. Also, if I copy and paste the page source and save it as an HTML file it displays as expected. I also tried a random image and that worked however as my image works from a .html file I assume it is OK and should work?
The .php code:
header('content-type: text/html');
...
echo "<html><head></head><body>";
echo "Name = $name<br/>";
echo "<img src=\"data:image/jpg;base64,$photo\"/>";
echo "</body></html>";
The HTML from View Source:
<html>
<head></head>
<body>Name = Andrea Pilipczuk<br/>
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQEAyADIAA...{too big to fit here].../9k="/>
</body>
</html>
EDIT:
This didn't come up in View Source but digging around Chrome, I inspected the image element and found at the end was "9k=�������". Is this some kind of padding? When I edited the element to remove these the image showed up as expected.
The following code removes the random characters and displays the image correctly but seems a bit hacky, would obviously prefer to solve the underlying issue.
$unpadded = explode("=", $photo);
$padding = strlen($unpadded[0]) % 3;
$padded = $unpadded[0];
while ($padding > 0) {
$padded .= "=";
$padding--;
}
echo "<img src=\"data:image/jpeg;base64,$padded\"/>";
Related
First posting here. I know inline php is not preferred but I haven't converted all my scripts to echo json_encoded arrays to work in javascript on the client side...so for now, I have inline php.
I do not know the extension of the user uploaded media because it could be a jpg,mp4,etc and upon upload it goes into a media folder with the user id as an identifier.
When my user first loads the div (and html page), the php script cycles through an array and does a fetch_assoc from sql query to the database each time; It returns the (media_id #) and prints out an li with the respective media displayed next to some other values from the query.
I only know the (media_id) and the file path name without the extension. When the page first loads, everything works great and the file_exists function returns correctly.
THE PROBLEM
When I AJAX the div and do the query again, because the user added a row to the database, the new list prints out with all info, BUT the file_exists function doesn't recognize the exact same paths as before and I don't have an img or video on the page.
I copy/pasted the exact same code from the original div and put it in a file for ajax to re-query and print the new li's.
All variables are the same and when I hard code a test filepath, it prints fine. Maybe there's a caching issue?
THE CODE
<?php
$result=$conn->query($select);
$row=$result->fetch_assoc();
?>
<li>
<?php
if ($row['count']>0) {
echo "<div class='media-container'>";
$pathname = "uploads/".$row["id"]."media1";
$testjpg=$pathname.".jpg";
$testjpeg=$pathname.".jpeg";
$testpng=$pathname.".png";
$testmp4=$pathname.".mp4";
if (file_exists($testjpg)==TRUE || file_exists($testpng)==TRUE || file_exists($testjpeg)==TRUE) {
echo '<img src="'.$pathname.'">';
}if(file_exists($testmp4)==TRUE) {
echo "<video></video>";
}
echo "</div>";
}?>
</li>
I could use some advice on how to fix this and how to print appropriate media tags on unknown media types.
THE OUTPUT
<div class='media-container'>
</div>
DEBUGGING ATTEMPTS
echoing the exact file path of a known image in an <img> tag works fine. putting echo'test'; inside the file_exists case does nothing.
--
Solution (Kind of)
So I've used html's onerror before and I found a workaround, though I'd still like to know why I was getting an error. PSA this uses JQuery but javascript works too:
My Solution
<script>
function img2video(el, src) {
$( el ).replaceWith( '<video class="videoClass"><source src="'+src+'" type="video/mp4"></video>' );
}
</script>
<body>
<img style="width:100%" onerror="img2video(this,'<?php echo$pathname;?>')" src="<?php echo$pathname;?>">
</body>
Alright, so here's the final answer I made to best fit the problem using glob:
Javascript:
function img2video(el,src,place) {
if (place=='type') {
$( el ).replaceWith( '<video controls controlsList="nodownload" disablePictureInPicture style="width:100%;object-fit:contain;" preload="auto"><source src="'+src+'" type="video/mp4"></video>');
}
}
PHP:
<?php for ( $i=1; $i <= $limit; $i++) {
$path ="[DIRECTORY]/".$row["id"]."media".$i;
$path = (!empty(glob($path . '*.{jpg,png,jpeg,avi,mp4}', GLOB_BRACE)[0])) ? glob($path . '*.{jpg,png,jpeg,avi,mp4}', GLOB_BRACE)[0] : false;?>
<div>
<img onerror="img2video(this,'<?php echo$path;?>','type',<?php echo$row["id"];?>,<?php echo$i;?>)" src="<?php echo$path;?>">
</div>
<?php } ?>
I don't know how to mark as duplicate, if someone could help with that. My answer uses Glob_Brace from #Akif Hussain 's response on This Question.
I'm trying to embed an image with it's data inline.however when I don't encode my data as base64 it doesn't work and some random characters are displayed.here are the two variations in php:
....
//$img-->image data read from database
$data = stream_get_contents($img);
$data64 = base64_encode($data);//when I don't use this it doesn't work
$image64 = '<img src="data:image/jpeg;base64,'.$data64.'>';
$image = '<img src="data:image/jpeg,'.$data.'>';
$img64 works but `$img' doesn't.what's the problem?
That's to be expected. JPEG data will naturally contain > and " and other HTML metacharacters. As soon as a " and then > are encounter, your browser will think the <img> tag has been closed, and everything else will be treated as text
e.g, if you don't base64_encode, you'll get something like
<img src="data:image/jpeg,randomgarbagewitha"andthena>andsome more random garbage">
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
the binary contents of the jpg here
^--end of src attribute
^---end of img tag
$bin_string = file_get_contents($_FILES["file"]["name"]); // image reading
$hex_string = base64_encode($bin_string); // encoded image
Saving into database and then retrieving back...
$decoded= base64_decode($message); // decoded image....
In HTML:
<?php header("Content-Length: " . strlen($decoded));
header('Content-Type: image/png'); ?>
<?php echo $decoded ?>
But this is not working.... what else is needed?
Here is the output of base64_encode($bin_string) :
/9j/4AAQSkZJRgABAgEASABIAAD/7Q1oUGhvdG9zaG9wIDMuMAA4QklNA+0KUmVzb2x1dGlvbgAAAAAQAEgAAAABAAEASAAAAAEAAThCSU0EDRhGWCBHbG9iYWwgTGlnaHRpbmcgQW5nbGUAAAAABAAAAHg4QklNBBkSRlggR2xvYmFsIEFsdGl0dWRlAAAAAAQAAAAeOEJJTQPzC1ByaW50IEZsYWdzAAAACQAAAAAAAAAAAQA4QklNBAoOQ29weXJpZ2h0IEZsYWcAAAAAAQAAOEJJTScQFEphcGFuZXNlIFByaW50IEZsYWdzAAAAAAoAAQAAAAAAAAACOEJJTQP1F0NvbG9yIEhhbGZ0b25lIFNldHRpbmdzAAAASAAvZmYAAQBsZmYABgAAAAAAAQAvZmYAAQChmZoABgAAAAAAAQAyAAAAAQBaAAAABgAAAAAAAQA1AAAAAQAtAAAABgAAAAAAAThCSU0D+BdDb2xvciBUcmFuc2ZlciBTZXR0aW5ncwAAAHAAAP////////////////////////////8D6AAAAAD/////////////////////////////A+gAAAAA/////////////////////////////wPoAAAAAP////////////////////////////8D6AAAOEJJTQQIBkd1aWRlcwAAAAAQAAAAAQAAAkAAAAJAAAAAADhCSU0EHg1VUkwgb3ZlcnJpZGVzAAAABAAAAAA4QklNBBoGU2xpY2VzAAAAAHMAAAAGAAAAAAAAAAAAAABIAAAAoAAAAAkAYQBpAHIAdABhAHMAdABpAGMAAAABAAAAAAAAAAAAAAAAAAAAAAAAAAEAAAAAAAAAAAAAAKAAAABIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADhCSU0EERFJQ0MgVW50YWdnZWQgRmxhZwAAAAEBADhCSU0EFBdMYXllciBJRCBHZW5lcmF0b3IgQmFzZQAAAAQAAAACOEJJTQQMFU5ldyBXaW5kb3dzIFRodW1ibmFpbAAACcEAAAABAAAAcAAAADIAAAFQAABBoAAACaUAGAAB/9j/4AAQSkZJRgABAgEASABIAAD/7gAOQWRvYmUAZIAAAAAB/9sAhAAMCAgICQgMCQkMEQsKCxEVDwwMDxUYExMVExMYEQwM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
1)
$_FILES["file"]["name"] contains only name of uploaded file. Real temporary path of uploaded file on your server is stored in $_FILES["file"]["tmp_name"].
$bin_string = file_get_contents($_FILES["file"]["tmp_name"]);
2)
There can be some invisible character printed out before or after the image.
Please ensure that <?php is the first thing on the first row of your file and, for simplicity, remove all other <?php and ?>, including the last one. You can add die; on the last row to end the script to ensure that nothing else is added to the end of image.
I got the solution...
simply convert the image using
$bin_string = file_get_contents($_FILES["file"]["tmp_name"]); // image reading
And then for converting string back to image use the following :
" />
I need to get all the source values from all image inside a container. I'm having some difficulty with this.
Allow me to explain the process.
All the data comes from a database. Inside the backofficce the user enter all the text and the image inside a textarea. To separate the text with the image the user must enter a pagebreak.
Let's go to the code
while ($rowClients = mysql_fetch_array($rsClients)) {
$result = $rowClients['content'];
$resultExplode = explode('<!-- pagebreak -->', $result);
// with resultExplode[0] I get the code and with resultExplde[1] I get the image
// Now with I want to get only the src value from resultExplode[1]
I already tried with strip_tags
$imageSrc = strip_tags($resultadoExplode[1]);
but it doesn't print anything.
I found this post but without success. I stopped in the first print_r.
Can anyone help me??
Thanks
try foreach, if you can't print it out.. (if that's the problem)
foreach($resultExplode as $key => $value){
echo "[".$key."]".$value;
}
I found a solution:
continuing with the previous code I worked with the split function.
So I start to strip the tags. This way I get the img isolated from the rest.
$image = strip_tags($resultExplode[1],"<img>");
Because all the img has the same structure like this: <img width="111" height="28" alt="alternative text" src="/path/to/the/file.png" title="title of the image">
I split this string, using " as a delimiter
$imgSplit = split('"', $image);
$src = $imgSplit[3];
Voilá. It's working
What do you say about this procedeure??
I've stored my Images into (Medium) BLOB fields and want to retrieve them embedded within my PHP-generated web pages.
When I test retrieving the stored images using
header('Content-type: ' . $image['mime_type']);
echo $image['file_data'];
everything looks just fine.
However, I have not yet found a way to retrieve the image(s) cleanly into the middle of my documents. For example, using
$image = $row['file_data'];
echo '<img src="data:image/jpeg;base64,'.$image['file_data'].'" alt="photo"><br>';
...or...
$im = imageCreateFromString($image);
I just wind up with a bunch of hexadecimal garbage on screen.
I intitially stored the Images using:
ob_start();
imagejpeg($resizedImage, null, 100);
$content = ob_get_contents();
ob_end_clean();
$sql = sprintf(
"insert into images (filename, mime_type, file_size, file_data, event_id)
values ('%s', '%s', %d, '%s',%d)",
mysql_real_escape_string($fileName),
mysql_real_escape_string($mimeType),
$imageSize,
mysql_real_escape_string($content),
$eventID
);
$result = $cn->query($sql);
Does anyone PLEASE have a working code snippet to successfully display the stored .jpg mid-file in the PHP output?
echo '<img src="data:image/jpeg;base64,'.base64_encode($image['file_data']).'" alt="photo"><br>';
However, remember that old IE versions do not support this kind of inline images! Besides that, the browser cannot cache such an image except together with its containing HTML page.
You should create some sort of "image server". You're already close to that.
For example, create something like image.php that will get a image name and will generate it on the fly.
So, for example, say you want to get somePic.jpg image. You can get it through:
image.php?name=somePic.jpg
<?php
header('Content-type: ' . $image['mime_type']);
echo $image['file_data'];
?>
Your tag:
<img src='image.php?name=somePic.jpg' />
Or more general:
echo "<img src='image.php?name={$image['filename']}' />"
Why not just call your test page image.php, then have it called from the browser on the rendered page:
<img src="image.php?imageid=123" alt="photo" />