feat: feishu login callback

NJUPT-SAST · Jul 15, 2024 · 0a8e48e · 0a8e48e
1 parent 79a4b20
commit 0a8e48e
Show file tree

Hide file tree

Showing 12 changed files with 1,830 additions and 4,131 deletions.
diff --git a/app/(tourist)/callback/feishu/page.tsx b/app/(tourist)/callback/feishu/page.tsx
@@ -0,0 +1,64 @@
+"use client";
+import { handleError } from "@/components/function";
+import { getFeishuLoginStatus } from "@/lib/apis/global";
+import { getUserInfo } from "@/lib/apis/user";
+import { useAppDispatch } from "@/redux";
+import { addAccount } from "@/redux/features/userList";
+import { useRouter } from "next/navigation";
+import { useEffect } from "react";
+
+const FeishuCallback = ({
+  searchParams,
+}: {
+  searchParams: {
+    code: string;
+    state: string;
+  };
+}) => {
+  const { code, state } = searchParams;
+  const router = useRouter();
+  const dispatch = useAppDispatch();
+
+  console.log("code", code, "state", state);
+
+  useEffect(() => {
+    getFeishuLoginStatus(code, state).then((feishuRes) => {
+      console.log(feishuRes);
+      if (feishuRes.data.Success) {
+        localStorage.setItem(
+          "Token",
+          JSON.stringify(feishuRes.data.Data.loginToken),
+        );
+        getUserInfo().then((res) => {
+          if (res.data.Success) {
+            const data = res.data.Data;
+            dispatch(
+              addAccount({
+                nickName: "ming",
+                email: data.email,
+                Token: feishuRes.data.Data.loginToken,
+                userId: data.userId,
+              }),
+            );
+
+            router.replace("/home");
+          }
+        });
+      } else {
+        if (feishuRes.data.ErrCode === 50000) {
+          return <div>飞书登录失败</div>;
+        }
+        console.log("跳转");
+        router.replace(`/login?oauthTicket=${feishuRes.data.Data.oauthTicket}`);
+      }
+    });
+  }, [code, dispatch, router, state]);
+
+  return (
+    <>
+      <div>正在重定向</div>
+    </>
+  );
+};
+
+export default FeishuCallback;
diff --git a/app/(tourist)/login/2/page.tsx b/app/(tourist)/login/2/page.tsx
@@ -57,11 +57,14 @@ const LoginStep2 = () => {
             if (typeof args.password === "string") {
               const password = args.password;
               console.log(loginTicket);
-              userLogin(password, loginTicket ?? "")
+              userLogin(
+                password,
+                loginTicket ?? "",
+                urlParams.get("oauthTicket"),
+              )
                 .then((res) => {
                   if (res.data.Success) {
                     const token = res.data.Data.loginToken;
-                    console.log(token);
 
                     localStorage.setItem("Token", JSON.stringify(token));
                     tokenRef.current = token;
@@ -78,10 +81,10 @@ const LoginStep2 = () => {
                         );
                         //dispatch(login({ username: "ming", email: data.email }));
                         if (urlParams.get("redirect") !== null) {
-                          console.log(redirect_uri);
                           router.push(redirect_uri);
                         } else {
-                          router.push(redirect_uri ?? "/home");
+                          console.log("go home");
+                          router.push("/home");
                         }
                         return;
                       }

diff --git a/app/(tourist)/login/layout.tsx b/app/(tourist)/login/layout.tsx
@@ -1,8 +1,8 @@
 import BackLayout from "@/components/Layout/BackLayout";
 import { Layout } from "@/components/Layout";
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
 
-import { Metadata } from "next";
+import type { Metadata } from "next";
 export const metadata: Metadata = {
   title: "Login",
 };

diff --git a/app/(tourist)/login/loginStep1.tsx b/app/(tourist)/login/loginStep1.tsx
@@ -18,6 +18,7 @@ import styles from "./page.module.scss";
 import classNames from "classnames";
 import PageTransition from "@/components/pageTransition";
 import { message } from "@/components/message";
+import { LarkIcon } from "@/components/icon/larkIcon";
 
 const list = [
   {
@@ -35,6 +36,11 @@ const list = [
     describe: "Microsoft",
     icon: <MsIcon />,
   },
+  {
+    target: "http://10.11.12.13:8080/api/v1/login/lark",
+    describe: "Feishu",
+    icon: <LarkIcon />,
+  },
 ];
 
 const LoginStep1 = () => {
@@ -77,9 +83,13 @@ const LoginStep1 = () => {
                   console.log(urlParams.get("redirect"));
                   router.replace(
                     `/login/2${
-                      !!urlParams.get("redirect")
+                      urlParams.get("redirect")
                         ? `?redirect=${urlParams.get("redirect")}`
                         : ""
+                    }${
+                      urlParams.get("oauthTicket")
+                        ? `?oauthTicket=${urlParams.get("oauthTicket")}`
+                        : ""
                     }`,
                   );
                   return;
@@ -112,6 +122,7 @@ const LoginStep1 = () => {
           <Button
             loading={loading}
             onClick={(e) => {
+              // biome-ignore lint/style/noNonNullAssertion: <explanation>
               const check = veridate(inputRef.current!.value);
               if (check) {
                 setError(handleError(check));
@@ -129,18 +140,18 @@ const LoginStep1 = () => {
           // TODO 第三方认证登录
         }
         <Anchor
-          onClick={() => {
-            message.warning("暂未开放");
-          }}
-          href="./"
+          // onClick={() => {
+          // 	message.warning("暂未开放");
+          // }}
+          href="/apis/login/lark?redirect_url=http://localhost:3000/callback/feishu"
           className={classNames(styles.anchor)}
         >
           SAST 飞书登录
         </Anchor>
         <OtherLoginList list={list} />
         <div className={`${styles.toRegist}`}>
           没有账号？
-          <Link href={`/regist${!!redirect ? `?redirect=${redirect}` : ""}`}>
+          <Link href={`/regist${redirect ? `?redirect=${redirect}` : ""}`}>
             注册
           </Link>
         </div>

diff --git a/components/icon/larkIcon.tsx b/components/icon/larkIcon.tsx
@@ -0,0 +1,6 @@
+import lark from "@/public/svg/lark.png";
+import Image from "next/image";
+
+export function LarkIcon() {
+  return <Image src={lark} alt={"lark icon"} width={26} height={27} />;
+}
diff --git a/components/list/otherLoginList/index.tsx b/components/list/otherLoginList/index.tsx
@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
 import classNames from "classnames";
 import styles from "./index.module.scss";
 import { message } from "@/components/message";
@@ -16,13 +16,17 @@ const OtherLoginList = (props: {
       <ul className={classNames([styles.icons])}>
         {list.map((item) => {
           return (
+            // biome-ignore lint/a11y/useKeyWithClickEvents: <explanation>
             <li
-              onClick={() => {
-                message.warning("暂未开放");
-              }}
+              // onClick={() => {
+              // 	message.warning("暂未开放");
+              // }}
               key={`other_login_${item.describe}`}
             >
-              <a title={item.describe} href={item.target}>
+              <a
+                title={item.describe}
+                href={`${item.target}?redirect_url=http://localhost:3000/callback/feishu`}
+              >
                 {item.icon}
               </a>
             </li>

diff --git a/lib/apis/global.ts b/lib/apis/global.ts
@@ -1,6 +1,7 @@
 import { apis } from ".";
+// biome-ignore lint/style/useNodejsImportProtocol: <explanation>
 import qs from "querystring";
-import { ResType } from "./type";
+import type { ResType } from "./type";
 /**
  * 验证账户有效性
  * @param username 用户名
@@ -109,3 +110,7 @@ export function resetPassword(password: string, resetTicket: string) {
     },
   );
 }
+
+export const getFeishuLoginStatus = (code: string, state: string) => {
+  return apis.get(`/apis/login/lark/callback?code=${code}&state=${state}`);
+};
diff --git a/lib/apis/user.ts b/lib/apis/user.ts
@@ -1,22 +1,30 @@
 import { apis } from ".";
-import qs from "querystring";
-import { EditableProfileType, ResType, UserProfileType } from "./type";
+import type { EditableProfileType, ResType, UserProfileType } from "./type";
 
 /**
  * 用户登录
  * @param password 用户密码
  * @returns 返回用户Token
  */
-export function userLogin(password: string, loginTicket: string) {
+export function userLogin(
+  password: string,
+  loginTicket: string,
+  oauthTicket?: string | null,
+) {
   const formData = new FormData();
   formData.append("password", password);
   return apis.post<ResType<{ loginToken: string }>>(
     "/apis/user/login",
     formData,
     {
-      headers: {
-        "LOGIN-TICKET": loginTicket,
-      },
+      headers: oauthTicket
+        ? {
+            "LOGIN-TICKET": loginTicket,
+            "OAUTH-TICKET": oauthTicket,
+          }
+        : {
+            "LOGIN-TICKET": loginTicket,
+          },
     },
   );
 }

diff --git a/next.config.mjs b/next.config.mjs
@@ -5,7 +5,7 @@ const nextConfig = {
     return [
       {
         source: "/apis/:slug*",
-        destination: `http://81.68.225.220:8080/api/v1/:slug*`,
+        destination: `http://10.11.12.13:8080/api/v1/:slug*`,
       },
     ];
   },

diff --git a/package.json b/package.json
@@ -36,6 +36,7 @@
     "use-file-picker": "^2.1.1"
   },
   "devDependencies": {
+    "@biomejs/biome": "^1.8.3",
     "eslint": "8.44.0",
     "eslint-config-next": "13.4.8",
     "husky": "^8.0.0",