#Would like to gain assistance integrating Auth.js and Astro together

1105 messages · Page 2 of 2 (latest)

naive dust
#

everything works on yarn but I get an error using pnpm... didn´t get this before.. installing cookie again fixes it

#

i don´t know whats going on as we have it in our deps

silver jasper
#

we'll just have to add it as a note for pnpm users ig. doesn't happen in npm or yarn so idk what else we can do

naive dust
#

yeah

#

do you mind if I add prettier?

silver jasper
#

not at all, sounds like a good idea

naive dust
# 
{
  "printWidth": 100,
  "semi": false,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5",
  "useTabs": false,
  "overrides": [
    {
      "files": ["**/*.astro"],
      "options": {
        "parser": "astro"
      }
    }
  ]
}
#

with this config

silver jasper
#

only thing I'd change is useTabs true, but I don't care too much with that. the rest looks pretty good

naive dust
#

sure will do

#

alllright

#

everything seems good to me now

#

I ran a test with pnpm again and the error is gone now too. I think there was some error with caching

silver jasper
#

ok awesome, that was my experience too

naive dust
#

I´ll wait for a last thumbs up by you and then merge and publish this thing

#

finally

silver jasper
#

yeah. let's ship this thing

naive dust
#

aaand we are live! 🎉
https://www.npmjs.com/package/auth-astro

npm
auth-astro

Auth Astro is the easiest way to add Authentication to your Astro Project. It wraps the core of Auth.js into an Astro integration which automatically adds the endpoints and handles everything else.. Latest version: 2.0.0, last published: a few seconds ago. Start using auth-astro in your project by running `npm i auth-astro...

silver jasper
#

🎉

naive dust
#

lets share this

silver jasper
#

writing an updated tutorial for my blog, then I'll post a twitter thread highlighting some of the improvements

naive dust
#

Thanks a lot!

#

please share the blog link here as well

narrow solar
#

congrats 🎉 this is huge!

#

I will try it out later today

silver jasper
#

thanks! hope you enjoy it!

silver jasper
serene lava
#

Congratulations you all!

silver jasper
naive dust
quick cradle
#

Congrats on the new update 🥳
I am trying to test it out but I keep getting errors and noticed that the README says to use callback/github but the blog post says github/callback which one do I use?

serene lava
serene lava
#

Excuse me

quick cradle
#

@silver jasper just a heads up that the config example in your blog has a few errors, it needs a import node from "@astrojs/node"; and the config import for Astro needs to be astro/config instead of astro. Also the callback link needs to be callback/github instead of github/callback

serene lava
serene lava
quick cradle
naive dust
silver jasper
quick cradle
# naive dust Did you get it to work?

Yes I did finally get it working, I was mostly just having issues using pnpm and with the README / blog post having conflicting information, but now that I know how to set it up it works great and is super easy to use

silver jasper
naive dust
#

merged 🙂 thank you for adding this @quick cradle

naive dust
silver jasper
#

basically, if you have the cloudflare or vercel edge adapter installed, it won't add the polyfill even if you're running node 18 locally (the dev environment for cloudflare & vercel edge still uses node)

#

gonna review this now because I've spotted a problem

naive dust
#

ah so it´s the combination of both

silver jasper
#

yeah

naive dust
#

yeah that makes more sense

#

i was confused by his PR

silver jasper
naive dust
#

just merged and published together with the docs changes

silver jasper
#

nice 🥳

sinful hill
#

following along here and getting ready to start testing. happy to help where I can. I'll be using Netlify to host. so typically I'd be using adapter: netlify() in my config. will I be keeping this or using the adapter: node({mode: 'standalone'})?

serene lava
#

Keeping your current adapter should work just fine

silver jasper
naive dust
#

yeah that makes more sense

#

that´s why i was confused

naive dust
high mulch
#

Hi, thanks for this epic undertaking! Quick question... I'm trying to get the credentials provider up and running on v2, but because of how the astro.config file is parsed the authorize() function required by the credentials provider configuration gets stringified away and the site crashes at runtime with an assertion error related to the missing function. I understand from https://github.com/nowaythatworked/auth-astro/issues/10 that the authorization logic might need to instead be implemented in the /src/api/[...auth].ts endpoint, but I'm not clear if that example was for the v1 approach. I'm currently trying to create and pass around an AstroAuthConfig from the [..auth].ts endpoint, but am running into errors around 'auth:config' being undefined. I can open an issue with more details if I'm not just failing to grok something obvious. Are there any examples out there of using the credentials provider with v2?

sonic pecan
#

Yep it took me a while to figure this out too. I scraped auth-astro for now (sorry!) and implemented it myself to get a better understanding of all the problems that we're running into. For example, the same thing happens when using a database adapter. Having the config in the astro.config is sadly not possible

silver jasper
#

So sorry about this, I completely forgot that database adapters could mess config up. If you still need a solution for now, I'd recommend downgrading to v1.0.6 for the time being. I'm happy to keep v1 maintained while we find solutions for these problems. If you could both go ahead and create an issue on GitHub as well, so we can track these that would be greatly appreciated. I'll start investigating both issues later today.

Here's the link to the v1 docs if either of you do decide to downgrade:
https://www.npmjs.com/package/auth-astro/v/1.0.6

sonic pecan
#

Yeah it really would be nice to have the config in the astro.config, vite replaces import.meta.env so then you'd not need to deal with the pain of having 2 configs. Or do you have a good solution for that as well?

(for more context: Cloudflare runtime uses it's own env, though process.env is available both locally and on the Cloudflare server. Using process.env breaks local development and using import.meta.env breaks on the Cloudflare server)

sonic pecan
# sonic pecan Yeah it really would be nice to have the config in the astro.config, vite replac...

I just came across an old astro PR that had some good information about environment variables: https://github.com/withastro/astro/pull/5301/files

"As Cloudflare Pages Functions provides environment variables per request, you can only access private environment variables when a request has happened. Usually, this means moving environment variable access inside a function."

This does work, I had my config exported in a ts file. Simply wrapping the object in a function completely resolves the environment issue 😃 (🤦‍♂️ )

silver jasper
#

wait really xD
do you have a shareable example

sonic pecan
sonic pecan
#

Yeah no sorry, I don't see a way of making auth astro v2 work.

silver jasper
#

nevertheless I'll keep trying 🥲

sonic pecan
#

Is it worth it? Why not just have an [...auth].ts file? You can still have the integration for the prefix config

silver jasper
#

eh, I'd rather consolidate it in one config, whether we need to move back to the v1 version, or see if there's a nice option here

#

I'm gonna look into replicating this with the prisma adapter and see what I can come up with

sonic pecan
#

Yeah I've been looking for a couple days for a solution to that problem, and I can figure it out. Sorry 😦. Hopefully you can 😁

naive dust
#

I guess there would be a very complicated way to do that but not sure if it would be worth it. Essentially bundle the Astro config during runtime and writing the output into the virtual module. (Btw If you build something like this more sophisticated you could theoretically hydrate functions, question is if you should tho 😂)

#

Or you could put the config into a seperate file and import it using import.meta.glob but that’s not optimal either ig

silver jasper
#

@naive dust is it worth updating our readme (documentation) to explain that you may need to create the endpoints manually (until we finish investigating this)

silver jasper
#

ok, now I have some time, starting tomorrow I'm going to look at what the next step for auth-astro is, and how we can get around these serialisation problems. for some reason I wasn't getting github notifications but it seems @ tony-sull has some ideas, like a separate config. as much as I'm not a huge fan of that approach, it's honestly miles better than any hacky vite thing I tried to come up with

#

realistically I want to get this new thing figured out within the week, because it looks like more and more people have been starting to use, and it's this issue is bigger than I realised.

#

also after this is done we need to get this added to the integrations page

raw narwhal
#

For some reason since I upgraded to auth-astro 2.0.2 (I was on a pre 2.0 version beforehand) I keep getting this error:

✘ [ERROR] Could not resolve "auth:config"

    ../../node_modules/.pnpm/[email protected]_skgzdzwlnm62hl3czvibkx43iy/node_modules/auth-astro/server.ts:30:23:
      30 │ import authConfig from 'auth:config'
         ╵                        ~~~~~~~~~~~~~

  You can mark the path "auth:config" as external to exclude it from the bundle, which will remove
  this error.

I tried marking it as external in the rollup bundle config and the SSR config but neither seemed to work. I also tried adding console.log statements to the actual setup hook and config virtual module, and it seemed like it was loading fine, but for whatever reason the virtual module never intercepted auth:config (despite intercepting many other requests).
Also I have already gone through removing [...astroAuth].ts and changing imports to work with 2.0.2
Any help you could provide would be very appreciated.

silver jasper
#

version 2 doesn't play nice with any adapters or more advanced stuff because of the different environment things are running in. I'm pretty certain this is the problem here, if you're using a database adapter for example. I'm working on a new version to be pushed out hopefully by sometime next week, but for now I recommend staying with version 1 and I'll try to support it best I can. I don't have push access to the repo, so I can't update the README to recommend this, but I'm happy to help you out if there's something in v1 you're unable to do.
also sorry about all this. I'm gonna try my best to get auth-astro sorted out asap 😅

raw narwhal
#

Ok, thanks! Let me know if there is any way I can help!

serene lava
#

Not here to offer a lot that is helpful immediately. Just wanted to say congratulations to you @silver jasper I just saw the Astro Twitter post about your Support Mod position and I felt compelled to thank you again for your contributions to this AuthJS Integration!

sonic pecan
silver jasper
silver jasper
#

@naive dust are you able to temporarily add something to the README to explain the current situation? We've had a few opened issues & people in support. I'd like to basically just say "An update is coming. Use v1 for now"

silver jasper
#

I've implemented the file-based config & updated the docs. Once this is published I'll begin sharing the word with the people who had problems with it

#

Tested with multiple providers & database adapters

naive dust
#

hey, i was gone for some time and didn´t have my laptop with me. I´m back now and will take a look at the PR. thaks for keeping this going, I think the external config is the way to go

#

what do you think about having a parameter in the integration config to choose which kind of config to use. either external config and injecting endpoints or "the v1 way". We could set either one of them as default

silver jasper
#

Hey, no worries, hope everything's good. I think the v1 version should still be supported under inject or something similar? By default it injects the endpoints (also all functions accept an override config iirc)

silver jasper
naive dust
#

Yes I took a look. I’m still wondering if there is anything missing. Will do a proper Laptop once on my laptop

naive dust
#

hey @silver jasper I´m good to merch this. I think there would be ways to still improve DX but tbh i don´t have the time atm to implement it.

Should this be a minor or major version upgrade?

#

it´s a fix but also has breaking changes. Except you change it to also accepting the auto-config as argument in the astro.config

silver jasper
#

Probably a major because it removes the config from V2. If you have any DX ideas feel free to drop them here, I've got the time and I'm gonna start working on things that'll use this library

#

Also once you've published I'll start working with the people who were stuck because of the old version, and see if I can help people upgrade

naive dust
#

its really an edgecase but rn the config always needs to be exported as default. It could be changed to be either exported as default or a const. This would allow to have the config together with auth logic in one place, for example if someone wants to have their own endpoints, they could have the config in the same file as the endpoints

#

but i will go ahead and merge your PR now so the people can fix their problems

#

Done

silver jasper
#

Awesome. I'll start working on things in the morning

silver jasper
#

2.4.1 breaks css when using this integration

#

update: breaks css when using this integration + middleware

#

update: it probably has nothing to do with us

#

debugging is hard

silver jasper