firebase/quickstart-js

Cors policy no longer allows calling cloud functions from browser.

TrevorBlythe opened this issue · 6 comments

Step 1: Describe your environment

  • Operating system: _____ Ubuntu
  • Browser: _____ Firefox and also tried it on chromium
  • Firebase SDK version: _____ 9.23

Step 2: Describe the problem:

Cloud functions cant be called from the browser because of cors policy.

Steps to reproduce:

Start with an empty directory.
Set up the default firebase web app.
Also, set up the default code for cloud functions.
In Index.html Uncomment the code that tries to call a cloud function, and rename the function to the name of the one in functions/index.js
Try to run the code.
Error.

Observed Results:

From the client side, there is an error it simply wont allow you to call the cloud function because of CORS.

Expected Results:

The cloud function to be called and return a value.

Relevant Code:

public/index.html (the code for calling the function):

                                   firebase
				.functions()
				.httpsCallable("helloWorld")()
				.then(() => {});

functions/index.js:

const { onRequest } = require("firebase-functions/v2/https");
const logger = require("firebase-functions/logger");
const cors = require("cors")({ origin: true });

// Create and deploy your first functions
// https://firebase.google.com/docs/functions/get-started

exports.helloWorld = onRequest((request, response) => {
cors(req, res, () => {
logger.info("Hello logs!", { structuredData: true });
res.set("Access-Control-Allow-Origin", "*");
res.send("Hello from Firebase!");
});
});

The error:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://us-central1-secret-adcf9.cloudfunctions.net/helloWorld. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing). Status code: 500.

error in code

Could you explain which part of your code was in error?
I am stucked with same error

Actually, I changed option to allow to call without security(maybe auth permission at google cloud functions directly)
Then it worked. However it may cause security problem. I want to set back my option as initial state

Dear moon, I was using onRequest() but I think I was supposed to use onCall() and it fixed it for me

Dear TrevorBlythe,
I also made with funcitons onCall() method. maybe it's different kind of problem.
Thank you so much to reply fast.
Have a nice weekend👍

Dear @TrevorBlythe
I'd like to ask just one quick question.
Do you use firebase functions v2?

Thanks