将数据转换为 csv 文件并将其存储在 azure blob 存储中 angular 7

Question

我需要将数据导出到 csv 文件并将其存储在 azure blob 存储中。 我只能将数据转换为 csv 文件并通过以下方法下载。 但就我而言，我不需要下载它，而是将其保存在 azure blob 存储中。

html

<input type="submit"" (click)="generateCSVfile(data)"/>

TS

downloadFile(data: any) {
    const replacer = (key, value) => value === null ? '' : value; // specify how you want to handle null values here
    const header = Object.keys(data[0]);
    let csv = data.map(row => header.map(fieldName => JSON.stringify(row[fieldName], replacer)).join(','));
    csv.unshift(header.join(','));
    let csvArray = csv.join('\r\n');

    var blob = new Blob([csvArray], {type: 'text/csv' })
    saveAs(blob, "myFile.csv");
}

Answer 1

如果要将数据导出到 csv 文件中，然后将其存储在 azure 存储 blob 中，则有两个步骤。

1. 将数据导出到 CSV 文件但不要下载

请参阅此处的代码。 有关于 angular7-csv 的官方文档。

dtHolidays :any;    
csvOptions = {
        fieldSeparator: ',',
        quoteStrings: '"',
        decimalseparator: '.',
        showLabels: true,
        showTitle: true,
        title: 'Your Holiday List :',
        useBom: true,
        noDownload: true,  //If true, disables automatic download and returns only formatted CSV
        headers: ["Holiday ID", "Holiday Date", "Holiday Comment", "Holiday Status"]
      };

ngOnInit() {
    //Your data for download in csv file.
    this.dtHolidays =[
      {"id": 101, "Holiday_Date": "21/02/2019", "Holiday_Comment": "company holiday calendar of 2019. ", "Holiday_Status": "Active"}
    ]; 
  }

formatCSV(){
    //this.dtHolidays : DATA , HolidayList : CSV file Name, this.csvOptions : file options
    new  AngularCsv(this.dtHolidays, "HolidayList", this.csvOptions);
  }

2. 将文件上传到 Azure 存储 blob

这是上传文件到Azure存储的function，参考样例。

public async uploadBlobToStorage (file: File): Promise {
    const anonymousCredential = new AnonymousCredential();
    const pipeline = StorageURL.newPipeline(anonymousCredential);
    const serviceURL = new ServiceURL(
      `PASTE BLOB SERVICE SAS URL HERE`,
      pipeline
    );
    const containerName = "files";
    const containerURL = ContainerURL.fromServiceURL(serviceURL, containerName);
    const blobName = `${file.name}-${new Date().getTime()}`
    const blobUrl = BlobURL.fromContainerURL(containerURL, blobName);
    const blockblobURL = BlockBlobURL.fromBlobURL(blobUrl);
    const options = {blockSize: this.getBlockSize(file), parallelism: 10, progress: (transferProgressEvent: TransferProgressEvent) => {
      this.onProgressChanged(transferProgressEvent, file, this._uploadProgressSource);
    } };
    const blobUploadCommonResponse = await uploadBrowserDataToBlockBlob(Aborter.none, file, blockblobURL,options);

    return blobUploadCommonResponse;
  }