Flo
Flo
NNuxt
Created by Justine on 5/10/2024 in #❓・help
Has anyone gotten Nuxt 3 to work with Keycloak?
I'm using sidebase-auth with keycloak:
import { NuxtAuthHandler } from "#auth";
import KeycloakProvider, {
type KeycloakProfile,
} from "next-auth/providers/keycloak";

const rtc = useRuntimeConfig();

export default NuxtAuthHandler({
secret: "somethingyoushoulddefinitelychangehere",
pages: {
signIn: "/login",
},
providers: [
// @ts-expect-error You need to use .default here for it to work during SSR. May be fixed via Vite at some point
KeycloakProvider.default({
clientId: rtc.keycloakClientId,
clientSecret: rtc.keycloakClientSecret,
issuer: rtc.keycloakIssuer,
profile(profile: KeycloakProfile) {
return {
uid: profile.sub,
name: profile.name ?? profile.preferred_username,
email: profile.email,
roles: profile.roles,
};
},
})
],
callbacks: {
// Callback when the JWT is created / updated, see https://next-auth.js.org/configuration/callbacks#jwt-callback
jwt: async ({ token, user }) => {
const isSignIn = user ? true : false;
if (isSignIn) {
token.uid = user ? user.uid || "" : "";
token.roles = user ? user.roles || [] : [];
}
return Promise.resolve(token);
},
// Callback whenever session is checked, see https://next-auth.js.org/configuration/callbacks#session-callback
session: async ({ session, token }) => {
session.roles = token.roles;
session.uid = token.uid;
return Promise.resolve(session);
},
},
});
import { NuxtAuthHandler } from "#auth";
import KeycloakProvider, {
type KeycloakProfile,
} from "next-auth/providers/keycloak";

const rtc = useRuntimeConfig();

export default NuxtAuthHandler({
secret: "somethingyoushoulddefinitelychangehere",
pages: {
signIn: "/login",
},
providers: [
// @ts-expect-error You need to use .default here for it to work during SSR. May be fixed via Vite at some point
KeycloakProvider.default({
clientId: rtc.keycloakClientId,
clientSecret: rtc.keycloakClientSecret,
issuer: rtc.keycloakIssuer,
profile(profile: KeycloakProfile) {
return {
uid: profile.sub,
name: profile.name ?? profile.preferred_username,
email: profile.email,
roles: profile.roles,
};
},
})
],
callbacks: {
// Callback when the JWT is created / updated, see https://next-auth.js.org/configuration/callbacks#jwt-callback
jwt: async ({ token, user }) => {
const isSignIn = user ? true : false;
if (isSignIn) {
token.uid = user ? user.uid || "" : "";
token.roles = user ? user.roles || [] : [];
}
return Promise.resolve(token);
},
// Callback whenever session is checked, see https://next-auth.js.org/configuration/callbacks#session-callback
session: async ({ session, token }) => {
session.roles = token.roles;
session.uid = token.uid;
return Promise.resolve(session);
},
},
});
4 replies
NNuxt
Created by Flo on 3/31/2024 in #❓・help
Nuxt Layer: Composable from layer not found
Yup. Had to remember that composables are not usable in api handlers. Confusing when there's a lot of stuff looking like composables in nitro and nuxt 🙈
8 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
We're doing a combination of keycloak and local auth, local for developers
19 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
straightforward following the docs
19 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
I'm actually using sidebase/nuxt-auth with no issues
19 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
looks like you're doing some kind of oauth flow?
19 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
Need to say, I have no clue about firebase
19 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
Composables only work on pages/components, not in server stuff
19 replies
NNuxt
Created by Wazbat on 4/28/2024 in #❓・help
Post request to page path
you could also name the server route server/routes/auth/signin.post.ts
8 replies
NNuxt
Created by Wazbat on 4/28/2024 in #❓・help
Post request to page path
pages/auth/signin.vue == pages/auth/signin/index.vue
8 replies
NNuxt
Created by Wazbat on 4/28/2024 in #❓・help
Post request to page path
sure, absolutely
8 replies
NNuxt
Created by Dickson on 4/27/2024 in #❓・help
Help Needed, Component not displaying
Not sure why you're importing Card instead of using LazyCard... but I can definitely see possible issues using the same variable name for the component and the for-loop.
3 replies
NNuxt
Created by Wazbat on 4/28/2024 in #❓・help
Post request to page path
(Usually you can also provide a callback url to your auth service to redirect that post request)
8 replies
NNuxt
Created by Wazbat on 4/28/2024 in #❓・help
Post request to page path
Having two files named index.ts and index.post.ts is possible, yes.
8 replies
NNuxt
Created by Angh0r on 4/24/2024 in #❓・help
Hover state only for table body rows
4 replies
NNuxt
Created by Nasr galal on 4/24/2024 in #❓・help
Trying to dynamically provide an API services composable
put it in server/utils and you should be good 🙂
19 replies
NNuxt
Created by Angh0r on 4/24/2024 in #❓・help
Hover state only for table body rows
return props.storeRef.map((item) => {
return {
...item,
class: "hover:bg-somecolor-50"
}
}
return props.storeRef.map((item) => {
return {
...item,
class: "hover:bg-somecolor-50"
}
}
4 replies
NNuxt
Created by Angh0r on 4/24/2024 in #❓・help
Hover state only for table body rows
yes. Add a class-property to the row elements
4 replies
NNuxt
Created by Flo on 4/22/2024 in #❓・help
API Routing broken
Alright, I'll open up an issue in github, with repro. The current implementation ... hurts. Badly.
9 replies
NNuxt
Created by Flo on 4/22/2024 in #❓・help
API Routing broken
so... by design? Not a bug?
9 replies