Odtnhj

I want to make a fetch request to an API that accepts different types of body requests: twitter handle, facebook link, phone number, etc. The structure of the body is:

body: 
 "typeOfHandle": "input"

Since there are different types of handles, I test the input type and assign it to the body accordingly, as seen below:

// handle is the input
let atSign = /^[@]/, 
 handleIsTwitter = atSign.test(handle.value),
 handleType;

handleIsTwitter ? handleType = `"` + "twitter" + `"` : console.log("not twitter");
let abc = `"` + handle.value + `"`;
let bodyOfFetch = `$handleType: $abc`;
console.log("body: " + bodyOfFetch);
fetch("xxx", 
 method: "POST",
 headers: 
 Authorization: "xxx"
 ,
 body: JSON.stringify(bodyOfFetch)
 )
 .then(function(res) 
 return res.json();
 )
 .then(function(json) 
 console.log(json);
 );

However, this method returns a body malformed error. When I do the request statically (i.e. replace the variables with static text, e.g. "twitter": "@alex") it works. I double-triple-quadruple checked the syntax, I don't think that is the problem. Can it be an issue on the API's side?

In your example bodyOfFetch is a string ("twitter": "@alex"). Either you can send it directly, this is:

fetch("xxx", 
method: "POST",
headers: 
 Authorization: "xxx"
 ,
body: bodyOfFetch
)

Or you can send a stringify object:

fetch("xxx", 
method: "POST",
headers: 
 Authorization: "xxx"
 ,
body: JSON.stringify([handleType]: abc)
)

But sending JSON.stringify(bodyOfFetch) will stringify a json string, this will add surrounding " and escape existing quotation marks: "\"twitter\": \"@alex\""

Hope this helps.