I continue to encounter the error "Unexpected token b in JSON at position 0" when attempting to parse JSON data

Having some trouble with my code that generates an HTML page. The signup function allows users to register and create a password, while the checkpassword function is supposed to verify if the correct password is entered for the given username. I seem to be encountering an issue with retrieving data from local storage in my checkPassword function. Any assistance would be greatly appreciated as I've been stuck on this for hours.

const PREFIX = "monash.eng1003.passwordApp.";

function checkPassword() {
  var user = document.getElementById("registerUsername").value;
  var username = document.getElementById("username").value;
  var password = document.getElementById("password").value;
  var passwordToCheck = localStorage.getItem(PREFIX + user);
 
  if (password !== passwordToCheck) {
    alert("Don't hack" + user);
  } else {
    alert("Welcome" + user);
  }
}

function signup() {
  var user = document.getElementById("registerUsername").value;
  var pass1 = document.getElementById("registerPassword").value;
  var pass2 = document.getElementById("confirmPassword").value;
  if ((pass1 === pass2) && (pass1 !== "")) {
    if (localStorage) {
      var passwordToStore = pass1;

      localStorage.setItem(PREFIX + user, passwordToStore);
      alert("Account created for username: " + user);
    }
  } else {
    alert("Passwords must match and cannot be empty.")
  }
}

EDIT: Appreciate the clarification regarding unnecessary parsing since there was no stringification needed. This resolved the issue but unfortunately, I am unable to delete the post, so it will remain here.

Answer №1

There is no need to convert the password to JSON when storing it, so using JSON.parse() when retrieving it is unnecessary. Since you stored a regular string, simply retrieve it and use it as is.

retrievedPassword = localStorage.getItem(PREFIX + username);

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

Is it possible to dynamically insert additional fields when a button is clicked?

My FormGroup is shown below: this.productGroup = this.fb.group({ name: ['', Validators.compose([Validators.required, Validators.maxLength(80)])], desc: ['', Validators.maxLength(3000)], category: ['', Validators.require ...

Position the spinner in the center of the user's screen

I created my own spinner: '''' #spinner-bg-loading{ position: absolute; left: 50%; top: 25%; width: 80px; height: 80px; margin: -75px 0 0 -75px; border: 16px solid #FFFFFF; border-radius: 50%; border-top: 16px solid #1 ...

Customize Material-UI icons dynamically by changing their props in an array

I am looking to change props (color, size) for multiple icons in an array using Material-UI v4: const ICONS_ARRAY: React.ReactNode[] = [ <AlertCircleCheckOutline />, <AppleSafari />, <MotionPlay />, <AppleKeyboardCommand />, <Fil ...

Version discrepancy in module metadata

Yesterday everything was running smoothly with Angular 2 and Angular Material, but today I encountered an error when trying to run the program. Can someone please help? ERROR in Error: Metadata version mismatch for module E:/Demo/crud/ node_modules/ ...

Choosing elements in HTML using jQuery from an Ajax GET response

As a programming student, I am currently working on developing a basic website using HTML, JavaScript, and jQuery for the front-end, while utilizing node.js and Express frameworks for the back-end. In my project, I have used Ajax to retrieve data and then ...

Having trouble transferring information from a form to a page because of the error message " is not defined"?

I'm facing an issue while building a node app. I have set up my routes correctly and installed all the necessary dependencies. However, when I try to load the ("/) "homepage," I receive an error message stating that "newPost" is not defined. Surprisin ...

Retrieve specific JSON information

Below is an example of JSON data: [{ "RM_Name": "Russ Martin", "Division": "East", "RM_Phone": "(603) 491-1259", "RC_Name": "Jacob Sucoff", "RC_Phone": "(800) 247-4154 x3403", "States_Covered": "MT,VT, NH, ME (all firms)", "La ...

Using an `<img>` element as an event handler in a JavaScript function

I'm having trouble setting up a click handler for the search field in my project. I've tried using on() with an img or class, but it's not working as expected. When adding the image using the code below: jQ('#psc').append('&l ...

Internet Explorer 9 does not display content until the ajax/json function has finished executing

I have encountered an issue with my code regarding updating a div element. The first innerHTML call seems to be ineffective and does not render in the browser. However, the second innerHTML call works as expected by appending "Complete" once the ajax call ...

Serialize a form while keeping the submitted data private

Is there a way to achieve serialization without triggering the submit function for an ajax call? I've searched extensively for a solution to this issue without any luck. The java script function is invoked when a button within the form is clicked. do ...

Change HTML canvas data into Angular form data before sending it to the Laravel backend

My JavaScript code to convert a data URL to blob and send it as a form request is: var canv = document.getElementById("mainCanvas"); var dataURL = canv.toDataURL('image/jpg'); documentData = {"image": dataURLtoBlob(dataURL), "gameName": "empero ...

What is the proper placement for index.html <head/> class helper functions within a ReactJS Component?

My custom helper functions are stored in a JavaScript file called classie.js: ( function( window ) { 'use strict'; function classReg( className ) { return new RegExp("(^|\\s+)" + className + "(\\s+|$)"); } var hasClass, ...

I'm having trouble getting my .click method to work with the <div id=menuButton>. Can anyone help me figure out why this is happening?

Here is the HTML code I created for a dropdown menu. Initially, in the CSS file, the menu is set to display: none; <!doctype html> <html> <head> <title>DropDown Menu</title> <link rel="stylesheet" href="normalize ...

What is the best way to create height segments from a cylinder in three.js?

My current project involves a cylinder that is divided into multiple height segments, with the number of segments depending on the specific data. Each height segment contains a value that I want to use for extruding the entire circle at that particular hei ...

Is the each() method in jQuery essentially a for loop?

Experimenting with adding a serialized class to a group of objects, I attempted the following approach: jQuery('#preload img').each(function(){ jQuery('#thumbs').append('<img class="index' + index + '" src="&apos ...

What advantages do constant variables offer when selecting DOM elements?

What is the significance of declaring variables as constant when selecting elements from the DOM? Many developers and tutorials often use const form = document.querySelector('form'); ...

Issues with sending data using ajax

Trying to get weinre working through Ajax by calling this on dom ready: $.ajax({ url: 'http://debug.build.phonegap.com/target/target-script-min.js#hutber', dataType: "script", crossDomain: true, error: function(data){ c( ...

What's the best way to implement a conditional header in React?

I am looking to create a conditional display of the Header based on different pages. Specifically, I want the Header to be hidden on the Home page and shown on other pages like posts page, projects page, etc. I have been brainstorming possible solutions f ...

eslint is designed to not handle multiple package.json files

There are two package.json files in my project root folder └ app ---- /public └ /styles └ /src └ package.json └ eslintrc.json └ webpack.config.js └ server - /something └ /something ...

What factors influence the speed of an Ajax request?

It is common knowledge that the amount of data transmitted to the server, as well as the volume of information returned in a call can greatly affect its speed. However, what I am curious about is whether the following factors might also impact the transmi ...