Is there a way to convert a Blob object to a JSON object in Javascript?

let dataFile = new Blob([response.data], {type: 'application/json'});

Within the response.data is a JSON file. My goal is to extract the contents of this file and set them as a JSON string to a variable in JavaScript.

I've experimented with different methods like FileReader.readAsText(dataFile) but I'm struggling to convert it into a simple JSON string.

On a side note, the response.data is in arraybuffer format. So, if there is a more direct conversion method available without having to create a Blob object, that would also resolve the issue.

javascriptjsonapi

Answer №1

const document = new Blob([response.data], {type: 'application/json'});

document.text()
        .then(data => {
           this.dataObject = JSON.parse(data);
           console.log(this.dataObject);
         })
         .catch(error => {
           console.log("Encountered an issue: " + error);
         });

Solved the problem for me.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

The Angular data table is encountering an issue as the dataStream.pipe function is not recognized

I'm currently working on setting up a table using Angular data table, but I've run into an issue related to the dataSource. I'm seeing an error message that says "dataStream.pipe is not a function", and I'm having trouble resolving it. ...

jsonangularmaterial-design

Sending a object as an argument to a function

Could someone please help me understand the purpose of passing an object as a function parameter? I have been trying to learn Next.js and they frequently use this method in their code. If anyone could provide a brief explanation of why this is done, it wo ...

javascriptreactjsnext.js

Show a notification from within an action script on a separate document

Looking for advice on my php action file: <?php session_start(); require 'config.php'; if (isset($_POST['action']) && $_POST['action'] == 'signup') { $stmt1 = "SELECT * FROM users where username=&apo ...

javascriptphpjquerymysql

Patience is key when letting AJAX calls complete their execution in jQuery functions

In each of my 3 functions, I have a synchronous AJAX call. Here is an example: function() { a(); b(); c(); } a() { ajaxGet(globals.servicePath + '/Demo.svc/GetDemoList/' + sessionStorage.SessionId,function(data, success) {}, '&apos ...

javascriptjqueryajax

Enclose an image with a <div> element while maintaining the <div> height at

Encountering a challenge where positioning an element on top of an image at specific coordinates (20% from the top and 30% from the left) is required. Initially, the solution involved wrapping the image in a div with a relative position and using absolute ...

javascriptjqueryhtmlcss

Inquiry regarding JSON data format

I am receiving the following response when I console.log(result): {"MSG":"WRONG","QUESTIONID":182.0} However, when I specifically target result.QUESTIONID and console.log it, I get: undefined Can anyone point out what mistake I am making? ...

jqueryajaxjson

Shine a spotlight on elements that match with jQuery using live() or on()

Check out my jsFiddle demonstration where I have created a button that adds elements and provides links to delete these elements. Instead of actually deleting the elements in this example, I want to make it so that hovering over the (remove) link, which is ...

javascriptjqueryhtmlcss

Magento issue with unresponsive image map functionality

My website is built using the Ultimo theme in Magento, and I have implemented a script from to make the image map responsive. Here is the HTML code: <img name="sale" src="sale_1.jpg" width="1180" height="200" id="sale" usemap="#m_sale" alt="" />< ...

javascriptjquerymagentoresponsive-design

retrieving data from identical identifiers within a loop

Within my while loop, I am retrieving various dates for each event. <?php while( have_rows('_event_date_time_slots') ): the_row(); ?> <div> <h3 class="date-<?php echo $post->ID?>" name="tttdate<?php e ...

javascriptphpjquery

"Concurrency issues arise when using multiple AJAX calls in jQuery, causing confusion with

This piece of JavaScript code involves a series of AJAX calls to my FastCGI module in order to retrieve certain values. However, there seems to be an issue where the value intended for display in "div2" is ending up in "div1", and vice versa, ultimately ca ...

javascriptjqueryajax

How can I show or hide all child elements of a DOM node using JavaScript?

Assume I have a situation where the HTML below is present and I aim to dynamically conceal all the descendants of the 'overlay' div <div id="overlay" class="foo"> <h2 class="title">title</h2> ...

javascripthtmlcss

After the checkbox is clicked, I must send a boolean value to the function through the input flag in AngularJS

<input class="bx--toggle" id="toggle-view" type="checkbox" ng-model="vm.monthView" ng-change="vm.getRelevantData()" ng-attr-data-modal-target="{{vm.alertForSaveAll ? '#add-save-all-alert-modal': 'undefined'}}"> Within this p ...

javascripthtmlangularjs

What is the method for closing an <iframe> element directly?

A web page called room.html contains a table with an onclick function named place(): function place() var x = document.createElement("IFRAME"); x.setAttribute("src", "loading.html"); document.body.appendChild(x); } What is ...

javascriptjquery

Adjust the transparency of a separate image within a different container by hovering over another image container

Is my goal too complex to achieve? I am attempting to create a hover effect where the opacity of artwork1 and button1 changes simultaneously when hovered over. However, I am having trouble properly labeling my elements and getting them to interact as inten ...

javascriptjquerycsshover

When the modal is closed, the textarea data remains intact, while the model is cleared

My challenge involves a simple modal that includes a text area. The issue I am facing is resetting the data of the textarea. Below is the modal code: <div class="modal fade" ng-controller="MyCtrl"> <div class="modal-dialog"> <d ...

javascripthtmlangularjstwitter-bootstrap

The issue of the useRef object returning undefined in React/React-Native is causing confusion during

Every time I attempt to access the ref object, I keep receiving an error stating that it is 'undefined'. My goal is to map through an array of images and use useRef to access each individual one. To start off, I initialized the useRef like this: ...

javascriptreactjsreact-nativereact-hooks

A Node.js function may not provide a response immediately due to a pending request

Here is a simple upload method using node.js and express.js: upload: function(req, res, next){ // Loop through each uploaded file async.each(req.files.upload, function(file, cb) { async.auto({ // Create new path and unique file ...

javascriptnode.jsexpress

What causes the discrepancy in the output of `document.documentElement.childNodes` in JavaScript?

While working on my code exercise today, I came across a special case regarding the "document.documentElement.childNodes" property. Originally, I believed it to represent all child nodes within a tag as before. However, when implementing my code, I noticed ...

javascriptdomdocument

Angular rxjs: Wait for another Observable to emit before subscribing

My setup involves having 2 subscriptions - one is related to my ActivatedRoute, and the other is from ngrx Store. ngOnInit() { this.menuItems$ = this.store.select('menuItems'); this.menuItems$.subscribe(data => { this.menuItem ...

javascriptangulartypescriptrxjs

MongoDB Integration of Collections - No Data Population

Having trouble merging a client and an account collection. When I use res.send(client), only the account id's are returned. Unsure how to include account information in clients. Have seen one to many solutions, but struggling with this two-way relati ...

javascriptnode.jsmongodbexpress