I am trying to parse the json data from an input field on my node.js server. If I simply have the value 16 as a value in the input field, I can simply read it out with request.body.id (<input type="hidden" id="id" name="id" value="16"/>). But when I stringify a json as a value of the input field and parse the data of json, I always get an error SyntaxError: Unexpected end of JSON input at JSON.parse (<anonymous>). But I can see in the browser console my json data <input type="hidden" id="id" name="id" value="{" a":0.3,"b":0.5,"c":1.3}"> Why can't I read the value of the input field with request.body.id?
Asked
Active
Viewed 679 times
0
Thorben C.
- 23
- 6
-
Please post the string that causes the parser error. Add a `console.log` before `JSON.parse`. – jabaa Sep 30 '21 at 13:55
-
You're probably only sending `{`. The attribute is `value="{"`. Replace `value="{" a":0.3,"b":0.5,"c":1.3}"` with `value="{\" a\":0.3,\"b\":0.5,\"c\":1.3}"` – jabaa Sep 30 '21 at 13:57
-
@jabaa I have already tried it, but I always get nothing back. I only get an open curly brace without closing brace. `{` But as I mentioned, I can see my json in the browser inspection. – Thorben C. Sep 30 '21 at 13:59
-
@jabaa How can I do that? I have an object like this `data = {a: 1, b:2, c:3}`and then stringify it like this `var json = JSON.stringify(data)` – Thorben C. Sep 30 '21 at 14:03
-
I don't understand how this is related to the question. In the question you have hardcoded JSON in HTML that causes a specific problem. A possible solution is in my answer. Are you generating the HTML with something like `''` in JavaScript? – jabaa Sep 30 '21 at 14:07
-
@jabaa yes. I have it in a string template like this `''` – Thorben C. Sep 30 '21 at 14:12
-
@jabaa No, I can see in browser inspection my json like this `value="{" a":0.3,"b":0.5,"c":1.3}"`. But in my Javascript I have this `value="${json}"/>`. – Thorben C. Sep 30 '21 at 14:18
-
@jabaa Thank you, it helped. It works when I use `value='${json}'`. – Thorben C. Sep 30 '21 at 14:23
-
It won't work if the JSON contains a single quote. You can try `{ "a": "This won't work" }` – jabaa Sep 30 '21 at 14:23
2 Answers
0
You need to send only the JSON data to the server while calling the respective endpoint in the front-end application. You should not send the html directly to the node js end-point
Shravya
- 192
- 2
0
The tag
<input type="hidden" id="id" name="id" value="{" a":0.3,"b":0.5,"c":1.3}">
contains the attributes
type="hidden"
id="id"
name="id"
value="{"
and some garbage
a":0.3,"b":0.5,"c":1.3}"
because the first quote in your JSON closes the attribute.
You have to masquerade the quotes
<input type="hidden" id="id" name="id" value="{" a":0.3,"b":0.5,"c":1.3}">
After clarification in the comments here is a working example:
const json = JSON.stringify({" a":0.3,"b":0.5,"c":1.3});
document.body.innerHTML = `<input value="${json.replaceAll('"', '"')}">`;
const input = document.querySelector('input');
console.log(JSON.parse(input.value));
jabaa
- 5,844
- 3
- 9
- 30