在 wordpress 自定义插件中生成 captcha 图片时，直接使用 `header('content-type: image/png')` 会导致输出冲突（因 wordpress 已发送 http 头），应改用 base64 内联方式嵌入图像，避免 headers already sent 错误和图片损坏问题。
在 WordPress 环境中，PHP 脚本通常运行于已启动输出缓冲、且 WordPress 主循环已发送 HTTP 响应头的上下文中。因此，像传统 PHP 独立脚本那样在 CAPTCHA 生成逻辑中调用 header('Content-type: image/png') 并直接输出二进制图像流（如 imagepng($image)）是不可行的——它会触发 “Headers already sent” 错误，并导致 zuojiankuohaophpcnimg> 标签加载失败（显示为破损图或仅显示 alt 文本）。
✅ 正确做法是：在插件方法内完成图像创建 → 将 PNG 数据写入内存或临时文件 → 编码为 Base64 → 以内联 data: URL 形式嵌入 HTML。无需外部 .php 图片脚本，彻底规避头信息冲突与路径/权限问题。
以下是推荐的完整实现方案（整合至 WordPress 插件类中）：
// 在插件主类中添加生成 CAPTCHA 图像数据的方法
public function CAPTCHA_generate() {
session_start();
$permitted_chars = 'ABCDEFGHJKLMNPQRSTUVWXYZ';
$string_length = 6;
$captcha_string = $this->generate_string($permitted_chars, $string_length);
$_SESSION['captcha_text'] = $captcha_string;
// 创建图像资源
$image = imagecreatetruecolor(200, 50);
imageantialias($image, true);
// 渐变背景色
$red = rand(125, 175); $green = rand(125, 175); $blue = rand(125, 175);
$colors = [];
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];
// 使用 WordPress 插件目录下的字体（确保路径可读）
$font_path = plugin_dir_path(__FILE__) . 'fonts/Acme.ttf';
if (!file_exists($font_path)) {
// 回退到系统默认字体（Linux/macOS）或提供备用方案
$font_path = '/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf';
if (!file_exists($font_path)) {
// 若仍失败，用 GD 内置字体（无抗锯齿，但保证可用）
for ($i = 0; $i < $string_length; $i++) {
$letter_space = 170 / $string_length;
$initial = 15;
imagestring($image, 5, $initial + $i * $letter_space, rand(15, 30), $captcha_string[$i], $textcolors[rand(0, 1)]);
}
ob_start();
imagepng($image);
$imgData = ob_get_clean();
imagedestroy($image);
return $imgData;
}
}
// 使用 TTF 字体绘制文字
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)], $font_path, $captcha_string[$i]);
}
// 关键：不输出 header，而是捕获 PNG 二进制数据
ob_start();
imagepng($image);
$imgData = ob_get_clean();
imagedestroy($image);
return $imgData;
}
// 辅助函数：安全生成随机字符串
private function generate_string($input, $strength = 6) {
$input_length = strlen($input);
$random_string = '';
for ($i = 0; $i < $strength; $i++) {
$random_string .= $input[mt_rand(0, $input_length - 1)];
}
return $random_string;
}
// 短代码回调函数
public function CAPTCHA_shortcode_function() {
ob_start();
$imgData = $this->CAPTCHA_generate();
?>
<div class="elem-group">
<label for="captcha">Please Enter the Captcha Text</label>
<img src="data:image/png;base64,<?php echo esc_attr(base64_encode($imgData)); ?>"
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}"
title="Exactly 6 uppercase letters" required>
</div>
<?php
return ob_get_clean();
}? 关键注意事项：
- ✅ 禁止单独 PHP 文件作为 img src：如 src="CAPTCHA-generate-image.php" 易受 WordPress 重写、权限、session 初始化时机影响，且无法共享当前请求的 session；
- ✅ 始终使用 ob_start() + ob_get_clean() 捕获图像数据，而非写入文件（避免并发/清理风险）；
- ✅ 字体路径必须使用 plugin_dir_path(__FILE__) 动态解析，并做存在性校验；
- ✅ 对 base64_encode() 输出使用 esc_attr() 安全转义，防止 XSS；
- ✅ 验证码文本需存入 $_SESSION 并在表单提交时比对（此部分需在验证逻辑中补充）；
- ⚠️ GD 扩展必须启用（检查 extension=gd），且支持 imagettftext()（即 FreeType 库已编译）。
该方案完全符合 WordPress 最佳实践：零外部依赖、无头信息冲突、可复用、易调试，是生产环境中可靠部署 CAPTCHA 的标准方式。
