Vue / Nuxt SSAFY 인증 연동

import { ref } from "vue";

type VerifyResult =
  | { ok: true; verified: true; sub: string; cohort: string | null; campus: string | null; authTime: number }
  | { ok: false; errorCode: string; requestId: string | null };

type SsafySdk = {
  verify(options: {
    clientId: string;
    redirectUri: string;
    scopes: string[];
    waitForCallback: true;
  }): Promise<{
    code: string | null;
    error: string | null;
    iss: string | null;
    error_code: string | null;
    request_id: string | null;
    codeVerifier: string;
  }>;
};

declare global {
  interface Window {
    ssafyVerify?: SsafySdk;
  }
}

export function useSsafyVerify() {
  const status = ref<"idle" | "working" | "verified" | "failed">("idle");
  const result = ref<VerifyResult | null>(null);

  async function verify() {
    const sdk = window.ssafyVerify;
    const expectedIssuer = import.meta.env.VITE_SSAFY_VERIFY_ISSUER ?? "https://verify.myknow.xyz";
    if (!sdk) {
      result.value = { ok: false, errorCode: "SDK_NOT_READY", requestId: null };
      status.value = "failed";
      return result.value;
    }

    status.value = "working";
    const callback = await sdk.verify({
      clientId: import.meta.env.VITE_SSAFY_VERIFY_CLIENT_ID,
      redirectUri: import.meta.env.VITE_SSAFY_VERIFY_REDIRECT_URI,
      scopes: ["ssafy.verify", "ssafy.affiliation", "ssafy.name"],
      waitForCallback: true,
    }).then((value) => value, () => null);

    if (!callback) {
      result.value = { ok: false, errorCode: "VERIFY_POPUP_FAILED", requestId: null };
      status.value = "failed";
      return result.value;
    }

    if (callback.error || !callback.code) {
      result.value = {
        ok: false,
        errorCode: callback.error_code ?? "VERIFY_CANCELLED",
        requestId: callback.request_id,
      };
      status.value = "failed";
      return result.value;
    }

    if (callback.iss !== expectedIssuer) {
      result.value = {
        ok: false,
        errorCode: "CALLBACK_ISSUER_MISMATCH",
        requestId: callback.request_id,
      };
      status.value = "failed";
      return result.value;
    }

    const response = await fetch("/api/ssafy/verify-token", {
      method: "POST",
      headers: { "content-type": "application/json" },
      body: JSON.stringify({
        code: callback.code,
        codeVerifier: callback.codeVerifier,
        redirectUri: import.meta.env.VITE_SSAFY_VERIFY_REDIRECT_URI,
        iss: callback.iss,
      }),
    }).then((value) => value, () => null);

    if (!response) {
      result.value = { ok: false, errorCode: "VERIFY_NETWORK_FAILED", requestId: null };
      status.value = "failed";
      return result.value;
    }

    result.value = await response.json().then(
      (value) => value as VerifyResult,
      () => ({ ok: false, errorCode: "VERIFY_RESPONSE_INVALID", requestId: null }),
    );
    status.value = result.value.ok ? "verified" : "failed";
    return result.value;
  }

  return { status, result, verify };
}