The function JSON.parse(obj) is malfunctioning and throwing an error, but an online parser is displaying the data correctly

Currently, I am in the process of developing a chatApp for my portfolio. I am working with technologies such as Flask on the back-end and vanilla on the front-end to gain a better understanding of how everything works. My main goal is to display events based on sockets for new users.

When transmitting a list of objects from the Flask back-end to Jinja2 and then manipulating it in a JS file by converting it to a JSON file, I keep encountering errors. Despite trying various REGEX methods to replace single quotes with double quotes and tildes in different combinations, I am still facing issues. Below are some images showcasing the problem I am experiencing.

// Make sure that i parsed an string not object...
let json = JSON.stringify(loggedUsers.textContent.trim());
console.log(json);
//json = jsonCorecter(json);

json = json.replace(/"/g, "`");
json = json.replace(/'/g, '"');
json = json.replace(/`/g, "'");
console.log(json);
console.log(typeof(json));
json = JSON.parse(json);
console.log(json);
console.log(typeof(json));

Answer №1

Alright, so I finally cracked it! I received a string and decided to use the stringify() method to confirm beyond a shadow of a doubt that it is indeed a string. I didn't delve into the specifics of how this function operates, but it seems like it could potentially add extra quotes around our string, causing it to not meet the necessary requirements when passed as an argument into a function...

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

Save data in JSON format to a text file while preserving the formatting

My dataset is formatted in JSON, for example: {"rand":"7542868","action":"get","identity":{"name":"Jack","password":"secret"},"key":"o8sh769f79"} and I have the knowledge to decode it. However, I am struggling with converting it into a txt file that looks ...

I am confused by the combined output of the Array method and join function in JavaScript

In my JavaScript code, I declared the myArr variable in the following way: var myArr= Array(3); Upon logging the value of myArr, I received the output: [undefined × 3] Next, I utilized the JavaScript join function with the code snippet: myArr.join(&a ...

The processing-js library threw a Reference Error indicating that the Navigator could not be found

I am looking to utilize processingJS as an npm package in a nodeJS server for deployment on MS Azure. I am using VS15 and encountering difficulties referencing it: var pjs = require('processing-js'); var http = require('http'), fs = r ...

Utilizing setInterval for automatic page refreshing

I've been working on a setInterval function to continuously check for new comments, select them, and post them. While it's somewhat functional at the moment, it's not behaving exactly as I intended. Currently, what happens is that every thre ...

Firebase Error: Page Not Found

I recently set up an Angular2 application and added Firebase using npm. I successfully imported it into my app.component.ts without any errors showing up in my text editor. The package.json file also indicates that Firebase is installed correctly. However ...

"Troubleshooting Bootstrap nav-pills' failure to update displayed content

I'm currently working on creating a dynamic navbar that updates the content based on which navigation pill is selected. For some reason, the content in my div.tab-content isn't changing as expected... Here is an example of the code I am using: ...

Could someone explain to me why searchQuery.value is coming up as undefined?

Within my development task, I am endeavoring to create a functional search icon on the header bar that allows users to input Pokémon names for searching purposes. Despite my efforts, I am consistently facing a console error message suggesting "searchQu ...

HTML form submission with a grid of multiple choice options

I have created my own multiple choice grid: <div style="overflow-x:auto;"> <table class="w-100"> <tr> <td class="border"></td> <td class="border">Yes</td> <td class="border">No</ ...

Regular Expression - Locate all numerical values within text formatted with HTML

I am attempting to locate all the numbers within an HTML document. However, I want to ensure that I exclude numbers that are part of a word, such as "o365", "high5", and similar instances. Here is my current approach, but it does not successfully avoid w ...

The v-tab-item content is not loading properly when the component is initialized in the mounted hook

I'm working on a project that utilizes Vuetify tabs to showcase two different components under separate tabs. The problem I'm encountering is that, within the mounted() function, when attempting to access the refs of the components, only the ref ...

Surprising results when a class is applied using jQuery

Exploring the differences between two fiddles (make sure to run the code on the jsfiddle pages to see the differences clearly). First Fiddle Simple demonstration: $("body").addClass("noScroll"); alert($("body").hasClass("noScroll")); $("body").removeCla ...

At what point does angular2 @output get resolved?

Click on this link Here is the HTML code snippet: <chart [options]="options" (load)="saveGraphInstance($event.context)"></chart> <div (click)="switchGraph()">switch</div> <div (click)="showLoadingForce()">show loadin ...

Trouble encountered when retrieving dimensions of an image

I am struggling to retrieve image width and height from an object created with PHP using JSON encode. Here is how I generated the objects: $get = mysql_query("SELECT x,y,img,bid FROM player WHERE uid='1'"); while($row = mysql_fetch_assoc ...

Iterating through a series of Axios requests nested within each other to handle pagination in an

I need help iterating through the API response that includes pagination. Below is a snippet of the API response: { count: 165, next: "http://example.com/name?offset=30&per_page=30", previous: null } Here is my useEffect hook: const [datas, se ...

Creating a JSON representation of a List with Jackson's JsonGenerator

Is it possible to use Jackson JsonGenerator to write a list of objects to JSON easily? I have a hashmap structured as Key,List and would like to add a List of Objects without looping through each one individually. I am using Jackson JsonGenerator to creat ...

Sending a POST request to a PHP file in React: A Step-by-Step Guide

Just starting out with reactjs and trying to figure out how to send an ajax request to a server (php file). Here's the structure of my project: check it out here src/index.js import React from 'react'; import ReactDOM from 'react-dom& ...

What causes the Woocommerce checkout button to be blocked on the checkout page?

I am perplexed by WooCommerce's decision to block this section of the screen with an overlay. Under what circumstances would it do so? checkout page screenshot ...

Why is the UI Router controller failing to function properly after loading the view from the $templateCache?

I've been utilizing gulp-angular-templatecache to convert my filename.view.html files into a consolidated templates.js file. Afterwards, I use $stateProvider to define states and fetch the templates from $templateCache, including an abstract "root" s ...

Steps for automatically retrying a failed expect statement in Jest

In my React application, I am utilizing Jest for performing unit testing. One aspect of my application involves a Material UI date picker with next and previous buttons. The selected date is displayed in the browser URL. Each time the user clicks on the ne ...

Having trouble getting npm install to add any libraries? Wondering how to fix this issue?

Currently, I am using Node version 14.15.5, npm version 6.14.11, and working on VS Code. I attempted to install two packages with the following commands: npm install express npm install lodash Unfortunately, neither installation was successful. This ...