从服务器处理流并在浏览器中显示文件

我正在尝试找到用于从服务器处理strem文件的全局解决方案。

我的响应对象是Angular HTTP响应

我的对象具有不同的图像/文档等的body。

图像是 @＃$ ..的长字符串，文档是json

我一直在通过网络寻找解决方案，并必须实现此问题：

let contentType = resData.headers.get("Content-Type");
let blob = new Blob([resData.arrayBuffer()], {type: contentType});
let url = window.URL.createObjectURL(blob);
window.open('url: ', url);

此代码下载具有八位字节内容类型的文件但是所有其他文件均未在浏览器中显示。

我的主要目标是如果将返回流的API放置在URL中，并且浏览器知道如何处理它（图像显示在浏览器中，浏览器不支持的文件是自动的，则具有相同的行为。下载等）

这是请求的代码。

return Observable.create(observer => {
            let xhr = new XMLHttpRequest();
            xhr.open(Object.keys(RequestMethod).find(k => RequestMethod[k] === url.method), url.url, true);
            const shift = 
            xhr.setRequestHeader('Content-type', 'application/json');
            xhr.responseType = (Object.keys(ResponseContentType).find(k => ResponseContentType[k] === url.responseType)).toLocaleLowerCase();
            xhr.onreadystatechange = function () {
                if (xhr.readyState === 4) {
                    if (xhr.status === 200) {
                        let blob = new Blob([xhr.response], {type: body.MimeType});
                        observer.next({blob: blob, fileName: body.FileName});
                        observer.complete();
                    } else {
                        observer.error(xhr.response);
                    }
                }
            }
            xhr.send(url.getBody());

这是每种Mimetype特殊处理的代码

handleAttachmentItem(resData) {
    let blob = resData.blob;
    const fileName = resData.fileName;
    if (blob.type.includes('image')) {
        let b64Response = window.URL.createObjectURL(blob);
        let outputImg = document.createElement('img');
        outputImg.src = b64Response;
        let w = window.open();
        w.document.write('<html><head><title>Preview</title><body style="background: #0e0e0e">');
        w.document.write(outputImg.outerHTML);
    } else if (blob.type.includes('text')) {
        let url = window.URL.createObjectURL(blob);
        window.open(url);
    } else {
        let a = document.createElement("a");
        document.body.appendChild(a);
        let url = window.URL.createObjectURL(blob);
        a.href = url;
        a.download = fileName;
        a.click();
        window.URL.revokeObjectURL(url);
    }
}

相关内容

最新更新

热门标签：