has anyone integrated the authentication plugin from ktor in a kobweb project before?

# kobweb

[Christopher Mederos]

has anyone integrated the authentication plugin from ktor in a kobweb project before?

[David Herman]

Auth the ktor way probably won't work with an SPA framework (single page application) like Kobweb because you download the whole site at once

[David Herman]

It doesn't really make sense to protect routes

[David Herman]

What you will need to do is pass auth tokens with your requests to sensitive API endpoints and those should reject requests without a valid token

[David Herman]

Your unpopulated UI should be fine to expose ; it's your data that is private

[Christopher Mederos]

Gotcha, makes sense the site files would be available without auth.

When protecting certain routes though - ktor has some nice plugins for handling auth on specified routes only. Curious if there's an easy way to expose that functionality from the underlying ktor server?

[Christopher Mederos]

I suppose I could write an extension func on ApiContext to validate an api-token param - which sounds a little more kobweb style?

[David Herman]

There's no way to expose what ktor auth is doing

[David Herman]

Remember, when you visit any URL you get the whole site.. So what good does protecting one of them do?

[David Herman]

You can define some common logic inside the Request interceptor

https://github.com/varabyte/kobweb?tab=readme-ov-file#intercepting-api-routes

[Christopher Mederos]

I'll check out the Request Interceptor 👍

I'm just curious about protecting certain @Api routes on the backend that mutate data

[David Herman]

Adding an extension method on top of ApiContext called rejectUnprivaligedUser and adding code to the top of sensitive API endpoints like

if (ctx.rejectUnprivaligedUser()) return

is probably a Kobweb -idiomatic good first step

[David Herman]

And inside the function you can tweak the ctx.res value to indicate an auth error code

[Christopher Mederos]

Thanks David - that sounds pretty handy!

[David Herman]

Hopefully we'll have more demo code for this sort of stuff in the future. Hope it goes well for you; let me know if you run into any issues.

[Christopher Mederos]

related to this discussion - is there a way to add a default header to requests sent using window.api.xxx()? Thinking it'd be a nice way to always include an Auth header

[David Herman]

Hmmm, I'm trying to lightly wrap window.fetch (which doesn't provide such functionality as far as I'm aware)

[David Herman]

Maybe the client needs something like an ApiInceptor too.

[David Herman]

(The problem is window.fetch isn't my code so I can't really add hooks into it, thinking about it)

[David Herman]

Let me do some quick investigation to make sure this isn't an incorrect assumption on my part

[David Herman]

Yeah it seems like the JavaScript way is adding wrappers.

That said, I could let you override some global default headers variable and use those.

[David Herman]

or maybe instead of default headers, just a global variable which represents an intercepting callback

[David Herman]

So @Christopher Mederos apologies! It turns out I was being obtuse. Not only was this possible to add given how Kobweb is structured, I even already had a hook where it would have been easy to do so.

In the next release, maybe it will be a bit too late for your case, but I've added a Headers default value here (set to null but you can override it): https://github.com/varabyte/kobweb/blob/982f18fdcdcfba62fb665764bb4832474c86fd12/f[…]ext/src/jsMain/kotlin/com/varabyte/kobweb/browser/http/Fetch.kt

In other words, somewhere in your code (@App block probably), you can write:

FetchDefaults.Headers = mapOf(...)

If you do that, window.api calls should automatically prepend the headers.

[Christopher Mederos]

@David Herman fantastic - I'll check it out in the next release then 🙌