Georgi B. Nikolov
Georgi B. Nikolov

Reputation: 998

Difficulties with posting data to Google Firebase HTTP Functions

I am trying to POST some variables as part of req.body to a Firebase Cloud Function. I am using the modern fetch() syntax as following:

const { licenseCode } = this.state;
fetch('https://myAPI.com/inputLicense', {
  method: 'POST',
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify({ licenseCode })
})

And here is how my Cloud function looks:

exports.inputLicense = functions.https.onRequest((request, response) => {
  // const { licenseCode } = request.body
  console.log(request.get('content-type'))
  console.log('query', request.query)
  console.log('body', request.body)
})

Unfortunately, all of the above logging produces empty objects or undefined in the case of the first line. In a usual Express setup, I know I need to use:

app.use(bodyParser.json()); // for parsing application/json
app.use(bodyParser.urlencoded({ extended: true })); // for parsing application/x-www-form-urlencoded

But don't know how to do it with cloud functions. Google claims in their Docs they parse my requests automatically, based on the header but I just can't get it to work.

Any help is more then welcome, thanks in advance.

Upvotes: 1

Views: 778

Answers (2)

Thomas
Thomas

Reputation: 309

It seems like you solved the problem, but for anyone else having a problem. In my case the problem was the firebase cloud function triggering on the cors preflight request which contains no body.

I solved it by removing the application/json content-type in the fetch call and decoding the json body manually in the cloud function

// on the client
fetch(functionURL + '/' + name, {
    body: JSON.stringify({abc: 123}),
    method: 'POST',
    mode: 'cors',
})

// on the server
functions.https.onRequest(async (req, res) => {
    const {abc} = JSON.parse(req.body)
    res.set('content-type', 'application/json')
    res.set('Access-Control-Allow-Origin', '*')
    res.status(200)
    res.send({result: abc})
})

Upvotes: 3

Renaud Tarnec
Renaud Tarnec

Reputation: 83191

I've done some tests and apparently the problem comes from the object destructuring.

The following should work:

const obj = { licenseCode: this.state };
fetch('https://myAPI.com/inputLicense', {
  method: 'POST',
  headers: {
    "Content-Type": "application/json"
  },
  body: JSON.stringify(obj)
})

Upvotes: 0

Related Questions