Data undefined when sending through a POST request

Client.js:

function post(url, data) {
    return fetch(url, {method: "POST", body: data});
}

form.addEventListener("submit", event => {
    let name = form.elements["Username"].value;
    let pass = form.elements["Password"].value;
    let url = "/CreateAccount";
    //let credentials = {name:name, pass:pass}
                                                // credentials var not needed
    let serialized = name + ":" + pass   
    post("https://response-test.glitch.me/CreateAccount", serialized); 
    console.log("client.js: sent", serialized)
    // sendData(serialized)
});
  

relevant section from server.js:


app.post("/CreateAccount", function(request, response) {
    console.log("data received")
    let query = request.query
    console.log(">", query, request.body, request.toString(), typeof(request.body), typeof(request.query))
    response.send(request.query); 
});

log:

image

Why are request.query and request.body undefined and objects, not strings?

Hey @Un-index,

request.query is used only when the URL has parameters and you wish you to obtain those parameter value.

Here’s how I would rewrite your code to make it work:

function post(url, data) {
    return fetch(url, {
       method: "POST", 
       body: data,
       headers: {
         'Content-Type': 'application/json'
       }
    });
}

form.addEventListener("submit", event => {
    let name = form.elements["Username"].value;
    let pass = form.elements["Password"].value;
    let url = "/CreateAccount";
    let credentials = {name:name, pass:pass}
    // let serialized = name + ":" + pass   
    post("https://response-test.glitch.me/CreateAccount", credentials); 
    console.log("client.js: sent", credentials)
    // sendData(serialized)
});

Then on the server side:

app.use(express.json());

app.post("/CreateAccount", function(request, response) {
    console.log("data received")
    let req = request.body;
    let name = request.body.name; // the name that was sent through the post request
    let password = request.body.pass // the password that was sent through the post request

    // Do stuff with these values and optionally send a response with response.send
});

Hope this helps!

1 Like

For some reason I’m getting a 400:

image

do you know the reason?

“Data Received” doesn’t even log, so I assume the issue is on the client-side.

When I remove this part:

it gives a 500 instead, and “cannot read property ‘Name’ of undefined”

Could you check out this page?

1 Like

Didn’t offer much help on how to circumvent the issue in my case, it did give me the idea of sending different data over though and that the data I’m sending might be in invalid format; I’ll try that, thanks.

1 Like

Either the data was not converted to JSON properly or the data had syntax errors due to how it was formatted, how do I fix this?

It’s not being parsed to JSON properly I think.

Edit: fixed it! I figured I’d use JSON.stringify to convert it to a JSON string before sending, it worked! Thanks for the help, @khalby786 and RiversideRocks.

1 Like

Oh yes, I forgot about that part!

1 Like