如何在客户端返回内容类型 image/jpg 和内部 html 字节 []答案

【问题标题】：How to return content type image/jpg and inner html that byte[] in the client如何在客户端返回内容类型 image/jpg 和内部 html 字节 []
【发布时间】：2011-11-19 10:15:13
【问题描述】：

我正在像这样从文件系统中提取一个简单的 jpg ...

            var objz = "C:\\projects\\Desert.jpg";
            byte[] imageSampleData = ReadImageToBytes(objz);
            return imageSampleData;

（读取img到btyes的实现如下）

byte[] ReadImageToBytes(string sPath)
        {
            byte[] data = null;
            FileInfo fInfo = new FileInfo(sPath);
            long numBytes = fInfo.Length;
            FileStream fStream = new FileStream(sPath, FileMode.Open,
                                                    FileAccess.Read);
            BinaryReader br = new BinaryReader(fStream);

            data = br.ReadBytes((int)numBytes);
            return data;
        }

然后我尝试从 ASPNET MVC ActionResult 中返回它，就像这样......

return File(byteArrayFromMethodAbove, "image/jpg");

然后在客户端我尝试像这样设置图像的 src ...

<script type="text/javascript">
    $(document).ready(function () {
        loadImage();
    });

    function loadImage() {
        $.ajax({
            type: "GET",
            url: "http://localhost:49415/Home/About",
            data: {},
            dataType: "jpg",
            success: function (datasrc) {
                $('#fk').attr('src', datasrc);
            }
        });
    }
    </script>

但到目前为止，图像似乎与我在客户端所做的不一致（或者编码完全错误）。目前正在看萤火虫，我确实看到了一些疯狂的数据作为 src，但它似乎不正确。

我在网站上找到了 ton 和 question/answers，但似乎没有一个真正有效

非常感谢任何帮助（使用 MVC 2 和 jQuery 1.4.1）

【问题讨论】：

看起来您正试图将图像的路径指向图像的字节。路径 (src) 应该是 URL。你不能这样做： $('#fk').attr('src', 'localhost:49415/Home/About');出于某种原因，SO 在此评论中插入了一个额外的分号，因此请忽略它。
对不起，我没有提到我在这里使用 Ajax，因为我将返回的不仅仅是图像（一旦我弄清楚了，我将返回一个不只是图像的局部视图）如果我沿着这条路走下去，我需要做什么才能让 Ajax 成为现实？
如果您要返回部分视图，那将是 text/html 内容。这意味着成功函数中的参数将是 html 文本。然后您可以执行以下操作： $('#container').html(datasrc);在您的成功功能中。或者，您可以使用：api.jquery.com/load
正确 - 如果我的模型对象上有类型 image 或 byte[]，我该如何设置 src？既然我想到了，那会让这件事变得容易得多:)
实际上是为了帮助制作 iPhone 应用程序 vNext 我认为能够以二进制文件作为一个项目和其他信息返回 JSON 的能力将是一个加分 - 所以......回到我的第一个问题

标签： jquery asp.net-mvc ajax image

【解决方案1】：

在这里使用 jquery 太过分了。只需设置 src=url 并让浏览器进行下载。

【讨论】：

感谢您提供简单而正确的答案 - 似乎我在这个问题上做了一点过度设计:)
其实在所有情况下它都不是矫枉过正。我的应用程序在 img 中显示进度指示器。然后，该应用程序会尝试检索 jpg。如果 jpg 失败，我将 img 设置为默认图像。您可以判断下载 jpg 是否失败的唯一方法是使用 $.ajax 方法并检查文件大小。只需按照您的建议设置 url 就意味着图像确实存在。如果没有，您最终会得到一个损坏的图像图标。 Toran 的解决方案是正确的，但他忘记添加“data:image/jpg;”。