How to display the image saved in the database in my html code

Question

How to display the image saved in the database in my html code

Asked 6 years, 10 months ago

Viewed 2,316 times

1

I have a mysql database created in phpmyadmin, already saved the path of the pictures there, also in an image table with id and name(img), now I would like to know how to display these images in the respective places in my html code... this is a part of the code where the image q comes from a folder

            <img src="img/pat.png" class="img-responsive" width="300px" height="300px" align="#"></a>
            <div class="caption">
                <p> <h4><b> Restaurante Do Cardoso</b> </h4>
                <p align="justify"> />

there in place of that img/pat.png, I would like to put the path of the image that is saved there in the bank and to display, but I am not able... already create the connection with the database and everything else

Ué, you will need php to get the database data.

– Francisco

2017/12/30 at 12:54
yes I need php, what I do not know is how to make this code which command lines and where to save

– Mariano Ribeiro

2017/12/30 at 12:56
visit this link to see an example https://imasters.com.br/artigo/3831/mysql/cadastrando-e-exibindo-imagens-diretamente-do-mysql-5/? trace=1519021197&source=single

– Maciel Sousa

2017/12/30 at 13:03
I am saving in BD only the image paths, in a field VARCHAR and not BLOB, already visited this link and did all this and even though it did not work, I’m still new in this part of php and database, I know almost nothing

– Mariano Ribeiro

2017/12/30 at 13:08
For you to get it you need to use a server-side programming language.. example of a php.. you already do this ? show your code so you can help more...

– Maciel Sousa

2017/12/30 at 13:12
my code is all html with JS like this... <img src="img/pat.png" class="img-Responsive" width="300px" height="300px" align="#"></a> <div class="caption"> <p> <H4><b> Do Cardoso Restaurant</b> </b> <p align="Justify"> /> the connection part with the database I already did, what I don’t know how to do is the display part of the image in html via a php

– Mariano Ribeiro

2017/12/30 at 13:14
I have already developed everything, but I saw that if you start saving the images inside the folder of the app, it will be very heavy, then I wanted to send to the bank and the bank display in the code, the part of sending to the database the images I have already made, through the path of them, now I just want to pull her from the bank and display on the screen, kind have the name of the restaurant and below the image I want this image coming directly from the database

– Mariano Ribeiro

2017/12/30 at 13:17
this is the app, https://play.google.com/store/apps/details?id=br.com.mariano.jabukatur all his images are inside a folder in the same file and that weighs I wanted those images coming from the bank

– Mariano Ribeiro

2017/12/30 at 13:18

Show 3 more comments

1 answer

Browser other questions tagged php html database metaprogramming

You are not signed in. Login or sign up in order to post.

by Juven_v • **2,619** points · Answer 1 · 2017-12-30T17:27:31+00:00

A simple solution is to create a file .php to manipulate the display of your images. You can create the following url to access your images: obterImagens.php?nome=nome_da_imagem

Html code for image requests

<img src="obterImagens.php?nome=imagem1" class="img-responsive" 
width="300px" height="300px" align="#">

<img src="obterImagens.php?nome=imagem2" class="img-responsive" 
width="300px" height="300px" align="#">

PHP code to return an image

Before the php code, I assume you have a table in the database similar to this:

|nome_imagem|local_imagem|

Assuming the images are saved in a directory in your file system we can return them using the function file_get_contents().

So, going back to php we can do this:

$nome_imagem = $_GET['nome'];
$conexao = mysqli_connect($conexao,'host', 'usuario', 'senha', 'nome_banco');
$consulta = mysqli_query('select * from imagens where nome_imagem = ' 
. "'" . $nome_imagem . "'");
//como o nome da imagem deve ser unico, apenas um registro deveria ser 
//retornado
$resultado = mysqli_fetch_assoc($consulta);

//como o campo local_imagem é o caminho absoluto ou relativo para 
//a imagem fica facil acessa-la agora.
$caminho_imagem = $resultado['local_imagem'];
//suponto que você salva todas as imagens no mesmo diretorio do script
//A varaivel $resultado['local_imagem'] poderia representar 
//apenas o nome da imagem, e você poderia concatenar os dois

 $mime = mime_content_type(__DIR__ . '/' . $caminho_imagem);
 $tamanho = filesize(__DIR__ . '/' . $caminho_imagem);

 header("Content-Type: ". $mime);
 header("Content-Length: " . $tamanho);

 //e por fim você manda para o navegador
 echo file_get_contents(__DIR__ . '/' . $caminho_imagem);

This answer was adapted from a question available in the Sopt. IN THE Soen has a question (with answer) much closer than you want.