# \[SOLVED\] Trouble with POST method in Fetch

**URL:** <https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949>\
**Category:** General\
**Created:** [February 2, 2017, 2:44am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949 "2017-02-02T02:44:46Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![codefu-chivy](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/codefu-chivy/32/67050_2.png) [@codefu-chivy](https://forum.freecodecamp.org/u/codefu-chivy)\
**Post date:** [February 2, 2017, 2:44am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/1 "2017-02-02T02:44:46Z")

</div>

I’m currently working on the voting app and I’m getting most of the components to work except one where I’m sending the identity of the user to the server via the fetch API. When the component loads I call fetch:

```auto
componentDidMount = () => {
        fetch("/user", {
            method: "post",
            body: JSON.stringify({
                user: this.context.user.username
            })
        });
    };

```

And on the server I handle the request, but the value of “req.body” is undefined. I tried using the bodyParser.json method to parse it but it’s not working. Can anyone help? Thanks in advance.

---

<div class="post-metadata">

**Author:** ![joesmith100](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/joesmith100/32/34933_2.png) [@joesmith100](https://forum.freecodecamp.org/u/joesmith100)\
**Post date:** [February 2, 2017, 9:56am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/2 "2017-02-02T09:56:11Z")

</div>

Hi @codefu-chivy

I noticed you have said it’s solved but haven’t elaborated so I’ll answer just in case 😁

REStful methods need to be all caps, so you want to amend it to `method: "POST"`.

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [February 2, 2017, 10:07am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/3 "2017-02-02T10:07:36Z")

</div>

> [@joesmith100](#):
>
> REStful methods need to be all caps

Actually `fetch` works fine with lowercase methods.

What’s missing is header.

```auto
fetch('/user', {
    headers: {
      'Content-Type': 'application/json'
    },
    method: 'POST',
    body: JSON.stringify(...)
  })

```

---

<div class="post-metadata">

**Author:** ![joesmith100](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/joesmith100/32/34933_2.png) [@joesmith100](https://forum.freecodecamp.org/u/joesmith100)\
**Post date:** [February 2, 2017, 10:12am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/4 "2017-02-02T10:12:37Z")

</div>

Ahh, content-type, I don’t actually think I’ve used fetch to post data, usually axios which sets the headers automatically for you. Good catch

---

<div class="post-metadata">

**Author:** ![codefu-chivy](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/codefu-chivy/32/67050_2.png) [@codefu-chivy](https://forum.freecodecamp.org/u/codefu-chivy)\
**Post date:** [February 2, 2017, 10:19am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/5 "2017-02-02T10:19:59Z")

</div>

Thanks for the replies!! Yeah I was struggling to figure out why they body was empty, but all I had to do was specify the content type in the header.

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [February 2, 2017, 10:53am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/6 "2017-02-02T10:53:49Z")

</div>

Also be aware that `fetch` doesn’t work on iOS, Safari and IE ([http://caniuse.com/#search=fetch](http://caniuse.com/#search=fetch)).  
You’ll need to polyfill (I use [whatwg-fetch](https://www.npmjs.com/package/whatwg-fetch)).

---

<div class="post-metadata">

**Author:** ![codefu-chivy](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/codefu-chivy/32/67050_2.png) [@codefu-chivy](https://forum.freecodecamp.org/u/codefu-chivy)\
**Post date:** [February 2, 2017, 11:04am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/7 "2017-02-02T11:04:07Z")

</div>

I’m not quite familiar with the concept of a polyfill. So based on this documentation, all I really need to do is install and add this module in webpack, leaving everything else the way it was?

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [February 2, 2017, 11:23am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/8 "2017-02-02T11:23:29Z")

</div>

You should install `whatwg-fetch, exports-loader, imports-loader` and add to webpack.

```auto
const path = require('path');
const webpack = require('webpack');

module.exports = {
  entry: [
    // fetch polyfill to support iOS
    'whatwg-fetch',
    path.join(__dirname, 'src', 'index.js')
  ],

  output: {
  ...
  },

  module: {
  ...
  },

  plugins: [
    new webpack.ProvidePlugin({
      // fetch polyfill to support iOS
      'fetch': 'imports-loader?this=>global!exports-loader?global.fetch!whatwg-fetch'
    })
  ]
};

```

---

<div class="post-metadata">

**Author:** ![codefu-chivy](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/codefu-chivy/32/67050_2.png) [@codefu-chivy](https://forum.freecodecamp.org/u/codefu-chivy)\
**Post date:** [February 2, 2017, 8:14pm UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/9 "2017-02-02T20:14:41Z")

</div>

Thanks! Is there any word on when it will be officially supported by browsers like safari and IE? It seems kind of strange for such a great API to have such a gaping hole in terms of cross-browser compatibility.

---

<div class="post-metadata">

**Author:** ![michealhall](https://avatars.discourse-cdn.com/v4/letter/m/59ef9b/32.png) [@michealhall](https://forum.freecodecamp.org/u/michealhall)\
**Post date:** [February 3, 2017, 3:50am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/10 "2017-02-03T03:50:45Z")

</div>

IE is dead. Replaced with Edge. It will never be supported there. Don’t know about Safari. Apple has really been dragging their feet improving it.

---

<div class="post-metadata">

**Author:** ![michealhall](https://avatars.discourse-cdn.com/v4/letter/m/59ef9b/32.png) [@michealhall](https://forum.freecodecamp.org/u/michealhall)\
**Post date:** [February 3, 2017, 3:51am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/11 "2017-02-03T03:51:48Z")

</div>

Oh … And it’s altogether common for great APIs to not be universally supported, unfortunately.

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 16, 2021, 11:33am UTC](https://forum.freecodecamp.org/t/solved-trouble-with-post-method-in-fetch/82949/12 "2021-01-16T11:33:38Z")

</div>

Closed on January 16, 2021, 11:33am UTC


