How to retrieve image from database to html form? - php

I save my image name to my database and image itself to upload file.
When the user want to see them, I want to show them to user with in a div.
Here things get messy in my mind.
here is my php code
$con = mysql_connect("localhost","root","");
if (!$con){die('Could not connect: ' . mysql_error());}
mysql_select_db("marmaris", $con);
$bilgi= mysql_query("SELECT * FROM ".$isim." WHERE id='".$id."'");
while($sutun= mysql_fetch_array($bilgi))
{
$name=$sutun["name"];
$bures=$sutun["resbuyuk"];
$kures=$sutun["reskucuk"];
$aciklama=$sutun["aciklama"];
$map=$sutun["map"];
$link=$sutun["link"];
}
$words = preg_split('/[\s?]+/', $kures);
$result = count($words);
for($i=0;$i<$result;$i++){
$city=$words[$i];
}
i got 6 images now $city is one of the image forexample i want to show the user that image.
this is my html part don't worry about the isimid name its just sending 2 words at one time.
<div id="kucukres">
<img src="upload/<?php echo $city ?>" alt="Angry face" width="32" height="32" />
</div>
I want to show the image but it only writes the alt words.
In summary, I want to show image that has saved (the name) in database and itself in the upload folder.
With php part, I take the name of the file from database; in html, I want to show that image.
edit :
this is my new html tag.
<div id="kucukres">
<img src="getres.php?file=<?php echo $isimid;?>"/>
</div>
and my php file is
$bilgi= mysql_query("SELECT reskucuk FROM ".$isim." WHERE id='".$id."'");
while($sutun= mysql_fetch_array($bilgi))
{
$kures=$sutun["reskucuk"];
}
$words = preg_split('/[\s?]+/', $kures);
$result = count($words);
//unlink("upload/$word[$isim]");
for($i=0;$i<$result;$i++){
$city=$words[$i];
header('Content-type: image/jpeg');
$pic = 'upload/'.$city;
echo $pic;
but still i cant see the image in my html file.

There is no shortage of tutorials and samples on this subject.
Essentially, what you're trying to do involves two PHP files, not just the one that you have. You'll need one for the page and one for the image (which can be re-used for all images).
Start by taking a look at the HTML that's rendered for your page. What is the img tag referencing? It's looking for a resource (image file) on the server that isn't there, so naturally it's not displaying anything. Your server logs will also show you the 404 errors for those image requests.
This is because the image isn't really part of the page. It's an entirely separate resource that the page is just referencing, the browser's job is to put it in place. So you need to create a separate resource (PHP file) to serve that image.
My PHP is a bit rusty, so I'll defer to the many examples and tutorials online for the specifics. But the structure would basically be as such:
Page A, the host page:
Fetch from the database information about the image. Its ID, its alt text if applicable, etc. Use this information to build the img tag. Something like:
echo '<img src="/images/dbimage.php?id=' . $id_from_db . '" alt="' . $alt_from_db . '"/>';
Page B, the image page:
Fetch the actual image (blob) from the DB and its content-type if that's also dynamic. Write no output before this is done. Set the response header's content-type to the content-type of the image, write the raw image bytes as output, end the output.
The main thing to remember, again, is that the image isn't being sent to the browser as part of the page. It's an entirely separate resource fetched from an entirely separate request to the server. You just need to handle that request separately from the page itself.
(Note, for example, that if you then navigated to the URL generated for the img tag then the server would display just the image. The host page isn't needed.)

Related

How would I go about creating content on a unique url page that is not created until an image is clicked?

I've created a simple website on which you can register, then log-in and be able to upload images which are then displayed on the index page. Each displayed image leads to a url
uploads/".$imagePath."
which displays the image in it's full size in a new url. Unfortunately that url only contains the image but I would like to include image information, header, footer, etc. Obviously if the url led to a page that I have created, I could simply include header,footer and the stuff I need but since it's unique for every image, I have absolutely no idea what to do about it. Here's my code
echo "<br>"
.$getResult['name'].'<br><br>'
."<a href='uploads/".$imagePath."'>".'<img class="uploadedImg" src="'.$image .'" alt="Random image" /></a>'."<br><br>"
.$getResult['description']."<br><br>"
.$getResult['date']."<br><br>"
.$getResult['author']."<br><br>";
For each image, instead of giving image as hyperlink to large image, give a hyperlink to php file as follows:
<a href="imageinfo.php?id=<?php echo $image_id;?>">
<?php echo "<img class='uploadedImg' src=$image alt='Random image' />"?>
</a>
Along with the 'imageinfo.php' file, pass unique id of the large image information row, that is stored in database, which you are planning to include in your header and footer.
In the 'imageinfo.php' file you can access this $image_id as $_GET['image_id']. Using which you can get the data from database and display.
So all the images will be hyperlinked to same 'imageinfo.php' file but based on the id send with it the Large image and its associated header and footer can be fetched from database and displayed.
Happy Coding!

Some linked images not working in HTML

I have PHP code that generates HTML code which makes a grid of images. The images are taken from links that are generated for each new image, I also add 133x100 at the end of the image link to resize it on the page. My problem is that a seemingly random selection of images won't display, and I just get a broken image symbol. For example:
This is a link to an image that is generated on my page and is displayed.
This is a link to an image that will not be displayed.
I am only allowed to post 2 links, but removing the %20.%20/133x100 from the end of the last link will show what the picture should be.
Here is the part of the code for the image source:
function display_images(){
//This cycles through each image and displays it as HTML
while($row = $item->fetch()){
Echo "`<img src= '$link[Image_Link] . /133x100' />`"
}
}
It is then called here in a class which puts the images in a grid:
<ul class="rig columns-4">
<?php
display_images();
?>
</ul>
Seemingly about every 2/20 images won't work, and seeing all the links are in the same format, I don't understand why they won't work, and it just seems random.
EDIT: I have noticed that the links that work have 62fx62f at the end of them before the added %20.%20/133x100. If I add it to the raw link in the right place, it makes the image work. But using that generated link, the image still won't load on the page. So using a link with a working image will not work on the page. (This is the same with the raw link without %20.%20/133x100, that links to an image but also won't work on the website)
When visiting the links, the urls look like this:
http://www.example.com/image/randomcharacters%20.%20/133x100
The links work without the %20.%20 at the right dimensions, like so:
http://www.example.com/image/randomcharacters/133x100
This leads me to believe that it may work if you try using the following for the image source instead:
<img src= '$link[Image_Link]/133x100' />
The full code would look like this, for the while function:
while($row = $item->fetch()){
echo "<img src= '" . $link['Image_Link'] . "/133x100' />";
}
I am not aware of steamcommunity much but from the looks of it, i think you should try this.
Instead of putting
. /133x100
Use
/133fx100f
So your URLs would be
while($row = $item->fetch()){
echo "<img src= '" . $link['Image_Link'] . "/133fx100f' />";
}
Just did some trial and error and found out. No explanations for this though!!

Retrieving image file location from database not displaying

Ok, so here is what I am looking to do...I want to be able to upload a picture to the specified folder, and the path is inserted into the database(That part is done)
Then I need to pull the images from the database and display them on the index.php page. I know it's a simple process but I must be missing something.(grrr) I just can't seem to get the image to display on the index.php page, I can display the file location on getimage.php and echo out the image, but can't seem to reference the location to the img src and get it to display on index.php
Here is the code for the index.php page:
I want to be able to pull the image from getimage.php and display the image on the index.php page.
<a href="gallery.html">
<img src="getimage.php?id=18" alt="" width="200" height="133" /></a>
Here is the getimage.php page:
<?php
include("connect.php");
$id = mysql_real_escape_string($_GET['id']);
$sql = mysql_query("SELECT * FROM pictures WHERE p_id='$id'");
while($row = mysql_fetch_array($sql))
{
header("content-type :image/jpeg");
$image = $row['image'];
echo $image;
}
?>
So what this script is going to do is:
On the index page there are 3 pictures, there will be preset slots in the database for them. The user will be able to change these 3 photos anytime by uploading another photo (the upload script will update the old ones with the new ones.) the pictures will be displayed by their ID.
I could simply run 3 queries, 1 for each ID but I was thinking maybe i'm missing an easier way to do it.
Help is very much appreciated...Thank you.
(Yes I am aware of SQL injection as well as deprecation)
Your code is absolutely not correct correct. You have to change the line to :
echo '<img src="data:image/jpeg;base64,'
.base64_encode($image['file_data']).'" width=300 height=200/>";

Can I use multiple Content-type's on same page?

I have this php code that grabs binary( blob ) data from the database and displays as an image in a browser. However, everything after this is ignored. Is there a way that I can also use text queries/forms/tables? Basic HTML elements on the same page?
Having a page that can only display a picture from the DB and nothing else is useless to me.
<?php
$mysqli=mysqli_connect('localhost','root','','draftdb');
if (!$mysqli)
die("Can't connect to MySQL: ".mysqli_connect_error());
$imageid= 1;
$stmt = $mysqli->prepare("SELECT PICTURE_ID FROM display WHERE INDEX_ID =?");
$stmt->bind_param("i", $imageid);
$stmt->execute();
$stmt->bind_result($image);
$stmt->fetch();
header("Content-Type: image/jpeg");
echo $image;
?>
No, you can only have one Content-Type per page.
What you should do is simply create another page, that contains both an image (with src pointing to the code you showed) and the form you want to display, like this:
<html>
<body>
<div>
<img src="image.php" alt="image retreived from DB" />
</div>
<form>
<input type="text" name="foo" />
...
</form>
</body>
</html>
When using a header content of an image type, the only information that can be displayed on this page is the image itself. It is possible though to use a sub-php script inside of a large script, and have the sub-script return the image header, and then have the regular script do other things with this.
Sou you could do this: <img src="\path\to\php\script" /> inside of your other script and it would work as you want it to.
You can't have multiple content-types in one http response.
To make a page with a picture from your DB you can make a regular page and use one of these options for your img tags:
src="your_picture_script.php?pic_id=xxxx" - 'your_picture_script.php' will be pretty much the example in your question.
src="data:image/jpeg;base64,<?php echo base64encode($image);?>" - $image is the actual jpeg file.
Why aren't you displaying the image in an <img> tag? Then writing the other HTML elements below it?
The Content-Type header tells the browser which type of data it is going to display. You can display images in HTML, not HTML in images (unless it's an image of HTML code).

have img src = dl-main.php?f=filename.jpg retrieve said image from remote server

I am trying to do the following; dynamically pick a server with the image on it, and then show said image in img src="". Yeah I know, I am horrible at explaining stuff like this but this should clear it up:
dl-main.php (on server0.domain.com)
$url = 'http://server2.domain.com/offerimage.php?f='.$_GET["f"];
header( 'Location: '.$url ) ;
offerimage.php (on server2.domain.com)
//Lots of link-protection stuff here
$f = "/".$_GET["f"];
$url = 'http://server2.domain.com'.$uri_prefix.$m.'/'.$t_hex.$f;
echo' <img src="'.$url.'"></img> ';
dl.php (on many other servers)
img src="http://server0.domain.com/dl-main.php?f=lalala.gif"
So it pretty much goes like this: Random person adds img src directing to dl-main.php?f=filename on server0. server0 then decides which server will provide the image. In the above example I am using only one server; server2
Now I simply want dl.php to show the photo hosted on server2.domain.com .
As it stands when I directly visit dl-main.php it succesfully redirects me to dl.php, which then succesfully shows me the image I requested. But when I use dl-main.php in a img src it doesn't show the image. I didn't expect it to work but it was worth a shot, but now I don't know what to do anymore :o
I hope this failed attempt is a good example of what I'm trying to accomplish here.
Thanks!
Here's the problem. You call image from server0 using:
<img src="http://server0.whatever/dl-main.php?f=thatimage.something" />
Where the dl-main.php code redirects to server2. Here, you do:
echo' <img src="'.$url.'"></img> ';
So basically the original img tag would get another img tag instead of the image data. That's why the browser can't render the image. You should echo the content of the image instead of an img tag.
Try using your browser's developer tools and check the request to server2 to verify my guess.
It can't work, your second script (offerimage) is producing text/plain, you should produce image/...in order to use img

Categories