Question

我正在开发一个验证码控件，它允许刷新验证码图像。我没有选择将图像存储在服务器上。我为此目的使用ASP.Net MVC。

我的控制器操作代码：

public FileResult GetCaptchaImage()
{

    // Create a CAPTCHA image using the text stored in the Session object.
    CaptchaImage ci = new CaptchaImage(this.Session
        ["CaptchaImageText"].ToString(), 300, 75);
    // Change the response headers to output a JPEG image.
    MemoryStream stream = new MemoryStream();
    ci.Image.Save(stream, ImageFormat.Png);
    stream.Seek(0, SeekOrigin.Begin);
    return new FileStreamResult(stream, "image/png");
}

用于在剃刀视图中显示图像的html代码

<img id="captchaImage" class="img-responsive" src="@Url.Action("GetCaptchaImage","Home")" />

现在，当我点击刷新按钮时，这个img应该会更新。单击该按钮，我使用ajax调用再次调用相同的控制器操作，它返回FileStreamResult。

function RefreshCaptcha() {
$.ajax({
    url: "/Home/GetCaptchaImage"
}).then(function (data) {
    console.log(data);
});

}

现在，使用JQuery，如何在图像中设置响应内容？

请指导。非常感谢。

Answer 1

不需要使用ajax，只需调用相同的URL，但传入no-cache查询字符串，这样它就不会缓存该值，然后更改图像的来源：

$('#captchaImage').attr('src', '/Home/GetCaptchaImage?nc=' + (new Date).getTime(););

在我的示例中，我使用了纪元时间，但您可以简单地使用随机值。

使用ASP.Net MVC中的FileStreamResult显示图像

1 个答案: