通过jQuery AJAX获取图片

Question

以下是我的登录页面中的图像标记

<img id="CaptchaImg" alt="Captcha" src="@url.action("Captcha","Login")" style="" />

现在当我刷新登录页面时，它能正常工作并从控制器获取图像，但是当我注销并重新渲染登录页面时，控制器方法没有被调用。问题只出现在IE上，在Chrome上运行良好。有没有解决办法？我能否通过jQuery Ajax调用控制器来解决这个问题？我尝试了这个方法，但成功方法没有被调用。还有其他方法吗？

$.ajax({
    type: "GET",
    url: '/Login/CaptchaImage',
    datatype: "image",
    success: function(data) {
        debugger
        $('#CaptchaImg').attr('src', data);
    }
});

- Paul Alwin

---

你为什么要像这样使用 img 的 src 属性 "@url.action("Captcha","Login")"？ - Imad Alazani

Answer 1

试一试

$.ajax({
    type: "GET",
    url: '@Url.Action("Captcha","Login")',
    dataType:"image/jpg",
    success: function (data) {
        $('#CaptchaImg').attr('src', data);
    }
 });

- Amit

---

数据类型应该是 dataType 吗？ - Imad Alazani

url.action 应该是 Url.Action 吗？ - Imad Alazani

感谢您的回复，现在控制权已经传递到成功函数，但数据格式不正确，可能是由于错误的数据类型。 "Captcha" 方法返回类型为 "FileContentResult" 的对象。那么 "image/jpeg" 是否正确？ - Paul Alwin

请检查您是否返回JPG/GIF格式的图像，如果是JPG格式则可以运行，否则请更改数据类型为dataType: "image/gif"。参考链接- http://msankhala.wordpress.com/2012/08/29/loading-image-through-ajax/http://forums.asp.net/t/1758165.aspx/1 - Amit

这里有一个小bug - 如果你期望返回image/jpg，你需要设置contentType: 'image/jpg'。 - Mark S

Answer 2

Web服务器应该返回Base64数据。就像这样

{ base64Data:"blahblahblah" }

你的ajax请求内容类型可以是纯json; 在ajax的success函数中，你可以这样做

    success:function(data){
     var src="data:image/png;base64,"+data.base64Data;
      $('#CaptchaImg').attr(src,src)
}

- Vincent