Better Auth•8mo ago

Issue with ReadableStream is locked or disturbed error and Google Sign-In using Better Auth

Hi everyone! I'm using Better Auth (version 0.5.2-beta.16) for a project, and I've encountered a blocking issue during Google sign-in integration. My setup: - Backend: Express with Drizzle ORM and Better Auth for authentication. - Frontend: React using createAuthClient from Better Auth. - Database: SQLite (with Drizzle ORM). - Google OAuth for authentication. Problem: When trying to sign in with Google, the backend throws the following error:

TypeError: ReadableStream is locked or disturbed

TypeError: ReadableStream is locked or disturbed

Here’s the full log output:

error: Uncaught (in promise) TypeError: ReadableStream is locked or disturbed
    at extractBody (ext:deno_fetch/22_body.js:467:13)
    at new Request (ext:deno_fetch/23_request.js:429:19)
    at getRequest (file:///D:/WORK/TOOLS/OTHER/better-auth-example/server/node_modules/.pnpm/[email protected]/node_modules/better-call/dist/index.js:771:10)
    ...

error: Uncaught (in promise) TypeError: ReadableStream is locked or disturbed
    at extractBody (ext:deno_fetch/22_body.js:467:13)
    at new Request (ext:deno_fetch/23_request.js:429:19)
    at getRequest (file:///D:/WORK/TOOLS/OTHER/better-auth-example/server/node_modules/.pnpm/[email protected]/node_modules/better-call/dist/index.js:771:10)
    ...

This error happens when calling authClient.signIn.social({ provider: 'google', callbackURL: '/profile' }) on the frontend. What I've tried: - Checked that the Google OAuth credentials are correct. - Ensured that the /api/auth/* routes are properly handled in the backend using toNodeHandler. - Implemented CORS for requests between localhost:3000 (frontend) and localhost:5000 (backend). - Verified that session middleware is correctly applied on the backend. Here's a brief overview of my code: - Frontend (React):

  const authClient = createAuthClient({
    baseURL: 'http://localhost:5000/api/auth'
  });

  const signInWithGoogle = async () => {
    await authClient.signIn.social({
      provider: 'google',
      callbackURL: '/profile'
    });
  };

  const authClient = createAuthClient({
    baseURL: 'http://localhost:5000/api/auth'
  });

  const signInWithGoogle = async () => {
    await authClient.signIn.social({
      provider: 'google',
      callbackURL: '/profile'
    });
  };

- Backend (Express):

  app.all('/api/auth/*', (req, res, next) => {
    console.log('Request body:', req.body);
    next();
  }, toNodeHandler(auth));

  app.all('/api/auth/*', (req, res, next) => {
    console.log('Request body:', req.body);
    next();
  }, toNodeHandler(auth));

5 Replies

Jackson KasiOP•8mo ago

Question: - Has anyone else encountered this ReadableStream is locked or disturbed error when integrating Google sign-in with Better Auth? - Could there be an issue with how I'm handling the request body in Express, or might there be something wrong with the internal stream handling in Better Auth? Any help or suggestions would be greatly appreciated! Thank you in advance!

Jackson KasiOP•8mo ago

https://github.com/jacksonkasi1/better-auth-example/tree/main repo

GitHub

GitHub - jacksonkasi1/better-auth-example

Contribute to jacksonkasi1/better-auth-example development by creating an account on GitHub.

Jackson KasiOP•8mo ago

bekacru•8mo ago

this is because you're using json middleware which would read the body before the auth handler can get to it If you remove that, it should work. Just apply the middleware to paths not handled by Better Auth.

Jackson KasiOP•8mo ago

@bekacru thanks it's work! 🙂

Gaming

Programming

Issue with ReadableStream is locked or disturbed error and Google Sign-In using Better Auth

Did you find this page helpful?