Convert text/csv file to blob [Angular 7 / Java]

Viewed 1346

I am trying to convert text / csv to blob so that the user can download the csv file by clicking the button.

What I have: There is an API (Java 8 with RESTEasy), when accessing one of the POST methods, text / csv is returned at the output: Postman response headers Postman response body This method in Java API:

    @POST
    @Path("/export")
    @Consumes("application/json")
    @Produces("text/csv")
    public Response exportToCsv(Table table)
    {
        InputStream temp = table.exportToCsv(";");
        StreamingOutput res = new StreamingOutput() {
            @Override
            public void write(OutputStream output) throws IOException, WebApplicationException {

                IOUtils.copy(temp, output);
                temp.close();
                output.close();
            }
        };

        return Response.ok().encoding("utf-8").entity(res).build();
    }

There is a web client on Angular 7 and we will discuss the problem in it ... Clicking on the button triggers the following code (In my APP component) .ts:

     exportSourceTableToCsv () {

       this.api.postExportToCsv (this.tableSource.toTable ())
       .toPromise ()
       .then (res => this.saveFile (res));
     }

     public postExportToCsv (table: Table): Observable <any> {
        return this.httpClient.post <any> (apiConfig.EXPORT_TO_CSV, table);
     }
     
     saveFile (response) {
       // Here I understand the problem place
       const blob = new Blob ([response._body], {type: 'text/csv'});
       saveAs (blob, "table.csv"); // File-saver plugin from npm to save files.
     }

When calling the last method, an error is displayed:

    ERROR Error: Uncaught (promise): HttpErrorResponse: {"headers": {"normalizedNames": {}, "lazyUpdate": null}, "status": 200, "statusText": "OK", "url": " http: // localhost: 4200 / table / export "," ok ": false," name ":" HttpErrorResponse "," message ":" Http failure during parsing for http: // localhost: 4200 / table / export ", "error": {"error": {}, "text": "1; 2; 33 \ r \ n23; 23; 33 \ r \ n213; 321; 33 \ r \ n123; 3; 33 \ r \ n213 ; 123; 33 \ r \ n "}}
    at resolvePromise (zone.js: 831)
    at resolvePromise (zone.js: 788)
    at zone.js: 892
    at ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 423)
    at Object.onInvokeTask (core.js: 17280)
    at ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask (zone.js: 422)
    at Zone.push ../ node_modules / zone.js / dist / zone.js.Zone.runTask (zone.js: 195)
    at drainMicroTaskQueue (zone.js: 601)
    at ZoneTask.push ../ node_modules / zone.js / dist / zone.js.ZoneTask.invokeTask [as invoke] (zone.js: 502)
    at invokeTask (zone.js: 1744)

Response in Postman from the api:

How can I fix this? I saw many examples with exactly the same approach, should work     I tried to explicitly specify the charset and also text as the source type when creating a Blob - didnt help. The type of return value for the method in the API is not very important for me, but I'd like to use the text/csv

Thanks!

0 Answers
Related