Hono•3mo ago

Using @hono/auth-js with one API server (auth) and one web server (front) ?

Hey, hope Hono fans are doing well, I'm wondering if it's possible to use a distant API (not on the same hostname) with authjs ? I've seen multiple examples with @hono/auth-js but they are always relying on the vite proxy server to serve the api on the same host as the frontend server. Example usages of the @hono/auth-js lib : - https://github.com/divyam234/next-auth-hono-react - https://github.com/honojs/middleware/blob/main/packages/auth-js/test/index.test.ts - https://github.com/tgdrive/rdebrid-ui/ Can anyone help me? I don't want to proxy my API to example.com/api/auth because I prefer using a separate hostname like this api.example.com Thanks for reading me ! 😊 Wishing you a good day 😉

5 Replies

Amodeus R.•3mo ago

If I'm getting it, you want to make cross-site api calls? Is that right?

ambergristle•3mo ago

hey @Mattèo! can you share a bit more about your setup + any issues you're running into? afaik, cors checks don't usually care about sub-domains - are you trying to use the hono/authjs middleware? - you can set an AUTH_URL in your env - https://github.com/honojs/middleware/blob/main/packages/auth-js/README.md#configuration - that seems to get picked up how you'd want: - https://github.com/honojs/middleware/blob/4e4e40cdbf715ea1c9546184ca7f84309ce2c1d8/packages/auth-js/src/index.ts#L138 - which provider are you planning on using w auth.js? this may affect what's possible i expect most of the examples you see use the same domain because it's an easy way to limit xss security vulnerabilities and on the whole, probably recommended for most full-stack apps, unless they have conflicting requirements

MattèoOP•3mo ago

Yes we can say that, Imagine I want to build a mobile app in the future, I might want to rely on an auth server since the native environment is completely different Thanks for your explanation, I completely understand the design choice of targeting full stack framework app, some devs like me have different needs in the age of "server first" / "RSC" / "meta-framework" 😅 Hope to see a guide on server implementations 🙏 (covering XSS, CORS, sharing types, etc...)

Amodeus R.•3mo ago

Well, I just needed to solve a somewhat similar problem, trying to make cross-site authentication, though I'm not sure it could be of any help for you, but I'll leave my experience here, who knows it might help you in a way or another. Basically I configured the backend to make authentication with cookies, so I needed to put these options for the cookies options. (I'm using Kinde by the way, so there's that)

const cookiesOptions: CookieOptions = {
      httpOnly: true,
      secure: true,
      sameSite: "None",
    } as const;

const cookiesOptions: CookieOptions = {
      httpOnly: true,
      secure: true,
      sameSite: "None",
    } as const;

And then I passed it to the setCookie function from hono/cookie with the values I wanted to store and such. in the cors configuration I added credentials: true, and using Honojs client I also configured it to include credentials as following below

const client = hc<ApiRoutes>("http://localhost:3000/", {init: {
  credentials: "include"
}});

const client = hc<ApiRoutes>("http://localhost:3000/", {init: {
  credentials: "include"
}});

It allowed me to make fetch calls from different domains.

ambergristle•3mo ago

i'm working on a few hono/auth implementations, using the new lucia auth patterns so far it's all using ssg/ssr hono/jsx (single host), but i'm planning on doing a hono/react example most of the interest i've seen on the hono discord (for hono frontends) is for single-host deployments (usually react+vite) so that's probably where i'll end up but i could potentially look into cross-site implementations, if there are specific issues/pain-points i still need to do a little digging to see what the community is interested in/needs

Gaming

Programming

Using @hono/auth-js with one API server (auth) and one web server (front) ?

Did you find this page helpful?