@yiminlab/authkit 0.1.0

package/dist/react/index.mjs

@@ -0,0 +1,677 @@
+// src/react/use-auth.ts
+import { useState, useEffect, useCallback, useMemo } from "react";
+
+// src/core/types.ts
+var DEFAULT_AUTH_CONFIG = {
+  portalUrl: typeof process !== "undefined" ? process.env.NEXT_PUBLIC_PORTAL_URL || "https://yiminlab.site" : "https://yiminlab.site",
+  apiBaseUrl: typeof process !== "undefined" ? process.env.NEXT_PUBLIC_API_BASE_URL || "https://api.yiminlab.site" : "https://api.yiminlab.site",
+  callbackPath: "/auth/callback",
+  tokenKeys: {
+    accessToken: "authkit_access_token",
+    refreshToken: "authkit_refresh_token",
+    tokenExpiry: "authkit_token_expiry"
+  }
+};
+
+// src/core/token-manager.ts
+var LocalStorageAdapter = class {
+  getItem(key) {
+    if (typeof window === "undefined") return null;
+    return localStorage.getItem(key);
+  }
+  setItem(key, value) {
+    if (typeof window === "undefined") return;
+    localStorage.setItem(key, value);
+  }
+  removeItem(key) {
+    if (typeof window === "undefined") return;
+    localStorage.removeItem(key);
+  }
+};
+var TokenManager = class {
+  constructor(storage, config) {
+    this.storage = storage || new LocalStorageAdapter();
+    this.config = { ...DEFAULT_AUTH_CONFIG, ...config };
+  }
+  /**
+   * 保存 tokens
+   */
+  setTokens(accessToken, refreshToken, expiresIn) {
+    const expiryTime = Date.now() + expiresIn * 1e3;
+    this.storage.setItem(this.config.tokenKeys.accessToken, accessToken);
+    this.storage.setItem(this.config.tokenKeys.refreshToken, refreshToken);
+    this.storage.setItem(this.config.tokenKeys.tokenExpiry, expiryTime.toString());
+  }
+  /**
+   * 获取 Access Token
+   */
+  getAccessToken() {
+    return this.storage.getItem(this.config.tokenKeys.accessToken);
+  }
+  /**
+   * 获取 Refresh Token
+   */
+  getRefreshToken() {
+    return this.storage.getItem(this.config.tokenKeys.refreshToken);
+  }
+  /**
+   * 获取 Token 过期时间
+   */
+  getTokenExpiry() {
+    const expiry = this.storage.getItem(this.config.tokenKeys.tokenExpiry);
+    return expiry ? parseInt(expiry, 10) : null;
+  }
+  /**
+   * 检查 Access Token 是否过期
+   * 提前 60 秒认为过期，留出刷新时间
+   */
+  isAccessTokenExpired() {
+    const expiryTime = this.getTokenExpiry();
+    if (!expiryTime) return true;
+    const now = Date.now();
+    return now >= expiryTime - 6e4;
+  }
+  /**
+   * 清除所有 tokens
+   */
+  clearTokens() {
+    this.storage.removeItem(this.config.tokenKeys.accessToken);
+    this.storage.removeItem(this.config.tokenKeys.refreshToken);
+    this.storage.removeItem(this.config.tokenKeys.tokenExpiry);
+  }
+  /**
+   * 检查是否有有效的认证信息
+   */
+  hasValidAuth() {
+    const accessToken = this.getAccessToken();
+    const refreshToken = this.getRefreshToken();
+    return !!(accessToken && !this.isAccessTokenExpired()) || !!refreshToken;
+  }
+  /**
+   * 获取配置
+   */
+  getConfig() {
+    return { ...this.config };
+  }
+};
+var instance = null;
+function getTokenManager(config) {
+  if (!instance) {
+    instance = new TokenManager(void 0, config);
+  }
+  return instance;
+}
+
+// src/core/auth-redirect.ts
+var ALLOWED_REDIRECT_DOMAINS = [
+  "yiminlab.site",
+  "jsontailor.yiminlab.site",
+  "ai.yiminlab.site",
+  "localhost"
+];
+var AuthRedirect = class {
+  constructor(config) {
+    this.config = {
+      portalUrl: config?.portalUrl || DEFAULT_AUTH_CONFIG.portalUrl,
+      callbackPath: config?.callbackPath || DEFAULT_AUTH_CONFIG.callbackPath
+    };
+  }
+  /**
+   * 获取当前页面的完整 URL
+   */
+  getCurrentUrl() {
+    if (typeof window === "undefined") return "";
+    return window.location.href;
+  }
+  /**
+   * 获取当前页面的 origin
+   */
+  getCurrentOrigin() {
+    if (typeof window === "undefined") return "";
+    return window.location.origin;
+  }
+  /**
+   * 构建回调 URL
+   */
+  buildCallbackUrl() {
+    return `${this.getCurrentOrigin()}${this.config.callbackPath}`;
+  }
+  /**
+   * 构建登录跳转 URL
+   * @param returnPath 登录成功后返回的路径（默认当前页面）
+   */
+  buildLoginUrl(returnPath) {
+    const callbackUrl = this.buildCallbackUrl();
+    const loginUrl = new URL("/login", this.config.portalUrl);
+    loginUrl.searchParams.set("redirect", callbackUrl);
+    if (returnPath) {
+      loginUrl.searchParams.set("return", returnPath);
+    }
+    return loginUrl.toString();
+  }
+  /**
+   * 跳转到 Portal 登录页
+   * @param returnPath 登录成功后返回的路径
+   */
+  redirectToLogin(returnPath) {
+    if (typeof window === "undefined") return;
+    const currentPath = window.location.pathname + window.location.search;
+    const loginUrl = this.buildLoginUrl(returnPath || currentPath);
+    window.location.href = loginUrl;
+  }
+  /**
+   * 从 URL 参数中解析 Token
+   */
+  parseTokensFromUrl() {
+    if (typeof window === "undefined") return null;
+    const params = new URLSearchParams(window.location.search);
+    const accessToken = params.get("token");
+    const refreshToken = params.get("refresh");
+    const expiresInStr = params.get("expires");
+    const returnPath = params.get("return");
+    if (!accessToken || !refreshToken) {
+      return null;
+    }
+    return {
+      accessToken,
+      refreshToken,
+      expiresIn: expiresInStr ? parseInt(expiresInStr, 10) : 3600,
+      returnPath
+    };
+  }
+  /**
+   * 清除 URL 中的 Token 参数
+   */
+  clearTokensFromUrl() {
+    if (typeof window === "undefined") return;
+    const url = new URL(window.location.href);
+    url.searchParams.delete("token");
+    url.searchParams.delete("refresh");
+    url.searchParams.delete("expires");
+    url.searchParams.delete("return");
+    window.history.replaceState({}, "", url.pathname + url.search);
+  }
+  /**
+   * 验证跳转 URL 是否在白名单中
+   */
+  isAllowedRedirectUrl(url) {
+    try {
+      const { hostname } = new URL(url);
+      return ALLOWED_REDIRECT_DOMAINS.some(
+        (domain) => hostname === domain || hostname.endsWith("." + domain)
+      );
+    } catch {
+      return false;
+    }
+  }
+};
+var instance2 = null;
+function getAuthRedirect(config) {
+  if (!instance2) {
+    instance2 = new AuthRedirect(config);
+  }
+  return instance2;
+}
+
+// src/core/authkit-client.ts
+var AuthKitClient = class {
+  constructor(config) {
+    this.config = {
+      baseUrl: config.baseUrl || DEFAULT_AUTH_CONFIG.apiBaseUrl,
+      getAccessToken: config.getAccessToken
+    };
+  }
+  /**
+   * 构建请求头
+   */
+  buildHeaders() {
+    const headers = {
+      "Content-Type": "application/json"
+    };
+    const token = this.config.getAccessToken();
+    if (token) {
+      headers["Authorization"] = `Bearer ${token}`;
+    }
+    return headers;
+  }
+  /**
+   * 解析 API 响应为标准格式
+   */
+  parseTokenResponse(data) {
+    if (data.access_token) {
+      const expiresAt = new Date(Date.now() + data.expires_in * 1e3).toISOString();
+      return {
+        token: data.access_token,
+        expires_at: expiresAt,
+        scopes: data.scopes
+      };
+    }
+    throw new Error("Invalid response format");
+  }
+  /**
+   * 获取当前用户信息
+   */
+  async getMe() {
+    const response = await fetch(`${this.config.baseUrl}/api/auth/me`, {
+      method: "GET",
+      headers: this.buildHeaders()
+    });
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error || error.message || `HTTP ${response.status}`);
+    }
+    return await response.json();
+  }
+  /**
+   * 获取全局 Scoped Token（自动创建/续期）
+   * 
+   * @param scope 权限范围，如 'streamock:stream:read'
+   * @returns 短 token，如 'st_7kB2xM9pQr3n'
+   */
+  async getScopedToken(scope) {
+    const response = await fetch(
+      `${this.config.baseUrl}/api/auth/token/scoped?scope=${encodeURIComponent(scope)}`,
+      {
+        method: "GET",
+        headers: this.buildHeaders()
+      }
+    );
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error || error.message || `HTTP ${response.status}`);
+    }
+    const data = await response.json();
+    return this.parseTokenResponse(data);
+  }
+  /**
+   * 轮换 Scoped Token（废弃旧的，生成新的）
+   * 
+   * @param scope 权限范围，如 'streamock:stream:read'
+   * @returns 新的短 token
+   */
+  async rotateScopedToken(scope) {
+    const response = await fetch(
+      `${this.config.baseUrl}/api/auth/token/scoped/rotate?scope=${encodeURIComponent(scope)}`,
+      {
+        method: "POST",
+        headers: this.buildHeaders()
+      }
+    );
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error || error.message || `HTTP ${response.status}`);
+    }
+    const data = await response.json();
+    return this.parseTokenResponse(data);
+  }
+  /**
+   * 创建 Scoped Token（短 token）- 保留兼容性
+   * 
+   * @param scopes 权限范围，如 ['streamock:stream:read']
+   * @param expiresIn 过期时间（秒），默认 24 小时
+   * @returns 短 token，如 'st_7kB2xM9pQr3n'
+   * @deprecated 请使用 getScopedToken 获取全局 token
+   */
+  async createScopedToken(scopes, expiresIn = 86400) {
+    const response = await fetch(`${this.config.baseUrl}/api/auth/token/scoped`, {
+      method: "POST",
+      headers: this.buildHeaders(),
+      body: JSON.stringify({
+        scopes,
+        expires_in: expiresIn
+      })
+    });
+    if (!response.ok) {
+      const error = await response.json().catch(() => ({}));
+      throw new Error(error.error || error.message || `HTTP ${response.status}`);
+    }
+    const data = await response.json();
+    return this.parseTokenResponse(data);
+  }
+};
+var instance3 = null;
+function getAuthKitClient(getAccessToken) {
+  if (!instance3) {
+    instance3 = new AuthKitClient({ getAccessToken });
+  }
+  return instance3;
+}
+
+// src/react/use-auth.ts
+function useAuth(options = {}) {
+  const {
+    tokenManager = getTokenManager(options.config),
+    authRedirect = getAuthRedirect(options.config),
+    fetchUser = true
+  } = options;
+  const [authState, setAuthState] = useState({
+    isAuthenticated: false,
+    isLoading: true,
+    user: null,
+    error: null
+  });
+  const fetchUserInfo = useCallback(async () => {
+    try {
+      const client = getAuthKitClient(() => tokenManager.getAccessToken());
+      const user = await client.getMe();
+      setAuthState((prev) => ({
+        ...prev,
+        user,
+        error: null
+      }));
+    } catch (error) {
+      console.error("Failed to fetch user info:", error);
+    }
+  }, [tokenManager]);
+  const checkAuth = useCallback(async () => {
+    const hasValidAuth = tokenManager.hasValidAuth();
+    const accessToken = tokenManager.getAccessToken();
+    if (hasValidAuth && accessToken) {
+      setAuthState({
+        isAuthenticated: true,
+        isLoading: false,
+        user: null,
+        error: null
+      });
+      if (fetchUser) {
+        await fetchUserInfo();
+      }
+    } else {
+      setAuthState({
+        isAuthenticated: false,
+        isLoading: false,
+        user: null,
+        error: null
+      });
+    }
+  }, [tokenManager, fetchUser, fetchUserInfo]);
+  const login = useCallback(
+    (returnPath) => {
+      authRedirect.redirectToLogin(returnPath);
+    },
+    [authRedirect]
+  );
+  const logout = useCallback(() => {
+    tokenManager.clearTokens();
+    setAuthState({
+      isAuthenticated: false,
+      isLoading: false,
+      user: null,
+      error: null
+    });
+  }, [tokenManager]);
+  const getAccessToken = useCallback(() => {
+    return tokenManager.getAccessToken();
+  }, [tokenManager]);
+  const refresh = useCallback(() => {
+    checkAuth();
+  }, [checkAuth]);
+  const refreshUser = useCallback(async () => {
+    await fetchUserInfo();
+  }, [fetchUserInfo]);
+  useEffect(() => {
+    checkAuth();
+  }, [checkAuth]);
+  useEffect(() => {
+    const handleStorageChange = (event) => {
+      const config = tokenManager.getConfig();
+      if (event.key === config.tokenKeys.accessToken || event.key === config.tokenKeys.refreshToken) {
+        checkAuth();
+      }
+    };
+    window.addEventListener("storage", handleStorageChange);
+    return () => {
+      window.removeEventListener("storage", handleStorageChange);
+    };
+  }, [tokenManager, checkAuth]);
+  return useMemo(
+    () => ({
+      ...authState,
+      login,
+      logout,
+      getAccessToken,
+      refresh,
+      refreshUser
+    }),
+    [authState, login, logout, getAccessToken, refresh, refreshUser]
+  );
+}
+function useAccessToken() {
+  const { getAccessToken } = useAuth({ fetchUser: false });
+  return getAccessToken();
+}
+
+// src/react/auth-guard.tsx
+import { useEffect as useEffect2 } from "react";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+function DefaultLoading() {
+  return /* @__PURE__ */ jsxs("div", { style: {
+    display: "flex",
+    height: "50vh",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "center"
+  }, children: [
+    /* @__PURE__ */ jsx("div", { style: {
+      width: "32px",
+      height: "32px",
+      border: "3px solid #e5e7eb",
+      borderTopColor: "#3b82f6",
+      borderRadius: "50%",
+      animation: "spin 1s linear infinite"
+    } }),
+    /* @__PURE__ */ jsx("style", { children: `
+        @keyframes spin {
+          to { transform: rotate(360deg); }
+        }
+      ` })
+  ] });
+}
+function DefaultLoginPrompt({
+  onLogin,
+  title = "\u9700\u8981\u767B\u5F55",
+  description = "\u8BF7\u767B\u5F55\u4EE5\u7EE7\u7EED\u4F7F\u7528",
+  buttonText = "\u767B\u5F55"
+}) {
+  return /* @__PURE__ */ jsxs("div", { style: {
+    display: "flex",
+    height: "50vh",
+    width: "100%",
+    flexDirection: "column",
+    alignItems: "center",
+    justifyContent: "center",
+    gap: "16px"
+  }, children: [
+    /* @__PURE__ */ jsxs("div", { style: { textAlign: "center" }, children: [
+      /* @__PURE__ */ jsx("h2", { style: {
+        fontSize: "1.5rem",
+        fontWeight: 600,
+        margin: 0
+      }, children: title }),
+      /* @__PURE__ */ jsx("p", { style: {
+        marginTop: "8px",
+        color: "#6b7280"
+      }, children: description })
+    ] }),
+    /* @__PURE__ */ jsx(
+      "button",
+      {
+        onClick: onLogin,
+        style: {
+          display: "inline-flex",
+          alignItems: "center",
+          justifyContent: "center",
+          padding: "10px 20px",
+          fontSize: "1rem",
+          fontWeight: 500,
+          backgroundColor: "#3b82f6",
+          color: "white",
+          border: "none",
+          borderRadius: "6px",
+          cursor: "pointer",
+          transition: "background-color 0.2s"
+        },
+        onMouseOver: (e) => e.currentTarget.style.backgroundColor = "#2563eb",
+        onMouseOut: (e) => e.currentTarget.style.backgroundColor = "#3b82f6",
+        children: buttonText
+      }
+    )
+  ] });
+}
+function AuthGuard({
+  children,
+  fallback = "prompt",
+  returnPath,
+  loadingContent,
+  promptContent,
+  promptTitle,
+  promptDescription,
+  loginButtonText,
+  authOptions
+}) {
+  const { isAuthenticated, isLoading, login } = useAuth(authOptions);
+  useEffect2(() => {
+    if (!isLoading && !isAuthenticated && fallback === "redirect") {
+      login(returnPath);
+    }
+  }, [isLoading, isAuthenticated, fallback, login, returnPath]);
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Fragment, { children: loadingContent || /* @__PURE__ */ jsx(DefaultLoading, {}) });
+  }
+  if (!isAuthenticated) {
+    if (fallback === "redirect") {
+      return /* @__PURE__ */ jsx(Fragment, { children: loadingContent || /* @__PURE__ */ jsx(DefaultLoading, {}) });
+    }
+    return /* @__PURE__ */ jsx(Fragment, { children: promptContent || /* @__PURE__ */ jsx(
+      DefaultLoginPrompt,
+      {
+        onLogin: () => login(returnPath),
+        title: promptTitle,
+        description: promptDescription,
+        buttonText: loginButtonText
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx(Fragment, { children });
+}
+function withAuthGuard(Component, guardProps) {
+  return function WrappedComponent(props) {
+    return /* @__PURE__ */ jsx(AuthGuard, { ...guardProps, children: /* @__PURE__ */ jsx(Component, { ...props }) });
+  };
+}
+
+// src/react/callback-handler.tsx
+import { useEffect as useEffect3, useState as useState2 } from "react";
+import { Fragment as Fragment2, jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function DefaultLoading2() {
+  return /* @__PURE__ */ jsxs2("div", { style: {
+    display: "flex",
+    height: "100vh",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "column",
+    gap: "16px"
+  }, children: [
+    /* @__PURE__ */ jsx2("div", { style: {
+      width: "40px",
+      height: "40px",
+      border: "3px solid #e5e7eb",
+      borderTopColor: "#3b82f6",
+      borderRadius: "50%",
+      animation: "spin 1s linear infinite"
+    } }),
+    /* @__PURE__ */ jsx2("p", { style: { color: "#6b7280" }, children: "\u6B63\u5728\u5904\u7406\u767B\u5F55..." }),
+    /* @__PURE__ */ jsx2("style", { children: `
+        @keyframes spin {
+          to { transform: rotate(360deg); }
+        }
+      ` })
+  ] });
+}
+function DefaultError({ error, onRetry }) {
+  return /* @__PURE__ */ jsxs2("div", { style: {
+    display: "flex",
+    height: "100vh",
+    width: "100%",
+    alignItems: "center",
+    justifyContent: "center",
+    flexDirection: "column",
+    gap: "16px"
+  }, children: [
+    /* @__PURE__ */ jsx2("div", { style: {
+      color: "#ef4444",
+      fontSize: "48px"
+    }, children: "\u26A0\uFE0F" }),
+    /* @__PURE__ */ jsx2("h2", { style: { margin: 0 }, children: "\u767B\u5F55\u5931\u8D25" }),
+    /* @__PURE__ */ jsx2("p", { style: { color: "#6b7280", margin: 0 }, children: error }),
+    /* @__PURE__ */ jsx2(
+      "button",
+      {
+        onClick: onRetry,
+        style: {
+          padding: "10px 20px",
+          fontSize: "1rem",
+          backgroundColor: "#3b82f6",
+          color: "white",
+          border: "none",
+          borderRadius: "6px",
+          cursor: "pointer"
+        },
+        children: "\u91CD\u8BD5"
+      }
+    )
+  ] });
+}
+function CallbackHandler({
+  defaultRedirectPath = "/",
+  loadingContent,
+  errorContent,
+  config,
+  onSuccess,
+  onError
+}) {
+  const [error, setError] = useState2(null);
+  useEffect3(() => {
+    const handleCallback = () => {
+      const tokenManager = getTokenManager(config);
+      const authRedirect = getAuthRedirect(config);
+      const tokens = authRedirect.parseTokensFromUrl();
+      if (!tokens || !tokens.accessToken || !tokens.refreshToken) {
+        const errorMsg = "\u672A\u627E\u5230\u8BA4\u8BC1\u4FE1\u606F";
+        setError(errorMsg);
+        onError?.(errorMsg);
+        return;
+      }
+      tokenManager.setTokens(
+        tokens.accessToken,
+        tokens.refreshToken,
+        tokens.expiresIn || 3600
+      );
+      authRedirect.clearTokensFromUrl();
+      onSuccess?.();
+      const redirectPath = tokens.returnPath || defaultRedirectPath;
+      window.location.href = redirectPath;
+    };
+    handleCallback();
+  }, [defaultRedirectPath, config, onSuccess, onError]);
+  const handleRetry = () => {
+    const authRedirect = getAuthRedirect(config);
+    authRedirect.redirectToLogin(defaultRedirectPath);
+  };
+  if (error) {
+    if (typeof errorContent === "function") {
+      return /* @__PURE__ */ jsx2(Fragment2, { children: errorContent(error) });
+    }
+    return /* @__PURE__ */ jsx2(Fragment2, { children: errorContent || /* @__PURE__ */ jsx2(DefaultError, { error, onRetry: handleRetry }) });
+  }
+  return /* @__PURE__ */ jsx2(Fragment2, { children: loadingContent || /* @__PURE__ */ jsx2(DefaultLoading2, {}) });
+}
+export {
+  AuthGuard,
+  CallbackHandler,
+  useAccessToken,
+  useAuth,
+  withAuthGuard
+};
+//# sourceMappingURL=index.mjs.map