Wordpress 標題問題（'Content-type：image/png'）;

Question

我正在嘗試將驗證碼放入 wordpress 自定義插件中。

我確實遵循了該教程：

https://code.tutsplus.com/tutorials/build-your-own-captcha-and-contact-form-in-php-.net-5362

<?php
session_start();
 
$permitted_chars = 'ABCDEFGHJKLMNPQRSTUVWXYZ';
  
function generate_string($input, $strength = 10) {
    $input_length = strlen($input);
    $random_string = '';
    for($i = 0; $i < $strength; $i++) {
        $random_character = $input[mt_rand(0, $input_length - 1)];
        $random_string .= $random_character;
    }
  
    return $random_string;
}
 
$image = imagecreatetruecolor(200, 50);
 
imageantialias($image, true);
 
$colors = [];
 
$red = rand(125, 175);
$green = rand(125, 175);
$blue = rand(125, 175);
 
for($i = 0; $i < 5; $i++) {
  $colors[] = imagecolorallocate($image, $red - 20*$i, $green - 20*$i, $blue - 20*$i);
}
 
imagefill($image, 0, 0, $colors[0]);
 
for($i = 0; $i < 10; $i++) {
  imagesetthickness($image, rand(2, 10));
  $line_color = $colors[rand(1, 4)];
  imagerectangle($image, rand(-10, 190), rand(-10, 10), rand(-10, 190), rand(40, 60), $line_color);
}
 
$black = imagecolorallocate($image, 0, 0, 0);
$white = imagecolorallocate($image, 255, 255, 255);
$textcolors = [$black, $white];
 
$fonts = [dirname(__FILE__).'/Acme.ttf'];
 
$string_length = 6;
$captcha_string = generate_string($permitted_chars, $string_length);
 
$_SESSION['captcha_text'] = $captcha_string;
 
for($i = 0; $i < $string_length; $i++) {
  $letter_space = 170/$string_length;
  $initial = 15;
   
  imagettftext($image, 24, rand(-15, 15), $initial + $i*$letter_space, rand(25, 45), $textcolors[rand(0, 1)], $fonts[array_rand($fonts)], $captcha_string[$i]);
}
 
header('Content-type: image/png');
imagepng($image);
imagedestroy($image);
?>

起初wordpress沒有找到字體，但我設法通過錯誤。 然后我通過短代碼調用 html。我得到的只是 alt 和損壞的 img。 如果我直接將腳本放入 function chrome 告訴我我的圖像包含錯誤。 我確實嘗試添加 utf8 編碼並在沒有 header 的情況下傳遞圖像，但這些都不起作用。

    public function CAPTCHA_shortcode_function() {
        ob_start();
        ?>
        <div class="elem-group">
            <label for="captcha">Please Enter the Captcha Text</label>
            <img src="CAPTCHA-generate-image.php" alt="CAPTCHA" class="captcha-image"><i class="fas fa-redo refresh-captcha"></i>
            <br>
            <input type="text" id="captcha" name="captcha_challenge" pattern="[A-Z]{6}">
        </div>
        <?php

        $CAPTCHA = ob_get_clean();

        return $CAPTCHA;

    }

如果您有任何想法，一定是出了什么問題^^非常感謝！

Answer 1

我們確實找到了解決方案：

    imagepng($captcha_image,"captcha_image.png");
    $imgData = file_get_contents('captcha_image.png');
    imagedestroy($captcha_image);

    // $imgData = ob_get_clean();

    return $imgData;

然后在function這樣調用

        ob_start();
        $imgData = $this->CAPTCHA_generate();

        ?>

        <div id="CAPTCHA_box">
            <label for="captcha">Entrez les </label><br>
            <?php echo '<img class="captcha_image" src="data:image/png;base64,'.base64_encode($imgData).'" />'; ?>
            <i class="fas fa-redo refresh_captcha"></i>
            <br>
            <input type="text" id="captcha" name="captcha_challenge" pattern="[A-Z]{6}">
        </div>

        <?php

        $CAPTCHA = ob_get_clean();

        return $CAPTCHA;