firebase / firebase-admin-node

Firebase Admin Node.js SDK
https://firebase.google.com/docs/admin/setup
Apache License 2.0
1.61k stars 363 forks source link

Farmhash-modern throws webassembly error in Nextjs #2627

Open B-uchi opened 1 month ago

B-uchi commented 1 month ago

[REQUIRED] Step 2: Describe your environment

[REQUIRED] Step 3: Describe the problem

I'm trying to configure firebase-admin SDK on my nextjs + TS project. Whenever i try to invoke any SDK function, i get a webAssembly error. In my case, i am trying to configure a middleware for the server side api, and when i call the verifyIdToken method it throws the error. I'll paste it below, i also noticed that the affected dependency farmhash-modern was just replaced in this version of firebase.

Steps to reproduce:

The error occured when i called the verifyIdToken() method in my middleware.ts file.

Relevant Code:

This is the middleware file.

import { auth } from "./lib/config/firebaseConfig";
import { NextResponse } from "next/server";
import { NextRequest } from "next/server";

interface ExtendedNextRequest extends NextRequest {
  uid?: string;
}

export async function middleware(req: ExtendedNextRequest, res: NextResponse) {
  try {
    let token = req.headers.get("Authorization");
    if (!token)
      return NextResponse.json({ message: "Access Denied" }, { status: 403 });
    if (token.startsWith("Bearer ")) {
      token = token.split(" ")[1];
    }

    let decodedToken = await auth.verifyIdToken(token);
    let uid = decodedToken.uid;
    req.uid = uid;

    return NextResponse.next();
  } catch (error: any) {
    console.log(error.errorInfo);
    return NextResponse.json({ message: "Invalid Token" }, { status: 401 });
  }
}

This is the error output

⨯ ./node_modules/farmhash-modern/bin/bundler/farmhash_modern_bg.wasm
Module parse failed: Unexpected character '' (1:0)
The module seem to be a WebAssembly module, but module is not flagged as WebAssembly module for webpack.
BREAKING CHANGE: Since webpack 5 WebAssembly is not enabled by default and flagged as experimental feature.
You need to enable one of the WebAssembly experiments via 'experiments.asyncWebAssembly: true' (based on async modules) or 'experiments.syncWebAssembly: true' (like webpack 4, deprecated).
For files that transpile to WebAssembly, make sure to set the module type in the 'module.rules' section of the config (e. g. 'type: "webassembly/async"').
(Source code omitted for this binary file)

Import trace for requested module:
./node_modules/farmhash-modern/bin/bundler/farmhash_modern_bg.wasm
./node_modules/farmhash-modern/bin/bundler/farmhash_modern.js
./node_modules/farmhash-modern/lib/browser.js
./node_modules/firebase-admin/lib/remote-config/condition-evaluator-internal.js
./node_modules/firebase-admin/lib/remote-config/remote-config.js
./node_modules/firebase-admin/lib/app/firebase-namespace.js
./node_modules/firebase-admin/lib/default-namespace.js
./node_modules/firebase-admin/lib/index.js
./lib/config/firebaseConfig.ts

This question is also on stackoverflow

google-oss-bot commented 1 month ago

I couldn't figure out how to label this issue, so I've labeled it for a human to triage. Hang tight.

lahirumaramba commented 1 month ago

Does configuring webpack by setting asyncWebAssembly to true in your next.config.js work for you? Something similar to the following:

module.exports = {
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
    config.experiments = {
      asyncWebAssembly: true,
    };
    return config;
  },
};
Keegan-lee commented 1 month ago

I'm getting the same issue.. This code does seem to "fix" the issue, but src/middleware is now failing (hanging) to compile.

Does configuring webpack by setting asyncWebAssembly to true in your next.config.js work for you? Something similar to the following:

module.exports = {
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
    config.experiments = {
      asyncWebAssembly: true,
    };
    return config;
  },
};
raymelon commented 1 month ago

Experiencing the same issue. For now, I followed the workaround at https://github.com/firebase/firebase-admin-node/issues/2552#issuecomment-2176671285, which is to downgrade to "firebase-admin": "^12.0.0",

Credits to @chandrasekhar2039

matija2209 commented 4 weeks ago

Downgrading to 12.0.0 did not work for me.

Module parse failed: Unexpected character '' (1:0)
The module seem to be a WebAssembly module, but module is not flagged as WebAssembly module for webpack.
BREAKING CHANGE: Since webpack 5 WebAssembly is not enabled by default and flagged as experimental feature.
You need to enable one of the WebAssembly experiments via 'experiments.asyncWebAssembly: true' (based on async modules) or 'experiments.syncWebAssembly: true' (like webpack 4, deprecated).
For files that transpile to WebAssembly, make sure to set the module type in the 'module.rules' section of the config (e. g. 'type: "webassembly/async"').
(Source code omitted for this binary file)
B-uchi commented 4 weeks ago

Does configuring webpack by setting asyncWebAssembly to true in your next.config.js work for you? Something similar to the following:

module.exports = {
  webpack: (config, { buildId, dev, isServer, defaultLoaders, webpack }) => {
    config.experiments = {
      asyncWebAssembly: true,
    };
    return config;
  },
};

I also tried this, but as @Keegan-lee said src/middleware doesn't compile. It displays the compiling middleware message and stays there forever.

nicolopadovan commented 4 weeks ago

I am experiencing the same exact issue. Adding the asyncWebAssembly flag indeed causes middleware to compile indefinetely. Switching back to ^12.0.0 doesn't work either.

Workaround For now, I have moved all the pages that needed that middleware into a specific route (can also be an anonymous route). I am using the layout file as a kind of middleware: before displaying any data it runs a server action, where the error is not yielded.

Also, using ^12.0.0 raised an error regarding the usage of the os module, which may be a clue on where to debug this issue.

Edit: use export const revalidate = false on the layout to ensure no caching

Lucasch1 commented 1 week ago

Am having the same problem here, searched the best i could and it seems that there is no direct solution yet...

The best that i had saw is utilize another lib called next-firebase-auth-edge (https://github.com/awinogrodzki/next-firebase-auth-edge)

nicolopadovan commented 3 days ago

Am having the same problem here, searched the best i could and it seems that there is no direct solution yet...

The best that i had saw is utilize another lib called next-firebase-auth-edge (https://github.com/awinogrodzki/next-firebase-auth-edge)

I am guessing that Firebase Auth cannot be used on Edge runtime due to the need for some Node-only modules. FWIW I suggest to use this library with extreme caution due to how it manipulates and generates tokens and other security-related Firebase Auth features.