Get image filepath using PHP and display in HTML

Question

I have followed several posts and made progress, but I still am unable to display a jpeg image using the html img src tags which is located in my webroot folder under www/SnapShots.

I would like to use PHP to search a local mysql db and return the newest image filepath. I would then like to use that filepath to display the image.

I have tried using both a separate getImage.php and showimage.html as well as as a single file containing both php and html which I will share below. Currently I am able to echo the correct filepath, which when copied and pasted manually into an img src works, however it does not work by referencing the variable or .php url.

webcam.php:

<?php
echo '<!DOCTYPE html>';
echo '<html>';
echo '<body>';
echo '<h1>Display Recent WebCam Image</h1><br />';

//$id = $_GET['id'];
//Connect to mysql DB
$link = mysql_connect("localhost", "root", "password");
mysql_select_db("temperature_database");
//Select thew newest image filepath
$sql = "SELECT imgFilePath FROM tempLog WHERE datetime=(SELECT MAX(tempLog.datetime) FROM tempLog);";
$result = mysql_query("$sql");
$row = mysql_fetch_assoc($result);
mysql_close($link);

//header("Content-type: image/jpeg");
header("Content-type: text/plain");
$imgpath = $row['imgFilePath'];
//echo $imgpath;


echo '<img src="{$imgpath}", alt="Most recent WebCam Shot", width="800", height="600"><br />';
?>
</body>
</html>

I have tried numerous ways of inserting the $imgpath variable and or referencing it from a separate html page ie: .

A point in the right direction would be much appreciated.

As of now webcam.php outputs the following, so there also appears to be an issue with interpreting the html tags.

<!DOCTYPE html><html><body><h1>Display Recent WebCam Image</h1><br /><img src="{$imgpath}", alt="Most recent WebCam Shot", width="800", height="600"><br /></body>

Mr Lister · Accepted Answer · 2016-02-25 15:46:29Z

3

Use double quotes instead:

// code
echo "<img src='{$imgpath}' alt='Most recent WebCam Shot' width='800' height='600'><br />";

PHP does not replace variables inside single quoted strings.

Update

If I understand well your question, you want to read the contents of a image and use it in a <img> tag.

You have to split the code in two files (I'll illustrate with a simplification):

index.html

<p>Webcam image:</p>
<img src="view_image.php">

view_image.php

<?php
$image_path = function_to_get_image_path();
header("Content-type: image/jpeg");
readfile($image_path);

This is the approach you could take.

I recommend you start with an easy sample:

Create a folder with three files:

A sample image called image.jpg

A HTML file called index.html with the following code:

<img src="view_image.php">

And a file called view_image.php with this content:

<?php 
header("content-type: image/jpeg");
readfile("image.jpg");

Note that php has to be enabled in your web server.

edited Feb 25, 2016 at 15:46

Mr Lister

46.8k15 gold badges118 silver badges156 bronze badges

answered Feb 17, 2016 at 18:54

Carlos Gant

7326 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Bijan Over a year ago

Won't he have to escape the "s

Squirrel Over a year ago

Thanks for the advice, I did not know that about the single quotes. With that change and while also using backslash to escape the other " for the html tags i now receive the literal html markup and the variable is resolved to the proper text when accessing the page. Is there a reason why the html would not be interpreted?

Squirrel Over a year ago

Figured it out. After removing the header content-type text/plain the page now displays the image and interprets the html. I suppose since I am also using html on this .php file i should not define any header content type?

Atif Tariq · Accepted Answer · 2016-02-18 15:59:18Z

0

You can also use it like this:

echo '<img src="'.{$imgpath}.'", alt="Most recent WebCam Shot", width="800", height="600"><br />';

answered Feb 18, 2016 at 15:59

Atif Tariq

2,7701 gold badge31 silver badges35 bronze badges

Collectives™ on Stack Overflow

Get image filepath using PHP and display in HTML

2 Answers 2

3 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related