使用php和jquery进行验证码动态更新

Question

对此提出任何建议表示感谢。 需要动态更新php脚本生成的验证码图像， 当点击“captcha_refresh”时。 以下是我尝试实现它的方式。不幸的是，这种方法仅适用于Google Chrome， 和其他浏览器似乎不明白这一点。

HTML

<img class="captcha_image" src="http://localhost/shop/create_image.php"/>
<a class="captcha_refresh" href="http://localhost/shop/create_image.php">
    <img src="http://localhost/shop/images/captcha_refresh.png"/>
</a>

JQuery的

$('a.captcha_refresh').live('click', function (event) {
    event.preventDefault();
    $('img.captcha_image').attr('src', $(this).attr('href'));
});

PHP打印图像：

header("Content-Type: image/jpeg");
ImageJpeg($captchaImage);

方法如：$('#someButton').click(function() { $('#someDiv').load('captcha.php'); }); 建议PHP: Reloading the captcha image from javascript 不管用。 谢谢你的关注。

Answer 1

向图像源添加随机查询字符串：

$('img.captcha_image').attr('src', $(this).attr('href') + '?rand=' + Math.random());

您还应该向图片发送Cache-Control和Expires标头，并指示浏览器不应该缓存图片：

<?php
header("Content-Type: image/jpeg");
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT");   // Date in the past
// rest of your image generation code

Answer 2

尝试使用更通用的语法：

$('.captcha_refresh').click(function () {
   $('.captcha_image').attr('src', $(this).attr('href'));
   return false;
});