No 'Access-Control-Allow-Origin' - Firebase Function

Question

I created a GET request using firebase functions. I can receive data using Postman, but not from my FE application.

While accessing the endpoints i'm getting this error

from origin 'http://localhost:4200' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

My FE Code,

  pay() {
    this.http.get(this.settings.createPaymentRequest).subscribe(res => {
      console.log(res);
    })
  }

Server Code,

exports.createRequest = functions.https.onRequest((req, res) => {
const cors = require('cors')({
  origin: '*'
});
...
var options = {
    method: 'POST',
    uri: 'https://test.instamojo.com/api/1.1/payment-requests/',
    form: payload,
    headers: insta_headers,
    json: true
  };

  return rp(options)
    .then(function (response) {
      console.log(response);
      if (response.success) {

        db.collection('PAYMENT_REQUESTS').doc(response.payment_request.id).set({
          LONG_URL: response.payment_request.longurl,
          REQUEST_CREATED_AT: response.payment_request.created_at,
          PAYMENT_STATUS: "STARTED"
        }, {
          merge: true
        }).then(function () {
          response.setHeader(headers);
          res.status(200).send({
            STATUS: "SUCCESS",
            RESPONSE: response.payment_request.longurl
          });
        })
          .catch(function (error) {
            res.status(200).send({
              STATUS: "ERROR",
              RESPONSE: error
            });
          });



      } else return res.status(403).send('Forbidden!');

    })
    .catch(function (e) {
      console.log("ERROR" + e);
      res.status(200).send({
        STATUS: "ERROR",
        RESPONSE: e
      });
    });
});

Please guide me how to resolve this issue.

score 0 · Accepted Answer · answered Oct 15 '21 at 07:09

0

It looks like you create this

const cors = require('cors')({
  origin: '*'
});

but don't inject it anywhere (unless that is part of the ...)

There should be something like this somewhere

app.use(cors())

(or however your framework does it)

Before trying with your browser again, you can check the response headers in postman to see if the cors headers you are looking for are there:

something like this:

Access-Control-Allow-Origin: *

answered Oct 15 '21 at 07:09

Alex028502

3,486
2
23
50

according to https://stackoverflow.com/questions/42755131/enabling-cors-in-cloud-functions-for-firebase you need wrap your whole response callback with the `cors` constant you have created.. .but this looks a lot easier: https://stackoverflow.com/a/51922520/5203563 – Alex028502 Oct 15 '21 at 07:16
thanks, wrapping all the functions inside the cors did the trick – Calvin Care Oct 15 '21 at 08:24

No 'Access-Control-Allow-Origin' - Firebase Function

1 Answers1