Transmitting a JSON file to a remote server

I'm currently developing a game in p5.js and I'm looking for a way to allow players to save their game data. I've tried using saveJSON() in p5.js, but it only downloads the relevant data which isn't very helpful in this situation. I also attempted to use JS cookies:

document.cookie = "systems =" + json.systems + "; expires=Thu, 18 Dec 2020 12:00:00 UTC";

However, the data always ends up showing as [object,Object], rendering it useless. Does anyone have any suggestions for saving the game either client-side or server-side without requiring users to upload a file?

javascriptjsonp5.js

Answer №1

If you have an object in javascript, you can easily convert it to JSON using the stringify method.

const jsonString = JSON.stringify(myObject);

To convert a JSON string back to a javascript object:

const myObject = JSON.parse(jsonString);

If you don't need to store this data on a server, consider using web storage. You can save the JSON in web storage like this:

localStorage.setItem("myData", JSON.stringify(myObject));

Then retrieve it from the storage when needed:

const myObject = JSON.parse(localStorage.getItem("myData"));

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

Error encountered while parsing JSON data for a particular string

Seeking a solution: Presenting my data: {Path:5984fcb4-8bf8-4205-86f8-e6e2042ba610.jpg,StatusCode:OK} Unable to convert the string to Json using the method below: var obj = $.parseJSON(data); This website also states that my json is not formatted corr ...

jqueryjsonparsing

The adjustment of camera angles within the `THREE.OrbitControls` method in the three.js framework leads

Initially, the THREE.OrbitControls works well with the default camera position. However, when the camera position and rotation are changed via a button click, the camera's position shifts unexpectedly when trying to rotate the view on the canvas. Cam ...

javascriptcamerathree.jsposition

After replacing content with replaceWith in jQuery, the load event can

Currently, my goal is to use AJAX to load new content and replace the existing content on the page with this newly downloaded information. However, I am facing an issue in binding the load(handler(eventObject)) event for the replaced data. My requirement i ...

javascriptjqueryajax

Exploring deeper into accessing nested properties with Handlebars

I am attempting to utilize handlebars for displaying a list obtained from a complex JSON. The data structure is challenging to navigate, preventing me from accessing the nested property I require. The data structure is as follows: var data = [{ " ...

javascripthtmljsonhandlebars.js

Mocking Ext.Ajax.request in ExtJS 4.2.1 is a process of em

When it comes to frontend unit testing using Jasmine, one of the challenges I faced was mocking all the requests in my application. Luckily, I have already tackled a method to mock all my proxies successfully: proxy: appname.classes.proxy.ProxyNegotiator ...

javascriptajaxextjsextjs4mocking

Is it possible to navigate to an HTML element in the template of a different component?

One of my components contains a navigation bar with a function that allows users to scroll to a specific element on the page. Here is the template for the Navbar: <a class="nav-link" (click)="scroll(services)">Services</a> The code for the N ...

javascripthtmlangular

Unable to trigger JSON success

I am facing an issue with my JSON payload as the success function is not triggering. Any help that can be offered would be greatly appreciated. JLS Although I can see the value in the console, the query seems to be working fine but it is not formatted in ...

phpjsonajax

What is the correct method for checking the balances of various tokens in my MetaMask wallet?

I've been trying to figure out how to check the balance of Alpaca tokens in my MetaMask wallet. After doing some research, I came across a code snippet that I tried to use but it ended up throwing an error: TypeError: contract.balanceOf is not a fun ...

javascriptethereumweb3jsabimetamask

Creating a visual representation of a Google map with directions using JavaScript!

I am attempting to convert the Google Map route into a PNG image using canvas2image. I have successfully created routes between markers on the map using JavaScript. However, when trying to convert the image using html2canvas, I encounter the following erro ...

javascriptjquerygoogle-mapshtml2canvas

There was a TypeError that occurred because the object did not have the 'ajax' method available

When attempting to initialize the quoteResults Javascript function on my Wordpress site, I encounter the following error in my console: Uncaught TypeError: Object #<Object> has no method 'ajax' I have successfully utilized the code below ...

javascriptjqueryajaxmethodstypeerror

The quickest method to modify the anchor element's class depending on the query string

Requirement - I aim to accomplish this task using only pure JavaScript without any additional libraries, although I am open to using one if necessary. I need to assign an extra class to anchor elements that contain a query string of 'xyz=negate' ...

javascriptjqueryhtml

Error in JSON parsing: Unexpected token 'u' at the beginning of the input in Angular2

I attempted to create a server using dummy data. Below is the System.js Config I have implemented (given that my routing is slightly different, this setup has been working well so far) System.config({ // baseURL to node_modules b ...

javascriptangularjsjsonangular

Guide to verifying user identity in Gatsby

I recently went through this tutorial to add authentication to my gatsby project. However, I encountered an issue where the routing was still being done from the pages folder instead of the app.js file after implementing the authentication code. Can someon ...

javascriptreactjsauthenticationgatsby

Display the initial page and activate the first navigation button when the page loads

Greetings to everyone. I am new to the world of jquery and currently in the process of learning. This is my script: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"> </script> <script> $(function () { $ ...

javascriptjqueryhtmlajaxcss

"Modify the MySQL database each time a user changes the value in a

As a student, I am looking to update value(s) whenever a student changes the value(s) in the correction or update form. So far, I have been able to retrieve and display values in text boxes based on the name selected from a dropdown list from the database ...

phpjavascripthtmlmysqlajax

Typescript's Nested Type Assignments

Simply put, I'm making an API call and receiving the following data: { getUserInfo: { country: 'DE', email: '<a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="3c48594f487c59445d514c5059125f5351">[e ...

javascriptnode.jstypescript

Adding data to an array from a JSON source using Angular 5

When I receive a response from an endpoint, it looks like this: { "data": [{ "volume": 4.889999866485596, "name": "Carton03", "weight": 5.75, "storage": 3 }, { "volume": 2.6500000953674316, "name": "Carton02", "weight": 4.5 ...

arraysjsonangulartypescriptparsing

Tips on accessing the v-model value with a parameter in VUE

Looking to access the v-model value using a parameter, I attempted the following code: <template> <div v-for="(item, idx) in data"> <input :id="item" :v-model="item"></input> <button @click=&q ...

javascripthtmlvue.js

What could be the reason behind the failure of JSON.stringify() on this particular array?

I am encountering an issue with an array that I have declared like this: array = []; The array contains values that look like this - .... ChIJOaegwbTHwoARg7zN_9nq5Uc:"ChIJOaegwbTHwoARg7zN_9nq5Uc" ChIJXTwCdefHwoAR9Jr4-le12q4:"ChIJXTwCdefHwoAR9Jr4-le12q4 ...

javascriptarraysjson

React Select only enabling single selection at a time

Currently, I am in the process of updating my react app to version 16.8 and also updating all associated libraries. One issue that has come up is with two drop-down selects from Material UI. Since the update, the multi-select option no longer allows multip ...

javascriptreactjsmaterial-ui