Question

我正在从基于Java的软件包“SimpleCaptcha”

中检索验证码图像

在前端我只是将以下内容放入我的页面中，然后获得验证码图像：

<img src="stickyImg" />

我想使用javascript重新加载此验证码图片。

我试过了：

$("#theclickhandler").click(function(){  
    $("#stickyImg").load('stickyImg', function(response){           
       $("#stickyImg").attr('src', response); 
    });
    return false;
});

这会得到图像，但会输出这样的东西（显然会大大缩短）：

<img src="captcha image�PNG �ݚ��L�23U�݆�}$�J����Dy����IEND�B`� ">

对我来说，这看起来像原始的二进制数据。 如何让它发挥作用？

Answer 1

图像标记的src属性指定要加载图像的浏览器，而不是图像的内容。因此，您将图像的内容填充到您想要位置的位置，这会给您带来垃圾，因为它根本没有意义。

因此，要重新加载图像，您需要告诉浏览器图像的地址已更改。仅将图像的src属性中的位置重写到同一地址是不够的 - 这不会告诉浏览器改变任何东西。您可以通过在查询字符串中填充一些随机数据来克服此问题，例如请求的时间。就像@mikerobi建议的那样，你可以重写src标签，这里修改了在查询字符串中放置一个时间戳（你的servlet几乎肯定会忽略它）：

$('#stickyImg').attr('src', 'stickyImg?' + (new Date().getTime()));

Answer 2

您不能使用该方法加载图像，您需要将图像url属性设置为图像生成器的路径。

$('#stickImg').attr('src', 'path/to/image/generator');

Answer 3

我不知道有多少浏览器支持它，但是可以对图像进行base64编码，在其前面添加（取决于图像格式）“data：image / png; base64”，并将其用作URI对于图像。

验证码图像返回二进制数据？怎么显示这个？

3 个答案: