@stackframe/stack 2.4.18 → 2.4.20

package/dist/lib/stack-app.d.mts

@@ -4,7 +4,7 @@ import { ReadonlyJson } from '@stackframe/stack-shared/dist/utils/json';
 import { ProjectUpdateOptions, ApiKeySetCreateOptions } from '@stackframe/stack-shared/dist/interface/adminInterface';
 import { ServerUserUpdateJson, ServerTeamCustomizableJson, ServerPermissionDefinitionCustomizableJson, ServerPermissionDefinitionJson, EmailTemplateType } from '@stackframe/stack-shared/dist/interface/serverInterface';
 import { ListEmailTemplatesCrud, EmailTemplateCrud } from '@stackframe/stack-shared/dist/interface/crud/email-templates';
-import { Session } from '@stackframe/stack-shared/dist/sessions';
+import { InternalSession } from '@stackframe/stack-shared/dist/sessions';
 
 type RequestLike = {
     headers: {
@@ -45,7 +45,7 @@ type StackServerAppConstructorOptions<HasTokenStore extends boolean, ProjectId e
 type StackAdminAppConstructorOptions<HasTokenStore extends boolean, ProjectId extends string> = ((StackServerAppConstructorOptions<HasTokenStore, ProjectId> & {
     superSecretAdminKey?: string;
 }) | (Omit<StackServerAppConstructorOptions<HasTokenStore, ProjectId>, "publishableClientKey" | "secretServerKey"> & {
-    projectOwnerSession: Session;
+    projectOwnerSession: InternalSession;
 }));
 type StackClientAppJson<HasTokenStore extends boolean, ProjectId extends string> = StackClientAppConstructorOptions<HasTokenStore, ProjectId> & {
     uniqueIdentifier: string;
@@ -54,11 +54,21 @@ declare const stackAppInternalsSymbol: unique symbol;
 type RedirectToOptions = {
     replace?: boolean;
 };
+type Session = {
+    getTokens(): Promise<{
+        accessToken: string | null;
+        refreshToken: string | null;
+    }>;
+};
+/**
+ * Contains everything related to the current user session.
+ */
 type Auth<T, C> = {
-    readonly session: Session;
-    updateSelectedTeam(this: T, team: Team | null): Promise<void>;
-    update(this: T, user: C): Promise<void>;
+    readonly _internalSession: InternalSession;
+    readonly currentSession: Session;
     signOut(this: T): Promise<void>;
+    update(this: T, user: C): Promise<void>;
+    updateSelectedTeam(this: T, team: Team | null): Promise<void>;
     sendVerificationEmail(this: T): Promise<KnownErrors["EmailAlreadyVerified"] | void>;
     updatePassword(this: T, options: {
         oldPassword: string;
@@ -252,6 +262,69 @@ type StackClientApp<HasTokenStore extends boolean = boolean, ProjectId extends s
     verifyPasswordResetCode(code: string): Promise<KnownErrors["PasswordResetCodeError"] | void>;
     verifyEmail(code: string): Promise<KnownErrors["EmailVerificationError"] | void>;
     signInWithMagicLink(code: string): Promise<KnownErrors["MagicLinkError"] | void>;
+    /**
+     * With most browsers now disabling third-party cookies by default, the best way to send authenticated requests
+     * across different origins is to pass the tokens in a header.
+     *
+     * This function returns a header object that can be used with `fetch` or other HTTP request libraries to send
+     * authenticated requests.
+     *
+     * On the server, you can then pass in the `Request` object to the `tokenStore` option
+     * on your Stack app to fetch user details. Please note that CORS by default does not allow custom headers, so you
+     * must set the [`Access-Control-Allow-Headers` header](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Headers)
+     * to include `x-stack-auth` in the CORS preflight response.
+     *
+     * Example:
+     *
+     * ```ts
+     * // client
+     * const res = await fetch("https://api.example.com", {
+     *   headers: {
+     *     ...await stackApp.getCrossOriginHeaders()
+     *     // you can also add your own headers here
+     *   },
+     * });
+     *
+     * // server
+     * function handleRequest(req: Request) {
+     *   const user = await stackServerApp.getUser({ tokenStore: req });
+     *   return new Response("Welcome, " + user.displayName);
+     * }
+     * ```
+     */
+    getCrossOriginHeaders(): Promise<{
+        "x-stack-auth": string;
+    }>;
+    /**
+     * With most browsers now disabling third-party cookies by default, there need to be new ways to send authenticated
+     * requests across different origins. While `getCrossOriginHeaders` is the recommended way to do this, there
+     * are some cases where you might want to send the tokens differently, for example when you are using WebSockets
+     * or non-HTTP protocols.
+     *
+     * This function returns a token object that can be JSON-serialized and sent to the server in any way you like.
+     * There, you can use the `tokenStore` option on your Stack app to fetch user details.
+     *
+     * Example:
+     *
+     * ```ts
+     * // client
+     * const res = await rpcCall(rpcEndpoint, {
+     *   data: {
+     *     auth: await stackApp.getCrossOriginTokenObject(),
+     *   },
+     * });
+     *
+     * // server
+     * function handleRequest(data) {
+     *   const user = await stackServerApp.getUser({ tokenStore: data.auth });
+     *   return new Response("Welcome, " + user.displayName);
+     * }
+     * ```
+     */
+    getCrossOriginTokenObject(): Promise<{
+        accessToken: string | null;
+        refreshToken: string | null;
+    }>;
     [stackAppInternalsSymbol]: {
         toClientJson(): StackClientAppJson<HasTokenStore, ProjectId>;
         setCurrentUser(userJsonPromise: Promise<UserJson | null>): void;

package/dist/lib/stack-app.d.ts

@@ -4,7 +4,7 @@ import { ReadonlyJson } from '@stackframe/stack-shared/dist/utils/json';
 import { ProjectUpdateOptions, ApiKeySetCreateOptions } from '@stackframe/stack-shared/dist/interface/adminInterface';
 import { ServerUserUpdateJson, ServerTeamCustomizableJson, ServerPermissionDefinitionCustomizableJson, ServerPermissionDefinitionJson, EmailTemplateType } from '@stackframe/stack-shared/dist/interface/serverInterface';
 import { ListEmailTemplatesCrud, EmailTemplateCrud } from '@stackframe/stack-shared/dist/interface/crud/email-templates';
-import { Session } from '@stackframe/stack-shared/dist/sessions';
+import { InternalSession } from '@stackframe/stack-shared/dist/sessions';
 
 type RequestLike = {
     headers: {
@@ -45,7 +45,7 @@ type StackServerAppConstructorOptions<HasTokenStore extends boolean, ProjectId e
 type StackAdminAppConstructorOptions<HasTokenStore extends boolean, ProjectId extends string> = ((StackServerAppConstructorOptions<HasTokenStore, ProjectId> & {
     superSecretAdminKey?: string;
 }) | (Omit<StackServerAppConstructorOptions<HasTokenStore, ProjectId>, "publishableClientKey" | "secretServerKey"> & {
-    projectOwnerSession: Session;
+    projectOwnerSession: InternalSession;
 }));
 type StackClientAppJson<HasTokenStore extends boolean, ProjectId extends string> = StackClientAppConstructorOptions<HasTokenStore, ProjectId> & {
     uniqueIdentifier: string;
@@ -54,11 +54,21 @@ declare const stackAppInternalsSymbol: unique symbol;
 type RedirectToOptions = {
     replace?: boolean;
 };
+type Session = {
+    getTokens(): Promise<{
+        accessToken: string | null;
+        refreshToken: string | null;
+    }>;
+};
+/**
+ * Contains everything related to the current user session.
+ */
 type Auth<T, C> = {
-    readonly session: Session;
-    updateSelectedTeam(this: T, team: Team | null): Promise<void>;
-    update(this: T, user: C): Promise<void>;
+    readonly _internalSession: InternalSession;
+    readonly currentSession: Session;
     signOut(this: T): Promise<void>;
+    update(this: T, user: C): Promise<void>;
+    updateSelectedTeam(this: T, team: Team | null): Promise<void>;
     sendVerificationEmail(this: T): Promise<KnownErrors["EmailAlreadyVerified"] | void>;
     updatePassword(this: T, options: {
         oldPassword: string;
@@ -252,6 +262,69 @@ type StackClientApp<HasTokenStore extends boolean = boolean, ProjectId extends s
     verifyPasswordResetCode(code: string): Promise<KnownErrors["PasswordResetCodeError"] | void>;
     verifyEmail(code: string): Promise<KnownErrors["EmailVerificationError"] | void>;
     signInWithMagicLink(code: string): Promise<KnownErrors["MagicLinkError"] | void>;
+    /**
+     * With most browsers now disabling third-party cookies by default, the best way to send authenticated requests
+     * across different origins is to pass the tokens in a header.
+     *
+     * This function returns a header object that can be used with `fetch` or other HTTP request libraries to send
+     * authenticated requests.
+     *
+     * On the server, you can then pass in the `Request` object to the `tokenStore` option
+     * on your Stack app to fetch user details. Please note that CORS by default does not allow custom headers, so you
+     * must set the [`Access-Control-Allow-Headers` header](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Headers)
+     * to include `x-stack-auth` in the CORS preflight response.
+     *
+     * Example:
+     *
+     * ```ts
+     * // client
+     * const res = await fetch("https://api.example.com", {
+     *   headers: {
+     *     ...await stackApp.getCrossOriginHeaders()
+     *     // you can also add your own headers here
+     *   },
+     * });
+     *
+     * // server
+     * function handleRequest(req: Request) {
+     *   const user = await stackServerApp.getUser({ tokenStore: req });
+     *   return new Response("Welcome, " + user.displayName);
+     * }
+     * ```
+     */
+    getCrossOriginHeaders(): Promise<{
+        "x-stack-auth": string;
+    }>;
+    /**
+     * With most browsers now disabling third-party cookies by default, there need to be new ways to send authenticated
+     * requests across different origins. While `getCrossOriginHeaders` is the recommended way to do this, there
+     * are some cases where you might want to send the tokens differently, for example when you are using WebSockets
+     * or non-HTTP protocols.
+     *
+     * This function returns a token object that can be JSON-serialized and sent to the server in any way you like.
+     * There, you can use the `tokenStore` option on your Stack app to fetch user details.
+     *
+     * Example:
+     *
+     * ```ts
+     * // client
+     * const res = await rpcCall(rpcEndpoint, {
+     *   data: {
+     *     auth: await stackApp.getCrossOriginTokenObject(),
+     *   },
+     * });
+     *
+     * // server
+     * function handleRequest(data) {
+     *   const user = await stackServerApp.getUser({ tokenStore: data.auth });
+     *   return new Response("Welcome, " + user.displayName);
+     * }
+     * ```
+     */
+    getCrossOriginTokenObject(): Promise<{
+        accessToken: string | null;
+        refreshToken: string | null;
+    }>;
     [stackAppInternalsSymbol]: {
         toClientJson(): StackClientAppJson<HasTokenStore, ProjectId>;
         setCurrentUser(userJsonPromise: Promise<UserJson | null>): void;

package/dist/lib/stack-app.js

@@ -59,7 +59,7 @@ var cookie = __toESM(require("cookie"));
 var import_sessions = require("@stackframe/stack-shared/dist/sessions");
 var import_use_trigger = require("@stackframe/stack-shared/dist/hooks/use-trigger");
 var NextNavigation = (0, import_compile_time.scrambleDuringCompileTime)(NextNavigationUnscrambled);
-var clientVersion = "js @stackframe/stack@2.4.18";
+var clientVersion = "js @stackframe/stack@2.4.20";
 function permissionDefinitionScopeToType(scope) {
   return { "any-team": "team", "specific-team": "team", "global": "global" }[scope.type];
 }
@@ -105,43 +105,6 @@ function createEmptyTokenStore() {
     accessToken: null
   });
 }
-var storedCookieTokenStore = null;
-var getCookieTokenStore = () => {
-  if (!(0, import_env.isBrowserLike)()) {
-    throw new Error("Cannot use cookie token store on the server!");
-  }
-  if (storedCookieTokenStore === null) {
-    const getCurrentValue = () => ({
-      refreshToken: (0, import_cookie.getCookie)("stack-refresh"),
-      accessToken: (0, import_cookie.getCookie)("stack-access")
-    });
-    storedCookieTokenStore = new import_stores.Store(getCurrentValue());
-    let hasSucceededInWriting = true;
-    setInterval(() => {
-      if (hasSucceededInWriting) {
-        const currentValue = getCurrentValue();
-        const oldValue = storedCookieTokenStore.get();
-        if (JSON.stringify(currentValue) !== JSON.stringify(oldValue)) {
-          storedCookieTokenStore.set(currentValue);
-        }
-      }
-    }, 100);
-    storedCookieTokenStore.onChange((value) => {
-      try {
-        (0, import_cookie.setOrDeleteCookie)("stack-refresh", value.refreshToken, { maxAge: 60 * 60 * 24 * 365 });
-        (0, import_cookie.setOrDeleteCookie)("stack-access", value.accessToken, { maxAge: 60 * 60 * 24 });
-        hasSucceededInWriting = true;
-      } catch (e) {
-        if (!(0, import_env.isBrowserLike)()) {
-          hasSucceededInWriting = false;
-        } else {
-          throw e;
-        }
-      }
-    });
-  }
-  return storedCookieTokenStore;
-};
 var loadingSentinel = Symbol("stackAppCacheLoadingSentinel");
 function useAsyncCache(cache, dependencies, caller) {
   (0, import_react2.suspendIfSsr)(caller);
@@ -249,24 +212,72 @@ var _StackClientAppImpl = class __StackClientAppImpl {
   }
   _memoryTokenStore = createEmptyTokenStore();
   _requestTokenStores = /* @__PURE__ */ new WeakMap();
+  _storedCookieTokenStore = null;
+  get _refreshTokenCookieName() {
+    return `stack-refresh-${this.projectId}`;
+  }
+  get _accessTokenCookieName() {
+    return `stack-access`;
+  }
+  _getCookieTokenStore() {
+    if (!(0, import_env.isBrowserLike)()) {
+      throw new Error("Cannot use cookie token store on the server!");
+    }
+    if (this._storedCookieTokenStore === null) {
+      const getCurrentValue = (old) => ({
+        refreshToken: (0, import_cookie.getCookie)(this._refreshTokenCookieName) ?? (0, import_cookie.getCookie)("stack-refresh"),
+        // keep old cookie name for backwards-compatibility
+        // if there is an access token in memory already, don't update the access token based on cookies (access token
+        // cookies may be set by another project on the same domain)
+        // see the comment in _accessTokenCookieName for more information
+        accessToken: old === null ? (0, import_cookie.getCookie)(this._accessTokenCookieName) : old.accessToken
+      });
+      this._storedCookieTokenStore = new import_stores.Store(getCurrentValue(null));
+      let hasSucceededInWriting = true;
+      setInterval(() => {
+        if (hasSucceededInWriting) {
+          const oldValue = this._storedCookieTokenStore.get();
+          const currentValue = getCurrentValue(oldValue);
+          if (!(0, import_objects.deepPlainEquals)(currentValue, oldValue)) {
+            this._storedCookieTokenStore.set(currentValue);
+          }
+        }
+      }, 100);
+      this._storedCookieTokenStore.onChange((value) => {
+        try {
+          (0, import_cookie.setOrDeleteCookie)(this._refreshTokenCookieName, value.refreshToken, { maxAge: 60 * 60 * 24 * 365 });
+          (0, import_cookie.setOrDeleteCookie)(this._accessTokenCookieName, value.accessToken, { maxAge: 60 * 60 * 24 });
+          hasSucceededInWriting = true;
+        } catch (e) {
+          if (!(0, import_env.isBrowserLike)()) {
+            hasSucceededInWriting = false;
+          } else {
+            throw e;
+          }
+        }
+      });
+    }
+    return this._storedCookieTokenStore;
+  }
   _getOrCreateTokenStore(overrideTokenStoreInit) {
     const tokenStoreInit = overrideTokenStoreInit === void 0 ? this._tokenStoreInit : overrideTokenStoreInit;
     switch (tokenStoreInit) {
       case "cookie": {
-        return getCookieTokenStore();
+        return this._getCookieTokenStore();
       }
       case "nextjs-cookie": {
         if ((0, import_env.isBrowserLike)()) {
-          return getCookieTokenStore();
+          return this._getCookieTokenStore();
         } else {
           const store = new import_stores.Store({
-            refreshToken: (0, import_cookie.getCookie)("stack-refresh"),
-            accessToken: (0, import_cookie.getCookie)("stack-access")
+            refreshToken: (0, import_cookie.getCookie)(this._refreshTokenCookieName) ?? (0, import_cookie.getCookie)("stack-refresh"),
+            // keep old cookie name for backwards-compatibility
+            accessToken: (0, import_cookie.getCookie)(this._accessTokenCookieName)
           });
           store.onChange((value) => {
             try {
-              (0, import_cookie.setOrDeleteCookie)("stack-refresh", value.refreshToken, { maxAge: 60 * 60 * 24 * 365 });
-              (0, import_cookie.setOrDeleteCookie)("stack-access", value.accessToken, { maxAge: 60 * 60 * 24 });
+              (0, import_cookie.setOrDeleteCookie)(this._refreshTokenCookieName, value.refreshToken, { maxAge: 60 * 60 * 24 * 365 });
+              (0, import_cookie.setOrDeleteCookie)(this._accessTokenCookieName, value.accessToken, { maxAge: 60 * 60 * 24 });
             } catch (e) {
             }
           });
@@ -276,21 +287,43 @@ var _StackClientAppImpl = class __StackClientAppImpl {
       case "memory": {
         return this._memoryTokenStore;
       }
-      case null: {
-        return createEmptyTokenStore();
-      }
       default: {
-        if (tokenStoreInit !== null && typeof tokenStoreInit === "object" && "headers" in tokenStoreInit) {
+        if (tokenStoreInit === null) {
+          return createEmptyTokenStore();
+        } else if (typeof tokenStoreInit === "object" && "headers" in tokenStoreInit) {
           if (this._requestTokenStores.has(tokenStoreInit))
             return this._requestTokenStores.get(tokenStoreInit);
+          const stackAuthHeader = tokenStoreInit.headers.get("x-stack-auth");
+          if (stackAuthHeader) {
+            let parsed2;
+            try {
+              parsed2 = JSON.parse(stackAuthHeader);
+              if (typeof parsed2 !== "object")
+                throw new Error("x-stack-auth header must be a JSON object");
+              if (parsed2 === null)
+                throw new Error("x-stack-auth header must not be null");
+            } catch (e) {
+              throw new Error(`Invalid x-stack-auth header: ${stackAuthHeader}`, { cause: e });
+            }
+            return this._getOrCreateTokenStore({
+              accessToken: parsed2.accessToken ?? null,
+              refreshToken: parsed2.refreshToken ?? null
+            });
+          }
           const cookieHeader = tokenStoreInit.headers.get("cookie");
           const parsed = cookie.parse(cookieHeader || "");
           const res = new import_stores.Store({
-            refreshToken: parsed["stack-refresh"] || null,
-            accessToken: parsed["stack-access"] || null
+            refreshToken: parsed[this._refreshTokenCookieName] || parsed["stack-refresh"] || null,
+            // keep old cookie name for backwards-compatibility
+            accessToken: parsed[this._accessTokenCookieName] || null
           });
           this._requestTokenStores.set(tokenStoreInit, res);
           return res;
+        } else if ("accessToken" in tokenStoreInit || "refreshToken" in tokenStoreInit) {
+          return new import_stores.Store({
+            refreshToken: tokenStoreInit.refreshToken,
+            accessToken: tokenStoreInit.accessToken
+          });
         }
         throw new Error(`Invalid token store ${tokenStoreInit}`);
       }
@@ -307,7 +340,7 @@ var _StackClientAppImpl = class __StackClientAppImpl {
   _sessionsByTokenStoreAndSessionKey = /* @__PURE__ */ new WeakMap();
   _getSessionFromTokenStore(tokenStore) {
     const tokenObj = tokenStore.get();
-    const sessionKey = import_sessions.Session.calculateSessionKey(tokenObj);
+    const sessionKey = import_sessions.InternalSession.calculateSessionKey(tokenObj);
     const existing = sessionKey ? this._sessionsByTokenStoreAndSessionKey.get(tokenStore)?.get(sessionKey) : null;
     if (existing)
       return existing;
@@ -481,7 +514,16 @@ var _StackClientAppImpl = class __StackClientAppImpl {
     const app = this;
     const currentUser = {
       ...this._userFromJson(json),
-      session,
+      _internalSession: session,
+      currentSession: {
+        async getTokens() {
+          const tokens = await session.getPotentiallyExpiredTokens();
+          return {
+            accessToken: tokens?.accessToken.token ?? null,
+            refreshToken: tokens?.refreshToken?.token ?? null
+          };
+        }
+      },
       async updateSelectedTeam(team) {
         await app._updateUser({ selectedTeamId: team?.id ?? null }, session);
       },
@@ -568,6 +610,18 @@ var _StackClientAppImpl = class __StackClientAppImpl {
   get urls() {
     return getUrls(this._urlOptions);
   }
+  async getCrossOriginHeaders() {
+    return {
+      "x-stack-auth": JSON.stringify(await this.getCrossOriginTokenObject())
+    };
+  }
+  async getCrossOriginTokenObject() {
+    const user = await this.getUser();
+    if (!user)
+      return { accessToken: null, refreshToken: null };
+    const tokens = await user.currentSession.getTokens();
+    return tokens;
+  }
   async _redirectTo(handlerName, options) {
     const url = this.urls[handlerName];
     if (!url) {
@@ -1019,7 +1073,16 @@ var _StackServerAppImpl = class extends _StackClientAppImpl {
     const nonCurrentServerUser = this._serverUserFromJson(json);
     const currentUser = {
       ...nonCurrentServerUser,
-      session,
+      _internalSession: session,
+      currentSession: {
+        async getTokens() {
+          const tokens = await session.getPotentiallyExpiredTokens();
+          return {
+            accessToken: tokens?.accessToken.token ?? null,
+            refreshToken: tokens?.refreshToken?.token ?? null
+          };
+        }
+      },
       async delete() {
         const res = await nonCurrentServerUser.delete();
         await app._refreshUser(session);