0

I am pretty new to PHP and currently using XAMPP. I wanted to create a captcha image using the gd library but then I noticed that all I got was a black screen with a little white box outline at the middle. This is the output in spite of any code used. I have tried different code samples from different websites to no avail. I have confirmed that the gd library has been enabled. I have uninstalled and reinstalled xampp. I have also searched related questions but none of the suggested solutions works for me.

here is my code 

 session_start();

 // Set some important CAPTCHA constants
 define('CAPTCHA_NUMCHARS', 6);  // number of characters in pass-phrase
define('CAPTCHA_WIDTH', 100);   // width of image
define('CAPTCHA_HEIGHT', 25);   // height of image

// Generate the random pass-phrase
$pass_phrase = "";
for ($i = 0; $i < CAPTCHA_NUMCHARS; $i++) {
  $pass_phrase .= chr(rand(97, 122));
}

// Store the encrypted pass-phrase in a session variable
$_SESSION['pass_phrase'] = SHA1($pass_phrase);

// Create the image
$img = imagecreatetruecolor(CAPTCHA_WIDTH, CAPTCHA_HEIGHT); 
$bg_color = imagecolorallocate($img, 255, 255, 255);     // white
$text_color = imagecolorallocate($img, 0, 0, 0);         // black
$graphic_color = imagecolorallocate($img, 64, 64, 64);   // dark gray

// Fill the background
imagefilledrectangle($img, 0, 0, CAPTCHA_WIDTH, CAPTCHA_HEIGHT, $bg_color);

// Draw some random lines
for ($i = 0; $i < 5; $i++) {
  imageline($img, 0, rand() % CAPTCHA_HEIGHT, CAPTCHA_WIDTH, rand() % 
CAPTCHA_HEIGHT, 
  $graphic_color);
}

// Sprinkle in some random dots
for ($i = 0; $i < 50; $i++) {
  imagesetpixel($img, rand() % CAPTCHA_WIDTH, rand() % CAPTCHA_HEIGHT, 
$graphic_color);
}
// Draw the pass-phrase string
imagettftext($img, 18, 0, 5, CAPTCHA_HEIGHT - 5, $text_color, 'Courier New Bold.ttf', $pass_phrase);

// Output the image as a PNG using a header
header("Content-type: image/png");
imagepng($img);

// Clean up
imagedestroy($img);
  ?>

Black screen error image

Edit: I have been able to pinpoint the problem to the header(Content-type) line. Still haven't figured the solution yet.

Lone Wolf
  • 404
  • 3
  • 11

2 Answers2

5

After hours of scouring different forums. I have come to understand the problem better. The problem is not with gd library but rather the header(Content-type) line

When I decide to create an image file rather than sending the image through a header. The correctly displays.

Once I figured that out, finding the solution became easier as now I am looking for the solution in the right place.

The problem is that my PHP script is emitting a UTF-8 byte order mark (EF BB BF) before outputting the PNG image content.

The solution that worked for me was to place ob_clean() before header line.

For more explanation see the link below. https://stackoverflow.com/a/22565248/10349485

I used and pieced together different solutions from different forums to better understand and to arrive at this solution but the link above was my final destination.

I am not deleting the question even though there are other similar questions because of the amount of trouble it took me to get and understand this problem, also because the answers there didn't work for me. Hopefully, this helps someone in the future avoid the trouble I went through.

Lone Wolf
  • 404
  • 3
  • 11
  • I have the same problem. I see a small white box instead of the image. I ran ob_clean() before my headers, however, it did not work. I noticed if I do not run ob_clean() before my headers, I have two white spaces. If I run ob_clean(), I only have 1 white space. Are these white spaces anything to do with the problem, do you think? – spreaderman Jun 27 '21 at 00:50
0

from many days i'm also face this problem but this solution work for me use __DIR__ with your font file path like that

           `$font_path = __DIR__ .'/font.ttf';`
Anshul Saini
  • 1
  • 1
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 25 '22 at 09:39