Deploy Next.js app on Google Firebase Functions results in 304 and CORS

Question

I'm pretty new to Firebase and have 0 experience with it. I was able to deploy a simple SSR Next.js app with Firebase Functions, but everything but the HTML is blocked. Here are the browser console errors:

GET https://us-central1-***.cloudfunctions.net/_next/static/chunks/webpack-9b312e20a4e32339.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/css/1de8f31efe8bff6d.css 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/chunks/framework-a87821de553db91d.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/chunks/main-fc7d2f0e2098927e.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/chunks/pages/_app-43ac001d99fedbd3.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/8-ZWcbwxHaYCZZFwKFxrO/_buildManifest.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/8-ZWcbwxHaYCZZFwKFxrO/_ssgManifest.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/media/cats.e6b8b6a4.webp 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/chunks/pages/index-17605d8ecb730db9.js net::ERR_ABORTED 403
nextSsrServer:1

GET https://us-central1-***.cloudfunctions.net/_next/static/8-ZWcbwxHaYCZZFwKFxrO/_middlewareManifest.js net::ERR_ABORTED 403
favicon-32x32.png:1

GET https://us-central1-***.cloudfunctions.net/images/favicon/favicon-32x32.png 403
favicon-16x16.png:1

GET https://us-central1-***.cloudfunctions.net/images/favicon/favicon-16x16.png 403
nextSsrServer:1 Access to manifest at 'https://accounts.google.com/ServiceLogin?passive=true&continue=https://uc.appengine.google.com/_ah/conflogin%3Fstate%3D~AJKiYcHcX7iuuOJqs6nHtkizIgVOAItJqT8PjibW2SPtFq-PnvRkaVn9ZN9Q0P3vl-MbHLVNMpkBlkAHrL6WWQPRdD1D6Tl3LRh00gnbFXWn_4BqQceprDIKpQ4l8qEB4ZLFRkFbezzy8PVwa9HlQZc4Rd1qLVaDfkG0FLQl8xkkQW6JS5ForpHJ98dfnKCtRKA8TqaO2HL0nYNCKKhrytjNJIGRnEf_ipAqwVBEgWbU7Ub_T622fEDBKXXlXNf5gEAqSr5DRXKO'(redirected from 'https://us-central1-***.cloudfunctions.net/images/favicon/site.webmanifest') 
from origin 'https://us-central1-***.cloudfunctions.net' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
accounts.google.com/ServiceLogin?passive=true&continue=https://uc.appengine.google.com/_ah/conflogin%3Fstate%3D~AJKiYcHcX7iuuOJqs6nHtkizIgVOAItJqT8PjibW2SPtFq-PnvRkaVn9ZN9Q0P3vl-MbHLVNMpkBlkAHrL6WWQPRdD1D6Tl3LRh00gnbFXWn_4BqQceprDIKpQ4l8qEB4ZLFRkFbezzy8PVwa9HlQZc4Rd1qLVaDfkG0FLQl8xkkQW6JS5ForpHJ98dfnKCtRKA8TqaO2HL0nYNCKKhrytjNJIGRnEf_ipAqwVBEgWbU7Ub_T622fEDBKXXlXNf5gEAqSr5DRXKO:1

GET https://accounts.google.com/ServiceLogin?passive=true&continue=https://uc.appengine.google.com/_ah/conflogin%3Fstate%3D~AJKiYcHcX7iuuOJqs6nHtkizIgVOAItJqT8PjibW2SPtFq-PnvRkaVn9ZN9Q0P3vl-MbHLVNMpkBlkAHrL6WWQPRdD1D6Tl3LRh00gnbFXWn_4BqQceprDIKpQ4l8qEB4ZLFRkFbezzy8PVwa9HlQZc4Rd1qLVaDfkG0FLQl8xkkQW6JS5ForpHJ98dfnKCtRKA8TqaO2HL0nYNCKKhrytjNJIGRnEf_ipAqwVBEgWbU7Ub_T622fEDBKXXlXNf5gEAqSr5DRXKO net::ERR_FAILED 200

I tried solutions found here and there regarding CORS, but nothing worked.

This is my server.js file:

const { https } = require("firebase-functions");
const { default: next } = require("next");

const dev = process.env.NODE_ENV !== "production";
const app = next({
  dev,
  conf: { distDir: ".next" },
});

const handle = app.getRequestHandler();
exports.nextSsrServer = https.onRequest((req, res) =>
  app.prepare().then(() => handle(req, res))
);

firebase.json:

{
  "hosting": {
    "public": "out",
    "ignore": ["firebase.json", "**/.*", "**/node_modules/**"],
    "rewrites": [
      {
        "source": "**",
        "function": "nextSsrServer"
      }
    ]
  },
  "functions": {
    "source": "."
  }
}

.firebaserc:

{
  "projects": {
    "default": "***"
  }
}

Any help will be appreciated. :)

Answer 1

Resolved. Going to the Google docs, I found that I needed to change this:

firebase deploy --only functions

into this:

firebase deploy --only functions,hosting"

The first (wrong) command gave a URL I was not supposed to just use, for the functions only.

The second (correct) one actually produced the correct hosting URL I was supposed to use.

No CORS or any issues of any kind anymore.