Question

我正在Angular 6 App中使用服务从REST API下载文件（blob）。这项服务完美适用于<10MB的文件（在Chrome和其他浏览器上）。我目前正在尝试下载一个14MB的文件，但该文件失败，仅在Chrome上（可与Firefox配合使用）

我认为这是Chrome的限制，但我无法在SO或Angular文档中找到与此相关的任何信息。

这是我的服务

displayFile(url: string) {
    const headers = new HttpHeaders({ 'Content-Type': 'application/json' });
    this.http.post('my_backend_path/getFile', JSON.stringify({urlData: url}), {responseType: "blob", headers})
      .subscribe((data: any) => {
          var urlBlob = window.URL.createObjectURL(data);
          window.open(urlBlob);
        },
        (error) => {
          //Here comes the error
        });
  }

“我的节点REST API”正确返回状态为200的文件。失败来自Chrome控制台，例如：

POST my_backend_path/getFile net::ERR_FAILED 200 (OK)

在chrome的网络调试器中，我可以看到文件大小估计精确为10.0MB（而该文件实际上在做14MB）。这就是为什么我认为这是由于Chrome或Angular HTTPClient的某些限制所致。

有人有想法吗？

Answer 1

面对完全相同的问题。但奇怪的是，下载在chrome的隐身模式下可以正常工作。您可以尝试相同的方法。

Answer 2

我遇到了这个问题-Chrome在API调用中记录了net :: ERR_FAILED 200（OK），返回的JSON大小超过10mb。令人惊讶的是，它以隐身模式工作，周围没有人受到影响。

我的解决方案是清理C：驱动器。它的磁盘空间不足（大约200 Mb）。清理磁盘后，Chrome开始运行。

Answer 3

我认为您需要将responseType更改为ArrayBuffer。它对我有用

{responseType: "arrayBuffer", headers})

Answer 4

我最近遇到了这个问题。下载采用隐身模式，但无法在普通模型中使用。这是我的建议。像这样将timeout添加到您的通话中：

    const headers = new HttpHeaders({ 'Content-Type': 'application/json' });
    this.http.post('my_backend_path/getFile', JSON.stringify({urlData: url}), {responseType: "blob", headers})
      .pipe(timeout(50000))
      .subscribe((data: any) => {
          var urlBlob = window.URL.createObjectURL(data);
          window.open(urlBlob);
        },
        (error) => {
          //Here comes the error
        });
  }

根据需要从timeout导入import { timeout } from 'rxjs/operators';。您可能需要根据需要安装rxjs-compat软件包依赖项。

Angular无法从Google Chrome浏览器的服务器上下载10MB以上的文件

4 个答案: