javascript - firebase cloud function CORS error with axios request - Stack Overflow

admin管理员组

文章数量:1356413

I have a generic cloud function:

const functions = require('firebase-functions');
const cors = require('cors')({ origin: true });

exports.helloWorld = functions.https.onRequest((request, response) => {
    cors(request, response, () => {
        res.status(200).send("Hello from Firebase!");
    });
});

And I am calling it from a client using axios:

  axios
    .get(
      ";,
    )
    .then((res) => {
      console.log(res);
    })
    .catch(er=>{
      console.log(er);
    })

And I have 2 issues:

1. I get CORS error.

Access to XMLHttpRequest at 'https://myurl/helloWorld' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. xhr.js?b50d:178 GET net::ERR_FAILED

2. If i turn on the cors plugin from the browser or if i call the function from postman I get this error:

Error: Forbidden Your client does not have permission to get URL /helloWorld from this server.

Error: Request failed with status code 403 at createError (createError.js?2d83:16) at settle (settle.js?467f:17) at XMLHttpRequest.handleLoad (xhr.js?b50d:61)

And the thing is that I am both authenticated user and I have the cors package in the cloud code.

I have a generic cloud function:

const functions = require('firebase-functions');
const cors = require('cors')({ origin: true });

exports.helloWorld = functions.https.onRequest((request, response) => {
    cors(request, response, () => {
        res.status(200).send("Hello from Firebase!");
    });
});

And I am calling it from a client using axios:

  axios
    .get(
      "https://us-central1-dev-imcla.cloudfunctions/helloWorld",
    )
    .then((res) => {
      console.log(res);
    })
    .catch(er=>{
      console.log(er);
    })

And I have 2 issues:

1. I get CORS error.

Access to XMLHttpRequest at 'https://myurl/helloWorld' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. xhr.js?b50d:178 GET https://us-central1-dev-imcla.cloudfunctions/helloWorld net::ERR_FAILED

2. If i turn on the cors plugin from the browser or if i call the function from postman I get this error:

Error: Forbidden Your client does not have permission to get URL /helloWorld from this server.

Error: Request failed with status code 403 at createError (createError.js?2d83:16) at settle (settle.js?467f:17) at XMLHttpRequest.handleLoad (xhr.js?b50d:61)

And the thing is that I am both authenticated user and I have the cors package in the cloud code.

• javascript
• node.js
• firebase
• google-cloud-functions
• cors

Share Improve this question Follow edited Jul 9, 2020 at 15:31 Doug Stevenson 318k3636 gold badges456456 silver badges473473 bronze badges asked Jul 9, 2020 at 15:26 Giannis SavvidisGiannis Savvidis 78244 gold badges1616 silver badges3636 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

Could possibly not be CORS related. Check firebase function logs to see if you have any errors in your code.

https://stackoverflow./a/51103084/5781575

Is needed to add the following to handle CORS requests in your Cloud Function:

exports.corsEnabledFunction = (req, res) => {
  // Set CORS headers for preflight requests
  // Allows GETs from any origin with the Content-Type header
  // and caches preflight response for 3600s

  res.set('Access-Control-Allow-Origin', '*');

  if (req.method === 'OPTIONS') {
    // Send response to OPTIONS requests
    res.set('Access-Control-Allow-Methods', 'GET');
    res.set('Access-Control-Allow-Headers', 'Content-Type');
    res.set('Access-Control-Max-Age', '3600');
    res.status(204).send('');
  } else {
    res.send('Hello World!');
  }
};

You can try with this example. This is the guthub repo where is the plete code.

本文标签： javascriptfirebase cloud function CORS error with axios requestStack Overflow