Merge branch 'feature/keycloak' into feature/snyk

SpotiCloud · Jun 18, 2024 · e38dcf0 · e38dcf0
2 parents b0e9b84 + 7248581
commit e38dcf0
Show file tree

Hide file tree

Showing 14 changed files with 208 additions and 31 deletions.
diff --git a/src/app/api/auth/[...nextauth]/authOptions.ts b/src/app/api/auth/[...nextauth]/authOptions.ts
@@ -0,0 +1,37 @@
+import { Token } from "@/types/next-auth";
+import { AuthOptions } from "next-auth";
+import KeycloakProvider from "next-auth/providers/keycloak";
+
+export const authOptions: AuthOptions = {
+  providers: [
+    KeycloakProvider({
+      clientId: process.env.KEYCLOAK_CLIENT_ID as string,
+      clientSecret: process.env.KEYCLOAK_CLIENT_SECRET as string,
+      issuer: process.env.KEYCLOAK_URL,
+      wellKnown: `${process.env.KEYCLOAK_URL}/.well-known/openid-configuration`
+      //idToken: true
+    }),
+  ],
+  session: {
+    strategy: "jwt",
+  },
+  callbacks: {
+    async jwt({ token, user, account }) {
+      if (account) {
+        token.accessToken = account.access_token;
+        token.refreshToken = account.refresh_token;
+        token.accessTokenExpired = account.expires_at! * 1000;
+        token.user = user;
+
+        return token;
+      }
+      return token;
+    },
+    async session({ session, token }) {
+      session.token = token as unknown as Token;
+
+      return session;
+    },
+  },
+  secret: process.env.NEXTAUTH_SECRET,
+};
diff --git a/src/app/api/auth/[...nextauth]/route.ts b/src/app/api/auth/[...nextauth]/route.ts
@@ -0,0 +1,6 @@
+import { authOptions } from "@/app/api/auth/[...nextauth]/authOptions";
+import NextAuth from "next-auth";
+
+const handler = NextAuth(authOptions);
+
+export { handler as GET, handler as POST };
diff --git a/src/app/api/getSession.ts b/src/app/api/getSession.ts
@@ -0,0 +1,20 @@
+/*import { getServerSession } from "next-auth/next";
+import { authOptions } from "./auth/[...nextauth]/authOptions";
+
+export async function getSession(req) {
+  try {
+    const session = await getServerSession(authOptions, req);
+
+    if (!session) {
+      return null;
+    }
+
+    return {
+      user: session.user,
+      accessToken: session.accessToken,
+    };
+  } catch (error) {
+    console.error("Error fetching session:", error);
+    return null;
+  }
+}*/
diff --git a/src/app/authenticate/page.tsx b/src/app/authenticate/page.tsx
@@ -0,0 +1,27 @@
+
+'use client';
+import { getSession, signIn } from "next-auth/react";
+import { useEffect } from "react";
+
+export default async function Home(req) {
+  const session = await getSession({ req });
+
+  const accessToken = session.token.accessToken;
+  console.log(accessToken);
+  //const { data: session } = useSession();
+
+  return (
+    <div>
+      { session ? 
+        <button>
+          {session.token.accessToken}
+          Logout
+        </button>
+      : 
+        <button onClick={() => signIn("keycloak")}>
+          Login
+        </button>
+      }
+    </div>
+  );
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -1,6 +1,8 @@
 import type { Metadata } from "next";
 import { Inter } from "next/font/google";
 import "./globals.css";
+import SessionProviderWrapper from "../components/SessionProviderWrapper";
+import { ReactNode } from "react";
 
 const inter = Inter({ subsets: ["latin"] });
 
@@ -16,7 +18,9 @@ export default function RootLayout({
 }>) {
   return (
     <html lang="en">
-      <body className={inter.className}>{children}</body>
+      <body className={inter.className}>
+        <SessionProviderWrapper>{children}</SessionProviderWrapper>
+      </body>
     </html>
   );
 }
diff --git a/src/app/page/layout.tsx b/src/app/page/layout.tsx
diff --git a/src/app/page/page.tsx b/src/app/page/page.tsx
diff --git a/src/auth.ts b/src/auth.ts
@@ -0,0 +1,69 @@
+/*import NextAuth from "next-auth";
+import { JWT } from "next-auth/jwt";
+import KeycloakProvider from "next-auth/providers/keycloak";
+
+const params = {
+    client_id: process.env.KEYCLOAK_CLIENT_ID,
+    client_secret: process.env.KEYCLOAK_CLIENT_SECRET,
+    grant_type: "refresh_token",
+}
+
+function refreshAccessToken(refresh_token: string){
+    return fetch(`${process.env.KEYCLOAK_ISSUER}/protocol/openid-connect/token`, {
+        headers: {
+            "Content-Type": "application/x-www-form-urlencoded"
+        },
+        body: new URLSearchParams({
+            ...params,
+            refresh_token
+        }),
+        method: "POST"
+    });
+}
+
+export const { auth, handlers: { GET, POST } , signIn, signOut } = NextAuth({
+    session: {
+        strategy: "jwt",
+        maxAge: 60 * 30
+    },
+    callbacks: {
+        async session({ session, token }){
+            session.idToken = token.idToken
+            session.refreshToken = token.refreshToken
+            return session;
+        },
+        async jwt({ token, account }) {
+            if(account){
+                token.idToken = account.id_token;
+                token.accessToken = account.access_token;
+                token.refreshToken = account.refresh_token;
+                token.expiresAt = account.expires_at;
+                token.userId = account.userId;
+                return token;
+            }
+            if(Date.now() < (token.expiresAt!)){
+                return token;
+            }
+            try{
+                const response = await refreshAccessToken(token.refreshToken);
+                if(!response.ok) throw new Error();
+                const newToken = await response.json();
+                const updatedToken: JWT = {
+                    ...token,
+                    idToken: newToken.id_token,
+                    accessToken: newToken.access_token,
+                    expiresAt: newToken.expires_at
+                }
+                return updatedToken;
+            }
+            catch(error){
+                return { ...token, error: "RefreshAccessTokenError" }
+            }
+        }
+    },
+    providers: [KeycloakProvider({
+        clientId: process.env.KEYCLOAK_CLIENT_ID, 
+        clientSecret: process.env.KEYCLOAK_CLIENT_SECRET, 
+        issuer: process.env.KEYCLOAK_URL,
+    })]
+})*/
diff --git a/src/components/Authentication.tsx b/src/components/Authentication.tsx
@@ -0,0 +1,17 @@
+"use client";
+
+import { signIn, signOut, useSession } from "next-auth/react";
+
+export default function AuthButton() {
+  const { data: session } = useSession();
+
+  return (
+    <div>
+      {!session ? (
+        <button onClick={() => signIn("keycloak")}>Sign in</button>
+      ) : (
+        <button onClick={() => signOut()}>Sign out</button>
+      )}
+    </div>
+  );
+}
diff --git a/src/components/SessionProviderWrapper.tsx b/src/components/SessionProviderWrapper.tsx
@@ -0,0 +1,8 @@
+"use client";
+
+import { SessionProvider } from "next-auth/react";
+import { ReactNode } from "react";
+
+export default function SessionProviderWrapper({ children }: { children: ReactNode }) {
+  return <SessionProvider>{children}</SessionProvider>;
+}
diff --git a/src/components/utils/api.ts b/src/components/utils/api.ts
@@ -0,0 +1,11 @@
+import axios, { AxiosInstance } from 'axios';
+
+const apiClient = (token: string | null): AxiosInstance => {
+  return axios.create({
+    headers: {
+      Authorization: token ? `Bearer ${token}` : '',
+    },
+  });
+};
+
+export default apiClient;
diff --git a/src/types/next-auth.d.ts b/src/types/next-auth.d.ts
@@ -1,5 +1,5 @@
-import NextAuth from "next-auth";
- 
+import nextAuth from "next-auth";
+
 declare module "next-auth" {
   interface Session {
     token: Token;

diff --git a/src/types/node-env.d.ts b/src/types/node-env.d.ts
@@ -1,9 +1,11 @@
-declare namespace NodeJS {
+/*declare namespace NodeJS {
     export interface ProcessEnv {
+      AUTH_URL: string
+      AUTH_SECRET: string
       KEYCLOAK_CLIENT_ID: string
       KEYCLOAK_CLIENT_SECRET: string
-      KEYCLOAK_ISSUER: string
+      KEYCLOAK_URL: string
       MUSIC_API_URL: string
       SESSION_API_URL: string
     }
-}
+}*/
diff --git a/tsconfig.json b/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "typeRoots": ["./types", "./node_modules/@types"],
     "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,