如何使用$ .ajax将image src设置为动态图像/ png数据？

使用少量用户输入参数动态生成图像。 通过写入Response.OutputStream ，我能够通过GET成功生成图像

 $('#myImage').attr('src', 'Images/GetImage?param1=value1&param2=value2'); 

还有几个附加参数。 但是，如何通过POST完成此操作？ 我以为我可能会使用$.ajax和base64编码Image ，但它不是很有用。

 $.ajax({ url: 'Images/GetImage64', type: 'POST', data: { param1: 'value1', param2: 'value2' }, success: function (data) { //$('#myImage').attr('src', data); $('#myImage').attr('src', 'data:image/png;base64, ' + data); } }); 

Chrome开发工具向/ Images / GetImage64显示带有text / plain响应的ajax（XHR）POST。 内容类似于服务器上生成的PNG。 但是，使用下面的URL进行了另一个“其他”请求，我不知道发生了什么

 data:image/png:base64, [binary] 

在服务器上，我将返回一个ImageResult : ActionResult ，它覆盖ExecuteResult并使用base64编码的图像进行响应。

 public override void ExecuteResult(ControllerContext context) { context.HttpContext.Response.Clear(); context.HttpContext.Response.ContentType = "text/plain"; context.HttpContext.Response.BinaryWrite(GetBase64Image(Image)); } 

Answer 1

可能是jQuery的错。 尝试强制jQuery将结果视为纯文本，使用dataType: 'text' ：

 $.ajax({ url: 'Images/GetImage64', type: 'POST', dataType: 'text', data: { param1: 'value1', param2: 'value2' }, success: function (data) { $('#myImage').attr('src', 'data:image/png;base64,' + data); } }); 

编辑：没关系，不是那样的。