nuxt-auth-utils 0.5.9 → 0.5.11

package/README.md

@@ -16,14 +16,14 @@ Add Authentication to Nuxt applications with secured & sealed cookies sessions.
 ## Features
 
 - [Hybrid Rendering](#hybrid-rendering) support (SSR / CSR / SWR / Prerendering)
-- [20+ OAuth Providers](#supported-oauth-providers)
+- [30+ OAuth Providers](#supported-oauth-providers)
 - [Password Hashing](#password-hashing)
 - [WebAuthn (passkey)](#webauthn-passkey)
 - [`useUserSession()` Vue composable](#vue-composable)
 - [Tree-shakable server utils](#server-utils)
 - [`<AuthState>` component](#authstate-component)
 - [Extendable with hooks](#extend-session)
-- [WebSocket support](#websockets-support)
+- [WebSocket support](#websocket-support)
 
 It has few dependencies (only from [UnJS](https://github.com/unjs)), run on multiple JS environments (Node, Deno, Workers) and is fully typed with TypeScript.
 
@@ -62,7 +62,7 @@ Nuxt Auth Utils automatically adds some plugins to fetch the current user sessio
 
 ```vue
 <script setup>
-const { loggedIn, user, session, fetch, clear } = useUserSession()
+const { loggedIn, user, session, fetch, clear, openInPopup } = useUserSession()
 </script>
 
 <template>
@@ -74,6 +74,8 @@ const { loggedIn, user, session, fetch, clear } = useUserSession()
   <div v-else>
     <h1>Not logged in</h1>
     <a href="/auth/github">Login with GitHub</a>
+    <!-- or open the OAuth route in a popup -->
+    <button @click="openInPopup('/auth/github')">Login with GitHub</button>
   </div>
 </template>
 ```
@@ -106,6 +108,10 @@ interface UserSessionComposable {
    * Clear the user session and remove the session cookie.
    */
   clear: () => Promise<void>
+  /**
+   * Open the OAuth route in a popup that auto-closes when successful.
+   */
+  openInPopup: (route: string, size?: { width?: number, height?: number }) => void
 }
 ```
 
@@ -205,6 +211,7 @@ It can also be set using environment variables:
 
 #### Supported OAuth Providers
 
+- Apple
 - Atlassian
 - Auth0
 - Authentik
@@ -215,6 +222,7 @@ It can also be set using environment variables:
 - Facebook
 - GitHub
 - GitLab
+- Gitea
 - Google
 - Hubspot
 - Instagram
@@ -597,7 +605,7 @@ You can use the `placeholder` slot to show a placeholder on server-side and whil
 
 If you are caching your routes with `routeRules`, please make sure to use [Nitro](https://github.com/unjs/nitro) >= `2.9.7` to support the client-side fetching of the user session.
 
-## WebSockets Support
+## WebSocket Support
 
 Nuxt Auth Utils is compatible with [Nitro WebSockets](https://nitro.build/guide/websocket).
 
@@ -624,8 +632,8 @@ export default defineWebSocketHandler({
   },
   async open(peer) {
     const { user } = await requireUserSession(peer)
-    const username = Object.values(user).filter(Boolean).join(' ')
-    peer.send(`Hello, ${username}!`)
+
+    peer.send(`Hello, ${user.name}!`)
   },
   message(peer, message) {
     peer.send(`Echo: ${message}`)

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "auth-utils",
   "configKey": "auth",
-  "version": "0.5.9",
+  "version": "0.5.11",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/module.mjs

@@ -97,6 +97,12 @@ const module = defineNuxtModule({
       authenticate: {}
     });
     runtimeConfig.oauth = defu(runtimeConfig.oauth, {});
+    runtimeConfig.oauth.gitea = defu(runtimeConfig.oauth.gitea, {
+      clientId: "",
+      clientSecret: "",
+      redirectURL: "",
+      baseURL: ""
+    });
     runtimeConfig.oauth.github = defu(runtimeConfig.oauth.github, {
       clientId: "",
       clientSecret: "",
@@ -274,6 +280,13 @@ const module = defineNuxtModule({
       clientSecret: "",
       redirectURL: ""
     });
+    runtimeConfig.oauth.apple = defu(runtimeConfig.oauth.apple, {
+      teamId: "",
+      keyId: "",
+      privateKey: "",
+      redirectURL: "",
+      clientId: ""
+    });
   }
 });
 

package/dist/runtime/app/composables/session.js

@@ -28,12 +28,32 @@ export function useUserSession() {
       authReadyState.value = true;
     }
   };
+  const popupListener = (e) => {
+    if (e.key === "temp-nuxt-auth-utils-popup") {
+      fetch();
+      window.removeEventListener("storage", popupListener);
+    }
+  };
+  const openInPopup = (route, size = {}) => {
+    localStorage.setItem("temp-nuxt-auth-utils-popup", "true");
+    const width = size.width ?? 960;
+    const height = size.height ?? 600;
+    const top = (window.top?.outerHeight ?? 0) / 2 + (window.top?.screenY ?? 0) - height / 2;
+    const left = (window.top?.outerWidth ?? 0) / 2 + (window.top?.screenX ?? 0) - width / 2;
+    window.open(
+      route,
+      "nuxt-auth-utils-popup",
+      `width=${width}, height=${height}, top=${top}, left=${left}, toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no`
+    );
+    window.addEventListener("storage", popupListener);
+  };
   return {
     ready: computed(() => authReadyState.value),
     loggedIn: computed(() => Boolean(sessionState.value.user)),
     user: computed(() => sessionState.value.user || null),
     session: sessionState,
     fetch,
+    openInPopup,
     clear
   };
 }

package/dist/runtime/app/plugins/session.client.js

@@ -7,4 +7,9 @@ export default defineNuxtPlugin(async (nuxtApp) => {
       await useUserSession().fetch();
     });
   }
+  if (localStorage.getItem("temp-nuxt-auth-utils-popup")) {
+    localStorage.removeItem("temp-nuxt-auth-utils-popup");
+    const error = useError();
+    if (!error.value) window.close();
+  }
 });

package/dist/runtime/server/lib/oauth/apple.d.ts

@@ -0,0 +1,73 @@
+import type { OAuthConfig } from '#auth-utils';
+export interface OAuthAppleConfig {
+    /**
+     * Apple OAuth Client ID
+     * @default process.env.NUXT_OAUTH_APPLE_CLIENT_ID
+     */
+    clientId?: string;
+    /**
+     * Apple OAuth team ID
+     * @default process.env.NUXT_OAUTH_APPLE_TEAM_ID
+     */
+    teamId?: string;
+    /**
+     * Apple OAuth key identifier
+     * @default process.env.NUXT_OAUTH_APPLE_KEY_ID
+     */
+    keyId?: string;
+    /**
+     * Apple OAuth Private Key. Linebreaks must be replaced with \n
+     * @example '-----BEGIN PRIVATE KEY-----\nMIGTAgEAMBMGByqGSM...\n-----END PRIVATE KEY-----'
+     * @default process.env.NUXT_OAUTH_APPLE_PRIVATE_KEY
+     */
+    privateKey?: string;
+    /**
+     * Apple OAuth Scope. Apple wants this to be a string separated by spaces, but for consistency with other providers, we also allow an array of strings.
+     * @default ''
+     * @see https://developer.apple.com/documentation/sign_in_with_apple/clientconfigi/3230955-scope
+     * @example 'name email'
+     */
+    scope?: string | string[];
+    /**
+     * Apple OAuth Authorization URL
+     * @default 'https://appleid.apple.com/auth/authorize'
+     */
+    authorizationURL?: string;
+    /**
+     * Extra authorization parameters to provide to the authorization URL
+     * @see https://developer.apple.com/documentation/sign_in_with_apple/clientconfigi/3230955-scope
+     * @example { usePop: true }
+     */
+    authorizationParams?: Record<string, string | boolean>;
+    /**
+     * Apple OAuth Token URL
+     * @default 'https://appleid.apple.com/auth/token'
+     */
+    tokenURL?: string;
+    /**
+     * Redirect URL to to allow overriding for situations like prod failing to determine public hostname
+     * @default process.env.NUXT_OAUTH_APPLE_REDIRECT_URL or current URL
+     */
+    redirectURL?: string;
+}
+export interface OAuthAppleTokens {
+    iss: string;
+    aud: string;
+    exp: number;
+    iat: number;
+    sub: string;
+    at_hash: string;
+    email: string;
+    email_verified: boolean;
+    is_private_email: boolean;
+    auth_time: number;
+    nonce_supported: boolean;
+}
+export interface OAuthAppleUser {
+    name?: {
+        firstName?: string;
+        lastName?: string;
+    };
+    email?: string;
+}
+export declare function defineOAuthAppleEventHandler({ config, onSuccess, onError, }: OAuthConfig<OAuthAppleConfig>): import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<void>>;

package/dist/runtime/server/lib/oauth/apple.js

@@ -0,0 +1,77 @@
+import { eventHandler, getRequestHeader, readBody, sendRedirect } from "h3";
+import { withQuery } from "ufo";
+import { defu } from "defu";
+import { handleMissingConfiguration, handleAccessTokenErrorResponse, getOAuthRedirectURL, requestAccessToken, signJwt, verifyJwt } from "../utils.js";
+import { useRuntimeConfig } from "#imports";
+export function defineOAuthAppleEventHandler({
+  config,
+  onSuccess,
+  onError
+}) {
+  return eventHandler(async (event) => {
+    config = defu(config, useRuntimeConfig(event).oauth?.apple, {
+      authorizationURL: config?.authorizationURL || "https://appleid.apple.com/auth/authorize",
+      authorizationParams: {}
+    });
+    if (!config.teamId || !config.keyId || !config.privateKey || !config.clientId) {
+      return handleMissingConfiguration(event, "apple", ["teamId", "keyId", "privateKey", "clientId"], onError);
+    }
+    const isPost = getRequestHeader(event, "content-type") === "application/x-www-form-urlencoded";
+    let code;
+    let user;
+    if (isPost) {
+      ({ code, user } = await readBody(event));
+    }
+    if (!isPost || !code) {
+      const redirectURL = config.redirectURL || getOAuthRedirectURL(event);
+      config.scope = Array.isArray(config.scope) ? config.scope.join(" ") : config.scope || "name email";
+      return sendRedirect(
+        event,
+        withQuery(config.authorizationURL, {
+          response_type: "code",
+          response_mode: "form_post",
+          client_id: config.clientId,
+          redirect_uri: redirectURL,
+          scope: config.scope,
+          ...config.authorizationParams
+        })
+      );
+    }
+    try {
+      const secret = await signJwt(
+        {
+          iss: config.teamId,
+          aud: "https://appleid.apple.com",
+          sub: config.clientId
+        },
+        {
+          privateKey: config.privateKey,
+          keyId: config.keyId,
+          teamId: config.teamId,
+          clientId: config.clientId,
+          expiresIn: "5m"
+        }
+      );
+      const accessTokenResult = await requestAccessToken(config.tokenURL || "https://appleid.apple.com/auth/token", {
+        params: {
+          client_id: config.clientId,
+          client_secret: secret,
+          code,
+          grant_type: "authorization_code",
+          redirect_uri: config.redirectURL
+        }
+      });
+      const tokens = await verifyJwt(accessTokenResult.id_token, {
+        publicJwkUrl: "https://appleid.apple.com/auth/keys",
+        audience: config.clientId,
+        issuer: "https://appleid.apple.com"
+      });
+      if (!tokens) {
+        return handleAccessTokenErrorResponse(event, "apple", tokens, onError);
+      }
+      return onSuccess(event, { user, tokens });
+    } catch (error) {
+      return handleAccessTokenErrorResponse(event, "apple", error, onError);
+    }
+  });
+}

package/dist/runtime/server/lib/oauth/gitea.d.ts

@@ -0,0 +1,51 @@
+import type { OAuthConfig } from '#auth-utils';
+export interface OAuthGiteaConfig {
+    /**
+     * Gitea OAuth Client ID
+     * @default process.env.NUXT_OAUTH_GITEA_CLIENT_ID
+     */
+    clientId?: string;
+    /**
+     * Gitea OAuth Client Secret
+     * @default process.env.NUXT_OAUTH_GITEA_CLIENT_SECRET
+     */
+    clientSecret?: string;
+    /**
+     * Gitea OAuth Scope
+     * @default ['read:user']
+     * @see https://docs.gitea.io/en-us/oauth2-provider/
+     * @example ['read:user']
+     */
+    scope?: string[];
+    /**
+     * Require email from user, adds the ['email'] scope if not present
+     * @default false
+     */
+    emailRequired?: boolean;
+    /**
+     * Gitea OAuth Authorization URL
+     * @default '/login/oauth/authorize'
+     */
+    authorizationURL?: string;
+    /**
+     * Gitea OAuth Token URL
+     * @default '/login/oauth/access_token'
+     */
+    tokenURL?: string;
+    /**
+     * Extra authorization parameters to provide to the authorization URL
+     * @see https://docs.gitea.io/en-us/oauth2-provider/
+     */
+    authorizationParams?: Record<string, string>;
+    /**
+     * Redirect URL to to allow overriding for situations like prod failing to determine public hostname
+     * @default process.env.NUXT_OAUTH_GITEA_REDIRECT_URL
+     */
+    redirectURL?: string;
+    /**
+     * URL of your Gitea instance
+     * @default 'https://gitea.com'
+     */
+    baseURL?: string;
+}
+export declare function defineOAuthGiteaEventHandler({ config, onSuccess, onError, }: OAuthConfig<OAuthGiteaConfig>): import("h3").EventHandler<import("h3").EventHandlerRequest, Promise<void>>;

package/dist/runtime/server/lib/oauth/gitea.js

@@ -0,0 +1,85 @@
+import { eventHandler, getQuery, sendRedirect } from "h3";
+import { withQuery } from "ufo";
+import { defu } from "defu";
+import {
+  handleMissingConfiguration,
+  handleAccessTokenErrorResponse,
+  getOAuthRedirectURL,
+  requestAccessToken
+} from "../utils.js";
+import { useRuntimeConfig, createError } from "#imports";
+export function defineOAuthGiteaEventHandler({
+  config,
+  onSuccess,
+  onError
+}) {
+  return eventHandler(async (event) => {
+    const runtimeConfig = useRuntimeConfig(event).oauth?.gitea;
+    const baseURL = config?.baseURL ?? runtimeConfig.baseURL ?? "https://gitea.com";
+    config = defu(config, runtimeConfig, {
+      authorizationURL: `${baseURL}/login/oauth/authorize`,
+      tokenURL: `${baseURL}/login/oauth/access_token`,
+      authorizationParams: {}
+    });
+    const query = getQuery(event);
+    if (query.error) {
+      const error = createError({
+        statusCode: 401,
+        message: `Gitea login failed: ${query.error || "Unknown error"}`,
+        data: query
+      });
+      if (!onError) throw error;
+      return onError(event, error);
+    }
+    if (!config.clientId || !config.clientSecret) {
+      return handleMissingConfiguration(
+        event,
+        "gitea",
+        ["clientId", "clientSecret"],
+        onError
+      );
+    }
+    const redirectURL = config.redirectURL || getOAuthRedirectURL(event);
+    if (!query.code) {
+      config.scope = config.scope || [];
+      if (!config.scope.length) {
+        config.scope.push("read:user");
+      }
+      if (config.emailRequired && !config.scope.includes("email")) {
+        config.scope.push("email");
+      }
+      return sendRedirect(
+        event,
+        withQuery(config.authorizationURL, {
+          response_type: "code",
+          client_id: config.clientId,
+          redirect_uri: redirectURL,
+          scope: config.scope.join(" "),
+          ...config.authorizationParams
+        })
+      );
+    }
+    const tokens = await requestAccessToken(config.tokenURL, {
+      body: {
+        grant_type: "authorization_code",
+        client_id: config.clientId,
+        client_secret: config.clientSecret,
+        redirect_uri: redirectURL,
+        code: query.code
+      }
+    });
+    if (tokens.error) {
+      return handleAccessTokenErrorResponse(event, "gitea", tokens, onError);
+    }
+    const accessToken = tokens.access_token;
+    const user = await $fetch(`${baseURL}/api/v1/user`, {
+      headers: {
+        Authorization: `token ${accessToken}`
+      }
+    });
+    return onSuccess(event, {
+      user,
+      tokens
+    });
+  });
+}

package/dist/runtime/server/lib/oauth/github.js

@@ -76,6 +76,7 @@ export function defineOAuthGitHubEventHandler({ config, onSuccess, onError }) {
         return onError(event, error);
       }
       user.email = primaryEmail.email;
+      user.email_verified = primaryEmail.verified;
     }
     return onSuccess(event, {
       user,

package/dist/runtime/server/lib/oauth/microsoft.js

@@ -16,14 +16,15 @@ export function defineOAuthMicrosoftEventHandler({ config, onSuccess, onError })
     const tokenURL = config.tokenURL || `https://login.microsoftonline.com/${config.tenant}/oauth2/v2.0/token`;
     const redirectURL = config.redirectURL || getOAuthRedirectURL(event);
     if (!query.code) {
-      const scope = config.scope && config.scope.length > 0 ? config.scope : ["User.Read"];
+      config.scope = config.scope && config.scope.length > 0 ? config.scope : ["User.Read"];
+      config.scope = [...new Set(config.scope)];
       return sendRedirect(
         event,
         withQuery(authorizationURL, {
           client_id: config.clientId,
           response_type: "code",
           redirect_uri: redirectURL,
-          scope: scope.join(" "),
+          scope: config.scope.join(" "),
           ...config.authorizationParams
         })
       );

package/dist/runtime/server/lib/utils.d.ts

@@ -34,4 +34,29 @@ export declare function requestAccessToken(url: string, options: RequestAccessTo
  */
 export declare function handleAccessTokenErrorResponse(event: H3Event, oauthProvider: OAuthProvider, oauthError: any, onError?: OnError): void | Promise<void>;
 export declare function handleMissingConfiguration(event: H3Event, provider: OAuthProvider, missingKeys: string[], onError?: OnError): void | Promise<void>;
+/**
+ * JWT signing using jose
+ *
+ * @see https://github.com/panva/jose
+ */
+interface JWTSignOptions {
+    privateKey: string;
+    keyId: string;
+    teamId?: string;
+    clientId?: string;
+    algorithm?: 'ES256' | 'RS256';
+    expiresIn?: string;
+}
+export declare function signJwt<T extends Record<string, unknown>>(payload: T, options: JWTSignOptions): Promise<string>;
+/**
+ * Verify a JWT token using jose - will throw error if invalid
+ *
+ * @see https://github.com/panva/jose
+ */
+interface JWTVerifyOptions {
+    publicJwkUrl: string;
+    audience: string;
+    issuer: string;
+}
+export declare function verifyJwt<T>(token: string, options: JWTVerifyOptions): Promise<T>;
 export {};

package/dist/runtime/server/lib/utils.js

@@ -1,6 +1,7 @@
 import { getRequestURL } from "h3";
 import { FetchError } from "ofetch";
 import { snakeCase, upperFirst } from "scule";
+import * as jose from "jose";
 import { createError } from "#imports";
 export function getOAuthRedirectURL(event) {
   const requestURL = getRequestURL(event);
@@ -44,3 +45,19 @@ export function handleMissingConfiguration(event, provider, missingKeys, onError
   if (!onError) throw error;
   return onError(event, error);
 }
+export async function signJwt(payload, options) {
+  const now = Math.floor(Date.now() / 1e3);
+  const privateKey = await jose.importPKCS8(
+    options.privateKey.replace(/\\n/g, "\n"),
+    options.algorithm || "ES256"
+  );
+  return new jose.SignJWT(payload).setProtectedHeader({ alg: options.algorithm || "ES256", kid: options.keyId }).setIssuedAt(now).setExpirationTime(options.expiresIn || "5m").sign(privateKey);
+}
+export async function verifyJwt(token, options) {
+  const JWKS = jose.createRemoteJWKSet(new URL(options.publicJwkUrl));
+  const { payload } = await jose.jwtVerify(token, JWKS, {
+    audience: options.audience,
+    issuer: options.issuer
+  });
+  return payload;
+}

package/dist/runtime/types/oauth-config.d.ts

@@ -1,5 +1,5 @@
 import type { H3Event, H3Error } from 'h3';
-export type OAuthProvider = 'atlassian' | 'auth0' | 'authentik' | 'battledotnet' | 'cognito' | 'discord' | 'dropbox' | 'facebook' | 'github' | 'gitlab' | 'google' | 'hubspot' | 'instagram' | 'keycloak' | 'line' | 'linear' | 'linkedin' | 'microsoft' | 'paypal' | 'polar' | 'spotify' | 'seznam' | 'steam' | 'strava' | 'tiktok' | 'twitch' | 'vk' | 'workos' | 'x' | 'xsuaa' | 'yandex' | 'zitadel' | (string & {});
+export type OAuthProvider = 'atlassian' | 'auth0' | 'authentik' | 'battledotnet' | 'cognito' | 'discord' | 'dropbox' | 'facebook' | 'gitea' | 'github' | 'gitlab' | 'google' | 'hubspot' | 'instagram' | 'keycloak' | 'line' | 'linear' | 'linkedin' | 'microsoft' | 'paypal' | 'polar' | 'spotify' | 'seznam' | 'steam' | 'strava' | 'tiktok' | 'twitch' | 'vk' | 'workos' | 'x' | 'xsuaa' | 'yandex' | 'zitadel' | 'apple' | (string & {});
 export type OnError = (event: H3Event, error: H3Error) => Promise<void> | void;
 export interface OAuthConfig<TConfig, TUser = any, TTokens = any> {
     config?: TConfig;

package/dist/runtime/types/session.d.ts

@@ -45,4 +45,11 @@ export interface UserSessionComposable {
      * Clear the user session and remove the session cookie.
      */
     clear: () => Promise<void>;
+    /**
+     * Open the OAuth route in a popup that auto-closes when successful.
+     */
+    openInPopup: (route: string, size?: {
+        width?: number;
+        height?: number;
+    }) => void;
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-auth-utils",
-  "version": "0.5.9",
+  "version": "0.5.11",
   "description": "Add Authentication to Nuxt applications with secured & sealed cookies sessions.",
   "repository": {
     "type": "git",
@@ -40,6 +40,7 @@
     "defu": "^6.1.4",
     "h3": "^1.14.0",
     "hookable": "^5.5.3",
+    "jose": "^5.9.6",
     "ofetch": "^1.4.1",
     "ohash": "^1.1.4",
     "openid-client": "^6.1.7",