CODEWITHSUNDEEP
javascriptangulartypescriptblobangular9
avishekdr
avishekdr

Reputation: 1068

How to read a blob data as file in Angular?

I have an API that is fetching this kind of data:

JVBERi0xLjcNCiW1tbW1DQoxIDAgb2JqDQo8PC9UeXBlL0NhdGFsb2cvUGFnZXMgMiAwIFIvTGFuZyhlbi1VUykgL1N0cnVjdFRyZWVSb290IDE4IDAgUi9NYXJrSW5mbzw8L01hcmtlZCB0cnVlPj4vTWV0YWRhdGEgMTAxIDAgUi9WaWV3ZXJQcmVmZXJlbmNlcyAxMDIgMCBSPj4NCmVuZG9iag0KMiAwIG9iag0KPDwvVHlwZS9QYWdlcy9Db3VudCAyL0tpZHNbIDMgMCBSIDE0IDAgUl0gPj4NCmVuZG9iag0KMyAwIG9iag0KPDwvVHlwZS9QYWdlL1BhcmVudCAyIDAgUi9SZXNvdXJjZXM8PC9Gb250PDwvRjEgNSAwIFIvRjIgOSAwIFIvRjMgMTEgMCBSPj4vRXh0R1N0YXRlPDwvR1M3IDcgMCBSL0dTO

This is not the full data showed (the actual is quite long)

I want this data to be viewed as a file, it can be anything like an image, pdf, video, zip, etc.

What problem is if I set the responseType of the API to arraybuffer I need to convert the response data to BLOB but for that, I need the file Type also which I am not having.

Is there any solution to view the data directly as a file?

Upvotes: 1

Views: 5848

Answers (1)

Michael Kang
Michael Kang

Reputation: 52867

Try file-saver:

npm install file-saver

and

import { saveAs } from 'file-saver';
var blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
FileSaver.saveAs(blob, "hello world.txt");

Upvotes: 1

Related Questions