Better Auth•4w ago

[magicLink - drizzleAdapter] The \"payload\" argument must be of type object. Received null

Hey guys, I am struggling to get to the bottom of this issue. I am hosting my backend with open-next - THis means that it's hosted in a lambda which shouldn't affect anything - My other DB functions work just fine. - All envvars exist - My implementation works locally. - My hosted database connection works as expected in other parts of my app This error is haunting me. Any tips for how I can debug it? None of the logs defined below get triggered which is weird.

return betterAuth({
secret: process.env.BETTER_AUTH_SECRET,
    logger: console,
    trustedOrigins: [getServerUrl(), '*'],
    onAPIError: {
      throw: true,
      onError(e, context) {
        console.error("[BETTER_AUTH - ERROR]", e);
        console.error("[BETTER_AUTH - CONTEXT]", context);
      }
    },

    baseURL: getServerUrl(),
// This works in my local just fine
    database: drizzleAdapter(getDrizzleDb(), {
      provider: "pg",
      usePlural: false,
      schema: {
        ...DbSchema,
        user: DbSchema.user,
      },
    }),
    plugins: [
      nextCookies(),
      magicLink({
        sendMagicLink: async ({ email, token, url }) =>
          // Send email function
      }),

return betterAuth({
secret: process.env.BETTER_AUTH_SECRET,
    logger: console,
    trustedOrigins: [getServerUrl(), '*'],
    onAPIError: {
      throw: true,
      onError(e, context) {
        console.error("[BETTER_AUTH - ERROR]", e);
        console.error("[BETTER_AUTH - CONTEXT]", context);
      }
    },

    baseURL: getServerUrl(),
// This works in my local just fine
    database: drizzleAdapter(getDrizzleDb(), {
      provider: "pg",
      usePlural: false,
      schema: {
        ...DbSchema,
        user: DbSchema.user,
      },
    }),
    plugins: [
      nextCookies(),
      magicLink({
        sendMagicLink: async ({ email, token, url }) =>
          // Send email function
      }),

I am using this better-auth version: "better-auth": "1.2.3", Any ideas? Am I missing something? --- Here is my /api/auth/[...all] route The reason I have a getBetterAuth is because I am hosting on opennext & get + set the environment variables at runtime (for security purposes), so hence the reason for a function that will getBetterAuth WHEN it's needed. NOTE: I only initialize the client once, if exists, use existing, else create new client.

import { getBetterAuth } from "@/lib/auth/better-auth"; // path to your auth file
import { toNextJsHandler } from "better-auth/next-js";

export const POST = (req: Request) => {
  return toNextJsHandler(getBetterAuth()).POST(req);
};


export const GET = (req: Request) => {
return toNextJsHandler(getBetterAuth()).GET(req);
};

import { getBetterAuth } from "@/lib/auth/better-auth"; // path to your auth file
import { toNextJsHandler } from "better-auth/next-js";

export const POST = (req: Request) => {
  return toNextJsHandler(getBetterAuth()).POST(req);
};


export const GET = (req: Request) => {
return toNextJsHandler(getBetterAuth()).GET(req);
};

18 Replies

James!OP•4w ago

I updated some configurations in my opennext and got a little more detailed error message "i.get is not a function" but it's not that useful. Does anyone have an idea?

James!OP•4w ago

It looks like better-auth doesn't have valid sourcemaps: "Invalid source map."

bekacru•4w ago

could you check the health endpoint? /api/auth/ok

James!OP•4w ago

@bekacru It looks like it's returning a 500.

James!OP•4w ago

I am going to try move my code initialization back to a "non dynamic" start where all envvars are loaded before runtime & therefore I don't need to do something like:

export const POST = (req: Request) => {
  return toNextJsHandler(getBetterAuth()).POST(req);
};


export const GET = (req: Request) => {
return toNextJsHandler(getBetterAuth()).GET(req);
};

export const POST = (req: Request) => {
  return toNextJsHandler(getBetterAuth()).POST(req);
};


export const GET = (req: Request) => {
return toNextJsHandler(getBetterAuth()).GET(req);
};

Altho I am not sure why this would be the root cause... Is there something that I might be missing in terms of configuration?
I am starting to think MAYBE that my better-auth baseURL: getServerUrl(), is the cause. Perhaps my openext lambda is not allowing outside access to the internet EVEN though my better-auth is sitting next to my code in the same server, it is having to goto the 'cloudfronturl' which goes on a roundtrip. But in saying this, there are no error logs. Have you encountered issues where "built" artefacts do not contain proper sourcemaps, this is what I seem to be encountering @bekacru

export const authServer = betterAuth({
  user: {
    modelName: "users",
    additionalFields: {
      firstName: {
        type: "string",
        fieldName: "firstName",
        returned: true,
        input: true,
        required: false,
      },
      lastName: {
        type: "string",
        fieldName: "lastName",
        returned: true,
        input: true,
        required: false,
      },
    },
  },
  appName: "test",
  secret: process.env.BETTER_AUTH_SECRET,
  logger: console,
  // trustedOrigins: [getServerUrl(), '*'],
  onAPIError: {
    throw: true,
    onError(e, context) {
      console.error("[BETTER_AUTH - ERROR]", e);
      console.error("[BETTER_AUTH - CONTEXT]", context);
    }
  },
  // This simply returns my cloudfront URL where the server is hosted
  // NOTE: My server is deployed in nextjs so it's next to my code
  baseURL: getServerUrl(),
  // This works fine locally!
  database: drizzleAdapter(getDrizzleDb(), {
    provider: "pg",
    usePlural: false,
    schema: {
      ...DbSchema,
      users: DbSchema.user,
    },
  }),
  plugins: [
    nextCookies(),
    magicLink({
      sendMagicLink: async ({ email, token, url }) =>
        // SEND LINK
    }),
    organization({
      allowUserToCreateOrganization: async (user) => {
        console.error("[BETTER_AUTH] allowUserToCreateOrganization cannot create org", user);
        return false;
      },
    }),
  ],
});

export const authServer = betterAuth({
  user: {
    modelName: "users",
    additionalFields: {
      firstName: {
        type: "string",
        fieldName: "firstName",
        returned: true,
        input: true,
        required: false,
      },
      lastName: {
        type: "string",
        fieldName: "lastName",
        returned: true,
        input: true,
        required: false,
      },
    },
  },
  appName: "test",
  secret: process.env.BETTER_AUTH_SECRET,
  logger: console,
  // trustedOrigins: [getServerUrl(), '*'],
  onAPIError: {
    throw: true,
    onError(e, context) {
      console.error("[BETTER_AUTH - ERROR]", e);
      console.error("[BETTER_AUTH - CONTEXT]", context);
    }
  },
  // This simply returns my cloudfront URL where the server is hosted
  // NOTE: My server is deployed in nextjs so it's next to my code
  baseURL: getServerUrl(),
  // This works fine locally!
  database: drizzleAdapter(getDrizzleDb(), {
    provider: "pg",
    usePlural: false,
    schema: {
      ...DbSchema,
      users: DbSchema.user,
    },
  }),
  plugins: [
    nextCookies(),
    magicLink({
      sendMagicLink: async ({ email, token, url }) =>
        // SEND LINK
    }),
    organization({
      allowUserToCreateOrganization: async (user) => {
        console.error("[BETTER_AUTH] allowUserToCreateOrganization cannot create org", user);
        return false;
      },
    }),
  ],
});

James!OP•4w ago

Still seem to get this error. Very strange. The error throws straight away so I am not sure if it's anything to do with internet access as my lambda has access to the internet

lonelyplanet•4w ago

@James! Quite random but is your database in sync with your schema and have you recently ran the generate betterauth cli command

James!OP•4w ago

I will triple confirm the schema in my remote DB @lonelyplanet but: my local works and it is using the same script that was applied in my hosted DB (see attached file) I really hope this is just some minor thing I have missed 😂 But it's hard to track down because the log isn't useful at all. I will also do the betterauth cli tonight

better-auth-schema.s...

James!OP•4w ago

^ I then have my drizzle which maps the snake_case back to camelCase

lonelyplanet•4w ago

The reason i ask is the payload error i see lots off and when my db is not in sync although i was using prisma Still postgres though Have your checked you Prod db url, It is whitelisted IP to access db? Your function might not beable to connect to your database Try debugging your db and seeing if thats the issue

James!OP•4w ago

- Db connection is okay - Tested fully on another feature unrelated to better auth. I'll focus around the DB side of things! I connected to my database locally from within VPN and it worked perfectly. I also confirmed the DB connection works as expected because I can see insertions to tables unrelated to better-auth. Is there perhaps an "origin" policy I might be missing Okay - about to test something which will be the classic embarrassing issue if it was true lol 🤞 Nope it wasnt 😓 I thought it was the baseUrl being different to what my cloudfront URL was

bekacru•4w ago

first, you don't need to use the nextjs adapter

export const POST = (req: Request) => {
  return getBetterAuth()(req)
};


export const GET = (req: Request) => {
  return getBetterAuth()(req);
};

export const POST = (req: Request) => {
  return getBetterAuth()(req)
};


export const GET = (req: Request) => {
  return getBetterAuth()(req);
};

James!OP•4w ago

I will try this 👍 Do we need to set trustedOrigins - My assumption is that without setting these, those security configs just won't be used.

bekacru•4w ago

only if your frontend and backend are hosted in a separate domain

James!OP•4w ago

I feel like I have exhausted most of my known possible solutions to this issue I've just pushed this change to check your suggestion + added some extra logs. Apart from this - is there anything else you suggest I try if this doesn't yield any beneficial information? 🤔

export const POST = (req: Request) => {
    return getBetterAuth().handler(req)
        .then((res) => {
            console.info(res, 'POST /api/auth/[...all]')
            return res
        })
        .catch((err) => {
            console.error(err, 'ERR: POST /api/auth/[...all]')
            throw err
        })
        .finally(() => {
            console.info('FINALLY: POST /api/auth/[...all]')
        })
  };
  
  
  export const GET = (req: Request) => {
    return getBetterAuth().handler(req)
        .then((res) => {
            console.info(res, 'GET /api/auth/[...all]')
            return res
        })
        .catch((err) => {
            console.error(err, 'ERR: GET /api/auth/[...all]')
            throw err
        })
        .finally(() => {
            console.info('FINALLY: GET /api/auth/[...all]')
        })
  };

export const POST = (req: Request) => {
    return getBetterAuth().handler(req)
        .then((res) => {
            console.info(res, 'POST /api/auth/[...all]')
            return res
        })
        .catch((err) => {
            console.error(err, 'ERR: POST /api/auth/[...all]')
            throw err
        })
        .finally(() => {
            console.info('FINALLY: POST /api/auth/[...all]')
        })
  };
  
  
  export const GET = (req: Request) => {
    return getBetterAuth().handler(req)
        .then((res) => {
            console.info(res, 'GET /api/auth/[...all]')
            return res
        })
        .catch((err) => {
            console.error(err, 'ERR: GET /api/auth/[...all]')
            throw err
        })
        .finally(() => {
            console.info('FINALLY: GET /api/auth/[...all]')
        })
  };

Thanks for the tips BTW! No luck. Does better-auth have any logics around forwarding headers or cookies that might not be working well with a custom nextjs hosted solution via opennext It looks like this might be a problem with opennext - I’m going to do some digging today. Perhaps there are some behaviours that are causing this. Perhaps requesting itself is playing up After looking through the code I have narrowde it down to the better-call implementation:

return async <OPT extends O, K extends keyof OPT, C extends InferContext<OPT[K]>>(
        path: K,
        ...options: HasRequired<C> extends true
            ? [
                    WithRequired<
                        BetterFetchOption<C["body"], C["query"], C["params"]>,
                        keyof RequiredOptionKeys<C>
                    >,
                ]
            : [BetterFetchOption<C["body"], C["query"], C["params"]>?]
    ): Promise<
        BetterFetchResponse<Awaited<ReturnType<OPT[K] extends Endpoint ? OPT[K] : never>>>
    > => {
        return (await fetch(path as string, {
            ...options[0],
        })) as any;
    };
};

return async <OPT extends O, K extends keyof OPT, C extends InferContext<OPT[K]>>(
        path: K,
        ...options: HasRequired<C> extends true
            ? [
                    WithRequired<
                        BetterFetchOption<C["body"], C["query"], C["params"]>,
                        keyof RequiredOptionKeys<C>
                    >,
                ]
            : [BetterFetchOption<C["body"], C["query"], C["params"]>?]
    ): Promise<
        BetterFetchResponse<Awaited<ReturnType<OPT[K] extends Endpoint ? OPT[K] : never>>>
    > => {
        return (await fetch(path as string, {
            ...options[0],
        })) as any;
    };
};

On the nextjs server, it is trying to fetch a relative path. As we can see in the better-auth -> src/api/index.ts in this code:

export const router = <C extends AuthContext, Option extends BetterAuthOptions>(
    ctx: C,
    options: Option,
) => {
    const { api, middlewares } = getEndpoints(ctx, options);
    // console.log("[BETTER_AUTH.router] options", JSON.stringify(options, null, 2));
    console.log(JSON.stringify(ctx, null, 2), 'ctx__')
    console.log(options, 'options')
    const basePath = new URL(ctx.baseURL).pathname;
    console.log("[BETTER_AUTH.router] basePath", basePath);
    console.log("[BETTER_AUTH.router] middlewares", JSON.stringify(middlewares, null, 2));

    return createRouter(api, {
        routerContext: ctx,
        openapi: {
            disabled: true,
        },
        basePath, <~ Here is the culprit

export const router = <C extends AuthContext, Option extends BetterAuthOptions>(
    ctx: C,
    options: Option,
) => {
    const { api, middlewares } = getEndpoints(ctx, options);
    // console.log("[BETTER_AUTH.router] options", JSON.stringify(options, null, 2));
    console.log(JSON.stringify(ctx, null, 2), 'ctx__')
    console.log(options, 'options')
    const basePath = new URL(ctx.baseURL).pathname;
    console.log("[BETTER_AUTH.router] basePath", basePath);
    console.log("[BETTER_AUTH.router] middlewares", JSON.stringify(middlewares, null, 2));

    return createRouter(api, {
        routerContext: ctx,
        openapi: {
            disabled: true,
        },
        basePath, <~ Here is the culprit

I believe this is the culprit here: basePath, <~ Here is the culprit Okay, I found the issue:

export function getIp(
    req: Request | Headers,
    options: BetterAuthOptions,
): string | null {
    if (options.advanced?.ipAddress?.disableIpTracking) {
        return null;
    }
    const testIP = "127.0.0.1";
    if (isTest) {
        return testIP;
    }
    const ipHeaders = options.advanced?.ipAddress?.ipAddressHeaders;
    const keys = ipHeaders || [
        "x-client-ip",
        "x-forwarded-for",
        "cf-connecting-ip",
        "fastly-client-ip",
        "x-real-ip",
        "x-cluster-client-ip",
        "x-forwarded",
        "forwarded-for",
        "forwarded",
    ];
    const headers = req instanceof Request ? req.headers : req;
    console.log("headers in getReqIp", headers);
    for (const key of keys) {
        const value = headers.get?.(key); <~ I addewd the ?. here
        if (typeof value === "string") {
            const ip = value.split(",")[0].trim();
            if (ip) return ip;
        }
    }
    return null;
}

export function getIp(
    req: Request | Headers,
    options: BetterAuthOptions,
): string | null {
    if (options.advanced?.ipAddress?.disableIpTracking) {
        return null;
    }
    const testIP = "127.0.0.1";
    if (isTest) {
        return testIP;
    }
    const ipHeaders = options.advanced?.ipAddress?.ipAddressHeaders;
    const keys = ipHeaders || [
        "x-client-ip",
        "x-forwarded-for",
        "cf-connecting-ip",
        "fastly-client-ip",
        "x-real-ip",
        "x-cluster-client-ip",
        "x-forwarded",
        "forwarded-for",
        "forwarded",
    ];
    const headers = req instanceof Request ? req.headers : req;
    console.log("headers in getReqIp", headers);
    for (const key of keys) {
        const value = headers.get?.(key); <~ I addewd the ?. here
        if (typeof value === "string") {
            const ip = value.split(",")[0].trim();
            if (ip) return ip;
        }
    }
    return null;
}

The problem was that headers.get.key() was returning the .get is not a function. NOW I haven't figured what the ROOT cause of this is. I initially thought it was because in nextjs 15 you needed to use await headers() BUT maybe this is only app pages, and not API routes.

bekacru•4w ago

hmm? isn't request a proper Request object in open next? try to call request.headers.get

James!OP•4w ago

Yeah it is. Going to have another look today

James!OP•4w ago

I have opened a PR for this: https://github.com/better-auth/better-auth/pull/1838

GitHub

fix: access of undefined in runtime that does have great support of...

Issue this solves Discord thread This fixes the issue The "payload" argument must be of type object. Received null where when debugged closer we got an error like this: It wasn...

Gaming

Programming

[magicLink - drizzleAdapter] The \"payload\" argument must be of type object. Received null

Did you find this page helpful?