node.js - 从 Node.js 发送的字节数组中以 Angular 下载文件

Question

我想我已经非常接近我想做的事情了。我在 node.js 中有以下 api get 方法，该方法从 SQL Server 数据库检索文件 varbinary(MAX)。它是在插入之前从 Base64 编码的字符串转换而来的，因此内容类型信息已从字符串中删除。

Node .js

router.get('/getFile', (req, res) => {
    console.log("Calling getFile for file " + req.query.serialNumber + ".")
    var serialNumber = req.query.serialNumber;
    let request = new sql.Request(conn);
    request.query('SELECT FileName + \'.\' + FileExtension AS \'File\', FileType, ContentType, SerialNumber, Chart ' +
        'FROM dbo.ChangeFiles ' +
        'WHERE SerialNumber = ' + serialNumber)
        .then(function (recordset) {
            log("Successfully retrieved file " + recordset[0].SerialNumber + " from database.");
            log("Length of blob " + recordset[0].File + " is " + recordset[0].Chart.length)
            res.status(200);
            res.setHeader('Content-Type', recordset[0].ContentType);
            res.setHeader('Content-Disposition', 'attachment;filename=' + recordset[0].File);
            res.end(Buffer.from((recordset[0].Chart)));
        }).catch(function (err) {
            log(err);
            res.status(500).send("Issue querying database!");
        });
});

这很好用，但是我不清楚如何在 Angular 中检索它并提示用户下载，也没有太多在线帮助/资源。这是我迄今为止在服务级别中所拥有的内容。

文件下载.service.ts

downloadFile(serialNumber: string): Observable<any> {
    return this.http.get(this.baseURL + '/getFile', { params: { serialNumber: serialNumber } })
    .map(this.extractFile);
}


private extractFile(response: Response) {
    const file = new Blob([response.blob]);
    FileSaver.saveAs(file);
    // const url = window.URL.createObjectURL(file);
    // window.open(url);
    return file;
}

正如你所看到的，我尝试了几种方法。 extractFile 方法的注释掉部分根本不起作用，并且使用 FileSaver.saveAs 函数会生成未知类型的文件下载，因此从 node.js 发送的 header 似乎不会影响文件本身。

是否有人能够建议如何在 Angular 中继续处理从 node.js 成功发送的内容，以便我可以成功下载文件，无论类型如何？

提前非常感谢。

Answer 1

我终于让它工作了。我必须重新设计 api 调用，以便它单独发送所有文件信息，以便可以将 MIME 类型和文件名分配给组件类中客户端的文件。由于某种原因，当我尝试在 api 中执行所有操作时，它不起作用，所以这就是我的解决方法。这就是对我有用的方法。

node.js API

router.get('/getFile', (req, res) => {
    console.log("Calling getFile for file " + req.query.serialNumber + ".")
    var serialNumber = req.query.serialNumber;
    let request = new sql.Request(conn);
    request.query('SELECT FileName + \'.\' + FileExtension AS \'File\', FileType, ContentType, SerialNumber, Chart ' +
        'FROM dbo.ChangeFiles ' +
        'WHERE SerialNumber = ' + serialNumber)
        .then(function (recordset) {
            log("Successfully retrieved file " + recordset[0].SerialNumber + " from database.");
            log("Length of blob " + recordset[0].File + " is " + recordset[0].Chart.length)
            res.send(recordset[0]);
        }).catch(function (err) {
            log(err);
            res.status(500).send("Issue querying database!");
        });
});

组件类

  downloadFile(serialNumber: string): void {
    this.changeService.downloadFile(serialNumber).subscribe((res: any) => {
      const ab = new ArrayBuffer(res.Chart.data.length);
      const view = new Uint8Array(ab);
      for (let i = 0; i < res.Chart.data.length; i++) {
        view[i] = res.Chart.data[i];
      }
      const file = new Blob([ab], { type: res.ContentType });
      FileSaver.saveAs(file, res.File);
      console.log(res);
    });
  }

服务等级

downloadFile(serialNumber: string): Observable<any> {
        return this.http.get(this.baseURL + '/getFile', { params: { serialNumber: serialNumber } })
        .map(this.extractFile);
    }

    private extractFile(response: Response) {
        // const file = new Blob([response.blob]);
        // FileSaver.saveAs(file);
        // const url = window.URL.createObjectURL(file);
        // window.open(url);
        const body = response.json();
        return body || {};
    }