header Content-Type does not let you use HTML/CSS

Asked

Viewed 235 times

0

I have this code to overlay two images, one on top of the other

<?php
$img = $_POST['img'];
$user = imagecreatefromjpeg($img);
$mask = imagecreatefromgif('imgs/logo.gif');
$width = imagesx($user);
$height = imagesy($user);
$metade = $width/50;
$altura =  $height/3.4;
imagealphablending($user, false);
imagesavealpha($user, true);
imagecopymerge($user, $mask, $metade, $altura, 0, 0, 620, 360, 60); 
header('Content-Type: image/png');
imagepng($user);
imagedestroy($user);
imagedestroy($mask);
?>
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div id="listra"></div>
    <?php


    ?>
</body>
</html>

Only that the

header('Content-Type: image/png');

not letting use html,css would have some solution?

  • A solution would be to save the image instead of showing it on the screen. Then you wouldn’t need the header. imagepng($user,'imagemgerada.png') and then include 'imagemgerada.php' in HTML. Just be careful with the cache. Depending on the usage, can you put 'imagemgerada.php? incremental counter or time 'not to pick up cache.

2 answers

1

The solution would be, save the script php as a different file, and add it to the script, as any image.

<?php
// imagem_script.php

$img = $_POST['img'];
$user = imagecreatefromjpeg($img);
$mask = imagecreatefromgif('imgs/logo.gif');
$width = imagesx($user);
$height = imagesy($user);
$metade = $width/50;
$altura =  $height/3.4;
imagealphablending($user, false);
imagesavealpha($user, true);
imagecopymerge($user, $mask, $metade, $altura, 0, 0, 620, 360, 60); 
header('Content-Type: image/png');
imagepng($user);
imagedestroy($user);
imagedestroy($mask);
?>

Then just call this image in the img tag, so that it is displayed in the body of that document, because due to content-type defined in the script header, this file, is an image generated via script, and now has the type MIME image/png, which is the same used in normal images.

<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
    <div id="listra"></div>
    <img src="imagem_script.php"/>
</body>
</html>
  • It didn’t work, the image doesn’t appear, I got the link of the image that the user type via post and send to the imagem_script, I think q n would work...

  • Send from a form ?

  • Yes, only an input that takes the link from the image . jpg

  • In case the image to be generated, is the mixture of any image selected locally, and sent from a form ? This is it ?

  • Yes, it takes an image locally, and then overwrites the image (fetched in the link the user typed)

  • Now it worked, but couldn’t I use another header only this time to return home? it generates the image in img.php and stays there...

Show 1 more comment

0


When you send a header Content-type you cannot use more than one file type (image and HTML, in your example). One solution is to encode the generated image on base-64 and display with a data URI, for this it is necessary to control the buffer outgoing imagepng() with the functions ob_*.

In your code remove header('Content-Type: image/png'); and replace imagepng($user); for:

ob_start(); // liga o buffer de saída
imagepng($user);
$imagem = ob_get_clean(); // armazena o conteúdo e desliga  o buffer
$tagImagem = '<img src="data:image/png;base64,' . base64_encode($imagem) . '"/>';

And within the <body>

echo $tagImagem;

Browser other questions tagged

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