# HTTP POST Request sending incorrect Content-Type

**URL:** <https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650>\
**Category:** Libraries\
**Created:** [August 27, 2019, 3:43pm UTC](https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650 "2019-08-27T15:43:10Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![n055](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/n055/32/5466_2.png) [@n055](https://discourse.processing.org/u/n055)\
**Post date:** [August 27, 2019, 3:43pm UTC](https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650/1 "2019-08-27T15:43:10Z")

</div>

Hey y’all, I’m making a processing sketch to interact with an API that I wrote in node.js using express.js as my web service. When sending GET requests, all is splendid, due to the information being contained in the URL, but when attempting to send a POST request, the data within the request seems to only be in a plain text format, which is unable to be parsed properly by my API.

Here’s a simplified version of the server in node (you must install node (obviously) , express, and body-parser):

```auto
const express = require('express');
const app = express();
const parser = require('body-parser');
const port = 8080;

//app.use(parser.json('text/plain')); //set the json content type option for body-parser
app.use(parser.text());
app.post('/', function(request, response){ //this method responds to requests made to the server URL with no additional paths
    console.log(JSON.stringify(request.body, null, 2)); //log the request body (parsed with body-parser) (stringified with indentation format to make reading it easier)
    response.send(JSON.stringify(request.body)); //send the received body (casted to string) pack to client
    response.end(); //terminate response
});

app.listen(port, function(){
    console.log('server is listening on ' + port);
}); //make the server listen on specified port

```

And here is the cut-down sketch (must install http.requests library by @shiffman and @runemadsen ):

```auto
import http.requests.*;

public void setup(){
  PostRequest post = new PostRequest("http://localhost:8080/"); //make new POST request object directed to local server on port 8080
  
  post.addHeader("Content-Type", "text/plain");
  post.addData("firstValue", "someValue"); //add data to request
  post.addData("secondValue", "anotherValue");
  post.send(); //send request
  
  println(post.getContent()); //print response
  
  noLoop();
  
}

public void draw(){
  
}

```

this sketch receives the response:

> “firstValue=someValue&secondValue=anotherValue”

This is unable to be parsed by body-parser and returns “undefined” for “request.body.firstValue”

when the Content-Type in the POST header is changed to

> post.addHeader(“Content-Type”, “application/json”);

There is no content in the body of the received request whatsoever:

> {}

and, when in the server the JSON body-parser is used with:

```auto
app.use(parser.json('application/json'));

```

I can tell that it receives the data, but it is unable to be parsed. I get the following error:

> SyntaxError: Unexpected token f in JSON at position 0  
> at JSON.parse ()  
> at createStrictSyntaxError (C:\Users\nosson\nodeServer\node\_modules\body-parser\lib\types\json.js:158:10)  
> at parse (C:\Users\nosson\nodeServer\node\_modules\body-parser\lib\types\json.js:83:15)  
> at C:\Users\nosson\nodeServer\node\_modules\body-parser\lib\read.js:121:18  
> at invokeCallback (C:\Users\nosson\nodeServer\node\_modules\raw-body\index.js:224:16)  
> at done (C:\Users\nosson\nodeServer\node\_modules\raw-body\index.js:213:7)  
> at IncomingMessage.onEnd (C:\Users\nosson\nodeServer\node\_modules\raw-body\index.js:273:7)  
> at IncomingMessage.emit (events.js:203:15)  
> at endReadableNT (\_stream\_readable.js:1129:12)  
> at process.\_tickCallback (internal/process/next\_tick.js:63:19)

The unexpected token f is certainly referring to “firstValue”, but it is not recognized as being part of a JSON object and therefore cannot be properly parsed.

So, if you know anything about how to manipulate http.requests to send proper JSON, or how to have body-parser properly parse the text/plain content, please lend your help, I’d greatly appreciate it

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [August 27, 2019, 5:47pm UTC](https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650/2 "2019-08-27T17:47:23Z")

</div>

“SyntaxError: Unexpected token f in JSON at position 0”

That is the “f” in “firstValue”. A guess: it looks like you need to actually send valid JSON. You are just sending two values, which is invalid:

- [https://codebeautify.org/jsonvalidator/cb0d6d54](https://codebeautify.org/jsonvalidator/cb0d6d54)

The data needs to be serialized in [https://www.json.org/](https://www.json.org/) syntax.

- [https://codebeautify.org/jsonvalidator/cb9ba9be](https://codebeautify.org/jsonvalidator/cb9ba9be)

So if instead of addData(“firstValue”) you sent something like addData("[“firstValue’”]") that is valid JSON. Depending on your data, you may need [] or {}, with values or key-values pairs.

There was a past discussion of using Requests more easily using Processing’s built-in JSON tools:

- [https://forum.processing.org/two/discussion/20222/json-in-post-request](https://forum.processing.org/two/discussion/20222/json-in-post-request)

---

<div class="post-metadata">

**Author:** ![n055](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/n055/32/5466_2.png) [@n055](https://discourse.processing.org/u/n055)\
**Post date:** [August 27, 2019, 9:02pm UTC](https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650/3 "2019-08-27T21:02:49Z")

</div>

@jeremydouglass thanks for your reply.

> [@jeremydouglass](#):
>
> The data needs to be serialized in [https://www.json.org/](https://www.json.org/) syntax.
> 
> - [https://codebeautify.org/jsonvalidator/cb9ba9be](https://codebeautify.org/jsonvalidator/cb9ba9be)

I am aware of the necessary format of JSON, and it would seem that most servers utilizing post requests only use JSON in their backend, not plain text. Curiously, I HAVE had POST requests work in other coding projects of mine using just post.addData(“name”, “value”);  
see: [Plaque/Zmanim.pde at master · nossonCotlar/Plaque · GitHub](https://github.com/nossonCotlar/Plaque/blob/master/Zmanim.pde) (line 44)

Additionally, my method of adding data to a post request (presumably automatically serialized into JSON) is supported in the http.requests documentation: [GitHub - runemadsen/HTTP-Requests-for-Processing](https://github.com/runemadsen/HTTP-Requests-for-Processing)

I appreciate your suggested fixes, but none of them put my data in the desired JSON format which is:

> {  
> “firstValue”:“someValue”,  
> “secondValue”:“anotherValue”  
> }

There is a method of doing this without adding any extra shenanigans, as proven with my github code that I have linked, and ideally I’d like to find a way to continue using post.addData() for this.  
If that’s impossible for some reason, I’ll look into more long-winded methods.  
Thanks again

---

<div class="post-metadata">

**Author:** ![n055](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/n055/32/5466_2.png) [@n055](https://discourse.processing.org/u/n055)\
**Post date:** [August 28, 2019, 2:11am UTC](https://discourse.processing.org/t/http-post-request-sending-incorrect-content-type/13650/4 "2019-08-28T02:11:39Z")

</div>

Solved:  
in the node server code, instead of using

> app.use(parser.text(‘text/plain’));

I use

> app.use(parser.urlencoded({ extended: false }));

and in the Processing sketch, the header is set as follows:

> post.addHeader(“Content-Type”, “application/x-www-form-urlencoded”);

this type seems to jive with the request that Processing sends 🙂  
And, I can continue using the dead-easy way to add data:

```auto
PostRequest post = new PostRequest("http://localhost:8080/"); //make new POST request object directed to local server on port 8080
  
  post.addHeader("Content-Type", "application/x-www-form-urlencoded");
  post.addData("firstValue", "someValue"); //add data to request
  post.addData("secondValue", "anotherValue");
  post.send(); //send request

```

and I get the returned data:

> {“firstValue”:“someValue”,“secondValue”:“anotherValue”}

yay \<3