perf: 多重认证登录

packages/ui/certd-client/src/views/certd/settings/api.ts

@@ -1,26 +0,0 @@
-// @ts-ignore
-import { request } from "/@/api/service";
-const apiPrefix = "/user/settings";
-export type UserSettings = {
-  defaultNotification?: number;
-  defaultCron?: string;
-};
-
-export async function UserSettingsGet() {
-  const res = await request({
-    url: apiPrefix + "/getDefault",
-    method: "post",
-  });
-  if (!res) {
-    return {};
-  }
-  return res;
-}
-
-export async function UserSettingsSave(setting: any) {
-  return await request({
-    url: apiPrefix + "/saveDefault",
-    method: "post",
-    data: setting,
-  });
-}

packages/ui/certd-client/src/views/certd/settings/index.vue

@@ -1,74 +0,0 @@
-<template>
-  <fs-page class="page-user-settings">
-    <template #header>
-      <div class="title">设置</div>
-    </template>
-    <div class="user-settings-form settings-form">
-      <a-form
-        :model="formState"
-        name="basic"
-        :label-col="{ span: 8 }"
-        :wrapper-col="{ span: 16 }"
-        autocomplete="off"
-        @finish="onFinish"
-        @finish-failed="onFinishFailed"
-      >
-        <a-form-item label="默认定时设置" name="defaultCron">
-          <notification-selector v-model="formState.defaultCron" />
-          <div class="helper">创建流水线时默认使用此定时时间</div>
-        </a-form-item>
-
-        <a-form-item :wrapper-col="{ offset: 8, span: 16 }">
-          <a-button :loading="saveLoading" type="primary" html-type="submit">保存</a-button>
-        </a-form-item>
-      </a-form>
-    </div>
-  </fs-page>
-</template>
-
-<script setup lang="tsx">
-import { reactive, ref } from "vue";
-import * as api from "./api";
-import { UserSettings } from "./api";
-import { notification } from "ant-design-vue";
-import { merge } from "lodash-es";
-import NotificationSelector from "/@/views/certd/notification/notification-selector/index.vue";
-
-defineOptions({
-  name: "UserSettings"
-});
-
-const formState = reactive<Partial<UserSettings>>({});
-
-async function loadUserSettings() {
-  const data: any = await api.UserSettingsGet();
-  merge(formState, data);
-}
-
-const saveLoading = ref(false);
-loadUserSettings();
-const onFinish = async (form: any) => {
-  try {
-    saveLoading.value = true;
-    await api.UserSettingsSave(form);
-    notification.success({
-      message: "保存成功"
-    });
-  } finally {
-    saveLoading.value = false;
-  }
-};
-
-const onFinishFailed = (errorInfo: any) => {
-  // console.log("Failed:", errorInfo);
-};
-</script>
-
-<style lang="less">
-.page-user-settings {
-  .user-settings-form {
-    width: 500px;
-    margin: 20px;
-  }
-}
-</style>

packages/ui/certd-client/src/views/certd/settings/two-factor/api.ts

@@ -0,0 +1,40 @@
+// @ts-ignore
+import { request } from "/@/api/service";
+const apiPrefix = "/user/settings";
+export type UserTwoFactorSetting = {
+  authenticator: {
+    enabled: boolean;
+    verified: boolean;
+  };
+};
+
+export type AuthenticatorSaveReq = {
+  verifyCode?: string;
+};
+
+export async function TwoFactorSettingsGet() {
+  const res = await request({
+    url: apiPrefix + "/twoFactor/get",
+    method: "post",
+  });
+  if (!res) {
+    return {};
+  }
+  return res as UserTwoFactorSetting;
+}
+
+export async function TwoFactorAuthenticatorGet() {
+  const res = await request({
+    url: apiPrefix + "/twoFactor/authenticator/qrcode",
+    method: "post",
+  });
+  return res as string; //base64
+}
+
+export async function TwoFactorAuthenticatorSave(req: AuthenticatorSaveReq) {
+  return await request({
+    url: apiPrefix + "/twoFactor/authenticator/save",
+    method: "post",
+    data: req,
+  });
+}

packages/ui/certd-client/src/views/certd/settings/two-factor/index.vue

@@ -0,0 +1,99 @@
+<template>
+  <fs-page class="page-user-settings page-two-factor">
+    <template #header>
+      <div class="title">多重认证设置</div>
+    </template>
+    <div class="user-settings-form settings-form">
+      <a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off">
+        <a-form-item label="Authenticator APP认证" :name="['authenticator', 'enabled']">
+          <div class="flex">
+            <a-switch v-model:checked="formState.authenticator.enabled" />
+
+            <a-button v-if="formState.authenticator.enabled && formState.authenticator.verified" class="ml-1" type="primary" @click="authenticatorForm.open = true">修改</a-button>
+          </div>
+
+          <div class="helper">创建流水线时默认使用此定时时间</div>
+        </a-form-item>
+        <div v-if="authenticatorOpenRef" class="authenticator-config">
+          <h3>1. 安装任意一款 Authenticator APP</h3>
+          <div>比如：Microsoft Authenticator / Google Authenticator / Authy / Synology Secure SignIn 等</div>
+          <h3>2. 扫描二维码添加账号</h3>
+          <div v-if="authenticatorForm.qrcodeSrc" class="qrcode">
+            <img style="width: 400px; height: 400px" :src="authenticatorForm.qrcodeSrc" />
+          </div>
+          <h3>3. 输入验证码</h3>
+          <div>
+            <a-input v-model:value="authenticatorForm.verifyCode" placeholder="请输入验证码" />
+          </div>
+          <div>
+            <loading-button type="primary" html-type="button" :click="doAuthenticatorSave">确认</loading-button>
+            <a-button class="ml-1" @click="authenticatorForm.open = false">取消</a-button>
+          </div>
+        </div>
+      </a-form>
+    </div>
+  </fs-page>
+</template>
+
+<script setup lang="tsx">
+import { computed, reactive, watch } from "vue";
+import * as api from "./api";
+import { UserTwoFactorSetting } from "./api";
+import { notification } from "ant-design-vue";
+import { merge } from "lodash-es";
+
+defineOptions({
+  name: "UserSettingsTwoFactor",
+});
+
+const formState = reactive<Partial<UserTwoFactorSetting>>({});
+
+const authenticatorForm = reactive({
+  qrcodeSrc: "",
+  verifyCode: "",
+  open: false,
+});
+
+const authenticatorOpenRef = computed(() => {
+  return formState.authenticator.enabled && (authenticatorForm.open || !formState.authenticator.verified);
+});
+watch(
+  () => {
+    return authenticatorOpenRef.value;
+  },
+  async open => {
+    if (open) {
+      const data = await api.TwoFactorAuthenticatorGet();
+      //base64 转图片
+      authenticatorForm.qrcodeSrc = `data:image/png;base64,${data}`;
+    } else {
+      authenticatorForm.qrcodeSrc = "";
+      authenticatorForm.verifyCode = "";
+    }
+  }
+);
+
+async function loadUserSettings() {
+  const data: any = await api.TwoFactorSettingsGet();
+  merge(formState, data);
+}
+
+loadUserSettings();
+const doAuthenticatorSave = async (form: any) => {
+  await api.TwoFactorAuthenticatorSave({
+    verifyCode: authenticatorForm.verifyCode,
+  });
+  notification.success({
+    message: "保存成功",
+  });
+};
+</script>
+
+<style lang="less">
+.page-user-settings {
+  .user-settings-form {
+    width: 500px;
+    margin: 20px;
+  }
+}
+</style>

packages/ui/certd-server/package.json

@@ -97,9 +97,11 @@
     "nanoid": "^5.0.7",
     "node-forge": "^1.3.1",
     "nodemailer": "^6.9.16",
+    "otplib": "^12.0.1",
     "pg": "^8.12.0",
     "psl": "^1.9.0",
     "qiniu": "^7.12.0",
+    "qrcode": "^1.5.4",
     "qs": "^6.13.1",
     "querystring": "^0.2.1",
     "reflect-metadata": "^0.2.2",

packages/ui/certd-server/src/controller/user/mine/setting-two-factor-controller.ts

@@ -0,0 +1,61 @@
+import { ALL, Body, Controller, Inject, Post, Provide } from "@midwayjs/core";
+import { BaseController, Constants } from "@certd/lib-server";
+import { UserSettingsService } from "../../../modules/mine/service/user-settings-service.js";
+import { UserTwoFactorSetting } from "../../../modules/mine/service/models.js";
+import { merge } from "lodash-es";
+import { TwoFactorService } from "../../../modules/mine/service/two-factor-service.js";
+
+/**
+ */
+@Provide()
+@Controller("/api/user/settings/twoFactor")
+export class UserTwoFactorSettingController extends BaseController {
+  @Inject()
+  service: UserSettingsService;
+
+  @Inject()
+  twoFactorService: TwoFactorService;
+
+
+
+  @Post("/get", { summary: Constants.per.authOnly })
+  async get() {
+    const userId = this.getUserId();
+    const setting = await this.service.getSetting<UserTwoFactorSetting>(userId, UserTwoFactorSetting);
+    return this.ok(setting);
+  }
+
+  @Post("/save", { summary: Constants.per.authOnly })
+  async save(@Body(ALL) bean: any) {
+    const userId = this.getUserId();
+    const setting = new UserTwoFactorSetting();
+    merge(setting, bean);
+
+    // 禁用时清除
+    if(!setting.authenticator.enabled){
+        setting.authenticator.secret = null;
+        setting.authenticator.verified = false;
+    }
+
+    await this.service.saveSetting(userId, setting);
+    return this.ok({});
+  }
+
+  @Post("/authenticator/qrcode", { summary: Constants.per.authOnly })
+  async authenticatorQrcode() {
+    const userId = this.getUserId();
+    const qrcode = await this.twoFactorService.getAuthenticatorQrCode(userId);
+    return this.ok(qrcode);
+  }
+
+  @Post("/authenticator/save", { summary: Constants.per.authOnly })
+  async authenticatorSave(@Body(ALL) bean: any) {
+    const userId = this.getUserId();
+    await this.twoFactorService.saveAuthenticator({
+        userId,
+        verifyCode: bean.verifyCode,
+    });
+    return this.ok();
+  }
+
+}

packages/ui/certd-server/src/controller/user/mine/user-settings-controller.ts

@@ -1,8 +1,7 @@
-import { ALL, Body, Controller, Inject, Post, Provide, Query } from '@midwayjs/core';
-import { CrudController } from '@certd/lib-server';
-import { Constants } from '@certd/lib-server';
-import { UserSettingsService } from '../../../modules/mine/service/user-settings-service.js';
-import { UserSettingsEntity } from '../../../modules/mine/entity/user-settings.js';
+import { ALL, Body, Controller, Inject, Post, Provide, Query } from "@midwayjs/core";
+import { Constants, CrudController } from "@certd/lib-server";
+import { UserSettingsService } from "../../../modules/mine/service/user-settings-service.js";
+import { UserSettingsEntity } from "../../../modules/mine/entity/user-settings.js";
 
 /**
  */
@@ -66,4 +65,6 @@ export class UserSettingsController extends CrudController<UserSettingsService>
     const entity = await this.service.getByKey(key, this.getUserId());
     return this.ok(entity);
   }
+
+
 }

packages/ui/certd-server/src/modules/mine/service/models.ts

@@ -0,0 +1,22 @@
+import { BaseSettings } from "@certd/lib-server";
+
+export type TwoFactorAuthenticator = {
+  enabled: boolean;
+  secret?: string;
+  type?: string;
+  verified?:boolean;
+}
+
+export class UserTwoFactorSetting extends BaseSettings {
+  static __title__ = "用户多重认证设置";
+  static __key__ = "user.two.factor";
+
+  authenticator: TwoFactorAuthenticator = {
+    enabled:false,
+    verified:false,
+    type: "totp"
+  };
+
+}
+
+

packages/ui/certd-server/src/modules/mine/service/two-factor-service.ts

@@ -0,0 +1,62 @@
+import { Inject, Provide, Scope, ScopeEnum } from "@midwayjs/core";
+import { UserSettingsService } from "./user-settings-service.js";
+import { UserTwoFactorSetting } from "./models.js";
+import { utils } from "@certd/basic";
+import { UserService } from "../../sys/authority/service/user-service.js";
+
+/**
+ * 授权
+ */
+@Provide()
+@Scope(ScopeEnum.Request, { allowDowngrade: true })
+export class TwoFactorService {
+  @Inject()
+  userSettingsService: UserSettingsService;
+  @Inject()
+  userService: UserService;
+
+
+  async getAuthenticatorQrCode(userId: any) {
+    const setting = await this.userSettingsService.getSetting<UserTwoFactorSetting>(userId, UserTwoFactorSetting);
+
+    const authenticator = setting.authenticator;
+    if (!authenticator.secret) {
+      authenticator.secret = utils.id.simpleNanoId(16);
+      await this.userSettingsService.saveSetting(userId, setting);
+    }
+
+    const user = await this.userService.info(userId);
+    const username = user.username;
+    const secret = authenticator.secret;
+    const qrcodeContent = `otpauth://totp/Certd:${username}?secret=${secret}&issuer=Certd`;
+
+    //生成qrcode base64
+    const qrcode = await import("qrcode");
+    return await qrcode.toDataURL(qrcodeContent);
+
+  }
+
+  async saveAuthenticator(req: { userId: any; verifyCode: any }) {
+    const userId = req.userId;
+    const { authenticator } = await import("otplib");
+    const tfSetting = await this.userSettingsService.getSetting<UserTwoFactorSetting>(userId, UserTwoFactorSetting);
+
+    const setting = tfSetting.authenticator;
+    if (!setting.secret) {
+      throw new Error("secret is required");
+    }
+    const secret = setting.secret;
+    const token = req.verifyCode;
+
+    const isValid = authenticator.verify({ token, secret });
+    if (!isValid) {
+      throw new Error("authenticator 校验错误");
+    }
+
+    //校验成功，保存开启状态
+    setting.enabled = true;
+    setting.verified = true;
+
+    await this.userSettingsService.saveSetting(userId, setting);
+  }
+}

packages/ui/certd-server/src/modules/mine/service/user-settings-service.ts

@@ -1,8 +1,9 @@
-import { Provide, Scope, ScopeEnum } from '@midwayjs/core';
-import { InjectEntityModel } from '@midwayjs/typeorm';
-import { Repository } from 'typeorm';
-import { BaseService } from '@certd/lib-server';
-import { UserSettingsEntity } from '../entity/user-settings.js';
+import { Provide, Scope, ScopeEnum } from "@midwayjs/core";
+import { InjectEntityModel } from "@midwayjs/typeorm";
+import { Repository } from "typeorm";
+import { BaseService, BaseSettings } from "@certd/lib-server";
+import { UserSettingsEntity } from "../entity/user-settings.js";
+import { merge } from "lodash-es";
 
 /**
  * 授权
@@ -27,23 +28,29 @@ export class UserSettingsService extends BaseService<UserSettingsEntity> {
     const setting = JSON.parse(entity.setting);
     return {
       id: entity.id,
-      ...setting,
+      ...setting
     };
   }
 
   async getByKey(key: string, userId: number): Promise<UserSettingsEntity | null> {
+    if(!userId){
+      throw new Error('userId is required');
+    }
     if (!key || !userId) {
       return null;
     }
     return await this.repository.findOne({
       where: {
         key,
-        userId,
-      },
+        userId
+      }
     });
   }
 
   async getSettingByKey(key: string, userId: number): Promise<any | null> {
+    if(!userId){
+      throw new Error('userId is required');
+    }
     const entity = await this.getByKey(key, userId);
     if (!entity) {
       return null;
@@ -55,8 +62,8 @@ export class UserSettingsService extends BaseService<UserSettingsEntity> {
     const entity = await this.repository.findOne({
       where: {
         key: bean.key,
-        userId: bean.userId,
-      },
+        userId: bean.userId
+      }
     });
     if (entity) {
       entity.setting = bean.setting;
@@ -66,4 +73,39 @@ export class UserSettingsService extends BaseService<UserSettingsEntity> {
       await this.repository.save(bean);
     }
   }
+
+
+  async getSetting<T>( userId: number,type: any): Promise<T> {
+    if(!userId){
+      throw new Error('userId is required');
+    }
+    const key = type.__key__;
+    let newSetting: T = new type();
+    const savedSettings = await this.getSettingByKey(key, userId);
+    newSetting = merge(newSetting, savedSettings);
+    return newSetting;
+  }
+
+  async saveSetting<T extends BaseSettings>(userId:number,bean: T) {
+    if(!userId){
+      throw new Error('userId is required');
+    }
+    const old = await this.getSetting(userId,bean.constructor)
+    bean = merge(old,bean)
+
+    const type: any = bean.constructor;
+    const key = type.__key__;
+    const entity = await this.getByKey(key,userId);
+    const newEntity = new UserSettingsEntity();
+    if (entity) {
+      newEntity.id = entity.id;
+    }else{
+      newEntity.key = key;
+      newEntity.title = type.__title__;
+      newEntity.userId = userId;
+    }
+    entity.setting = JSON.stringify(bean);
+    await this.repository.save(entity);
+  }
+
 }