Slideshow with MySQL BLOB images

6

I'm setting up an image manager and I need to display these images on a TV, via the browser for a slideshow.

I can set up a slide show by setting each image's address, but I have several images in the DB, and I'd need to create an array of images to get the slideshow I have it in MySQL.

Here are my codes:

displays.php (displays the image on the screen, is displaying one underneath the other)

<?
//CONECTA AO MYSQL                                               
$conn = mysqli_connect("localhost", "root", "", "tv"); 

//EXECUTA A QUERY                                                
$sql = mysqli_query($conn, "SELECT id_msg, img, departamento FROM mensagem");   

echo "<h2>Exibe imagens cadastradas no BD</h2>";
while ($row = mysqli_fetch_row($sql)) {   
$id    = $row[0];                         
$bytes = $row[1];                         
$tipo  = $row[2];                         

echo "<img src='gera.php?id_msg=".$id."' width='200' height='300' border='1'>";

echo "<br><br></div>";
}


?>

gera.php (generate all images in the database to be displayed by exibe.php )

<?php

//RECEBE PARÂMETRO  
$id = $_GET["id_msg"];  

//CONECTA AO MYSQL                                               
$conn = mysqli_connect("localhost", "root", "Sat3t3ll", "tv"); 

//EXIBE IMAGEM                                                                        
$sql = mysqli_query($conn, "SELECT img FROM mensagem WHERE id_msg = ".$id."");         

$row = mysqli_fetch_array($sql, MYSQLI_ASSOC);    
//$tipo   = $row["tipo"];                        
$bytes  = $row["img"];                        
//EXIBE IMAGEM                                 
header( "Content-type: image/gif");              
echo $bytes;

?>

My idea would be to use this slideshow to display the array of images generated by exibe.php

<html>
<head>
<script src="jquery/jquery.js" type="text/javascript"></script>
<script src="jquery/jcycle.js" type="text/javascript"></script>

<script type="text/javascript">
<!--
$(function() {
$('#slideShow').cycle({ fx: 'fade' });
});
// -->
</script>


</head>
<body>

<div id="slideShow">
<img src="img/foto1.jpg" alt="Primeira Foto" width="300" height="200" />
<img src="img/foto2.jpg" alt="Segunda Foto" width="300" height="200" />
<img src="img/foto3.jpg" alt="Terceira Foto" width="300" height="200" />
</div>

</body>
</html>
    
asked by anonymous 26.01.2015 / 19:12

1 answer

4

You can display the direct stream image in the <img> tag using the src attribute like this: data:image/jpg;base64,stream_codificado....

Do not display.php make an array with all the images, then use it on the slide page.

displays.php

$imagens = array();
while ($row = mysqli_fetch_row($sql)) {   
   $imagens[] = $row;
}

In the file that has the slides, you may need to make an include.php include:

<div id="slideShow">
<?php
    foreach($imagens as $item){
       $img_template = '<img src="data:image/jpg;base64,'. $item[1]. '" alt="Primeira Foto" width="300" height="200" />';
       echo $img_template;
    }
?>
</div>

Based on:

PHP show image BLOB mysqli

Displaying the base64 image from database via php

How to decode a base64 string (gif) into image in PHP / HTML

    
26.01.2015 / 22:38