Javascript IE 9/10/11某些未知阈值后不渲染图像

我正在构建一个应用程序，从SharePoint 2013或SharePoint 2010中提取文件，以便以HTML格式查看。在C#中，文件从SharePoint（多页文档，如Word、Excel、PDF、TIFF等）中取出，然后输入各种第三方软件（DataLogics和Aspose）-这些软件将文档分解为各自的页面，然后以PNG格式将各个页面流式传输到浏览器

所以在HTML中，我们有一个img元素，它的src被设置为ASHX服务中的特定URL。ASHX服务从SharePoint中获取文件，并根据查询字符串参数以流的形式返回所需的页面

下面是我们反击的方式：

[WebService(Namespace = "url")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
public class FileTransfer : IHttpHandler, IReadOnlySessionState
{
    public void ProcessRequest(HttpContext context)
        var stream = GetStream(context.Request);
        int chunkSize = 2097152; //2MB
        byte[] chunk = new byte[chunkSize];
        int bytesRead = 0;

        do {
            bytesRead = stream.Read(chunk, 0, chunkSize);
            HttpContext.Current.Response.OutputStream.Write(chunk, 0, bytesRead);
        }
        while (bytesRead > 0);
}

当我们要分解的文件直接来自SharePoint时，这在任何浏览器中都能100%完美地工作

我们还提供了一个用户可以上传文档的功能。这就是问题所在。上载的文档未保存在SharePoint中。相反，它们的数据存储在SessionState中，直到用户选择保存。文件上载到ASMX服务，然后浏览器通过上述ASHX请求其单独页面

文件在ASMX服务中按如下方式上载：

[WebMethod(EnableSession = true)]
[ScriptMethod(ResponseFormat = ResponseFormat.Json)]
Public object Upload()
{
    var request = HttpContext.Current.Request;
    if (request.Files.Count == 1)
    {
        var uniqueId = request["uniqueId"];
        var file = request.Files[0];

        using (var memoryStream = new MemoryStream())
        {
            file.InputStream.CopyTo(memoryStream);
            docInfo = UploadItem(uniqueId, pageNum, memoryStream.ToArray());
        }
    }
}

UploadItem将uniqueId和字节[]添加到SessionState

文件是这样从javascript发送的（FileUpload与type=file输入的更改事件相关联）：

在这种情况下，Chrome和Firefox正常工作，但IE再次失败。除此之外，IE的NET选项卡显示它收到了正确大小kb的响应。但是，它仍然显示损坏的图像图标，并且在一些未知阈值之后不会将图像渲染到屏幕上。最初的几个图像会回来，但一旦其中一个图像中断，其余的图像都会中断

我还修改了ASHX服务以返回base64数据而不是流，然后将base64绑定到src。在调试器中，您可以看到分配给显示断开图像图标的img元素的src的base64。所以数据确实存在，但IE只是没有呈现它

我尝试在SharePoint环境之外的地方，使用击倒JS在这个小提琴中重现这个问题。基本上，我抓取了大量的大图像，每次点击按钮都会把它们扔到屏幕上。但它工作得很好。如果我也使用jQuery，它就可以完美地工作

不知道从这里到哪里去

---

有什么想法吗？

结果是图像大小导致了问题。我在服务器端将图像缩小到缩略图大小，并将其返回到浏览器。目前一切正常

this.FileUpload = function (files) {
    var upload = new XMLHttpRequest();
    upload.onreadystatechange = () => {
        if (this._curUploadRequest.readyState == 4) {
            // handle response
        }
    };

    UpdateFormDigest((<any>window)._spPageContextInfo.webServerRelativeUrl,(<any>window)._spFormDigestRefreshInterval);

    var data = new FormData();
    data.append("uniqueId", uniqueId);
    data.append("pageNum", pageNum);
    data.append("data", files[0]);

    upload.open('POST', "myurl");
    upload.setRequestHeader("X-RequestDigest", $("#__REQUESTDIGEST").val());
    upload.send(data);
};

<img src="url to ASHX service" />

var img = new Image();
img.onload = function(){
   // use jquery to append image to page
};
img.src = "url to ASHX service";