Set a location in a Https Callable function on Firebase 9 (stripe customer portal)-CodePudding

I'm trying to set up a button for the user to manage his subscription with Stripe Customer Portal and their Firebase's integration.

Problem, the documentation is valid for the old version of Firebase (8) and I'm using the new one, Firebase 9.

We are on the client side and this is React.js.

This is their js code for calling the function (you can see the complete code here: https://github.com/stripe-samples/firebase-subscription-payments/blob/master/public/javascript/app.js):

const functionLocation = 'us-east1';
    
const functionRef = firebase
      .app()
      .functions(functionLocation)
      .httpsCallable('ext-firestore-stripe-subscriptions-createPortalLink');
    const { data } = await functionRef({ returnUrl: window.location.origin });
    window.location.assign(data.url);
  });

With Firebase 9 it should be something like this:

const functions = getFunctions(firebaseApp)

export async function goToBillingPortal() {
       const functionRef = httpsCallable(functions, 'ext-firestore-stripe-subscriptions-createPortalLink');
    
       const { data } = await functionRef({ returnUrl: window.location.origin });
       window.location.assign(data.url);
 }

The console displays 3 errors:

Access to fetch at 'https://us-central1-xxxxxxxxd76.cloudfunctions.net/ext-firestore-stripe-subscriptions-createPortalLink' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: Redirect is not allowed for a preflight request.

service.ts:206 POST https://us-central1-xxxxxxx76.cloudfunctions.net/ext-firestore-stripe-subscriptions-createPortalLink net::ERR_FAILED

Uncaught (in promise) FirebaseError: internal

Apparently, the problem is that I need to specify the location of the server (ex. us-central1) but I can't understand how to it with Firebase 9. All the guides are for Firebase 8.

I've tried different things like:

const functions = getFunctions(firebaseApp).location("us-central1")

const functionRef = httpsCallable(functions, 'ext-firestore-stripe-subscriptions-createPortalLink').location("us-central1")

but it doesn't work.

Ideas?

CodePudding user response：

As shown here in the doc, you should pass the region as the second parameter of the getFunctions() method:

 const functions = getFunctions(firebaseApp, "europe-west1");

CodePudding user response：

One can also define where to deploy with .region(), which I think even accepts a list:

const CLOUD_FUNCTIONS_REGION = "us-east1";

exports.billing_portal = functions.region( CLOUD_FUNCTIONS_REGION ).https.onCall(
    async (data, context: CallableContext) => {
      
    }
);