feat: 面板设置 SSL 支持选择本地证书 (#3219)

backend/app/dto/setting.go

@@ -60,7 +60,7 @@ type SettingUpdate struct {
 }
 
 type SSLUpdate struct {
-	SSLType string `json:"sslType"`
+	SSLType string `json:"sslType" validate:"required,oneof=self select import-paste import-local"`
 	Domain  string `json:"domain"`
 	SSL     string `json:"ssl" validate:"required,oneof=enable disable"`
 	Cert    string `json:"cert"`

backend/app/service/setting.go

@@ -174,6 +174,7 @@ func (u *SettingService) UpdatePort(port uint) error {
 		return err
 	}
 	go func() {
+		time.Sleep(1 * time.Second)
 		_, err := cmd.Exec("systemctl restart 1panel.service")
 		if err != nil {
 			global.LOG.Errorf("restart system port failed, err: %v", err)
@@ -249,9 +250,20 @@ func (u *SettingService) UpdateSSL(c *gin.Context, req dto.SSLUpdate) error {
 		if err := settingRepo.Update("SSLID", strconv.Itoa(int(req.SSLID))); err != nil {
 			return err
 		}
-	case "import":
+	case "import-paste":
 		secret = req.Cert
 		key = req.Key
+	case "import-local":
+		keyFile, err := os.ReadFile(req.Key)
+		if err != nil {
+			return err
+		}
+		key = string(keyFile)
+		certFile, err := os.ReadFile(req.Cert)
+		if err != nil {
+			return err
+		}
+		secret = string(certFile)
 	}
 
 	fileOp := files.NewFileOp()
@@ -274,6 +286,7 @@ func (u *SettingService) UpdateSSL(c *gin.Context, req dto.SSLUpdate) error {
 		return err
 	}
 	go func() {
+		time.Sleep(1 * time.Second)
 		_, err := cmd.Exec("systemctl restart 1panel.service")
 		if err != nil {
 			global.LOG.Errorf("restart system failed, err: %v", err)

frontend/src/views/setting/safe/index.vue

@@ -299,7 +299,7 @@ const handleSSL = async () => {
         type: 'info',
     })
         .then(async () => {
-            await updateSSL({ ssl: 'disable', domain: '', sslType: '', key: '', cert: '', sslID: 0 });
+            await updateSSL({ ssl: 'disable', domain: '', sslType: form.sslType, key: '', cert: '', sslID: 0 });
             MsgSuccess(i18n.global.t('commons.msg.operationSuccess'));
             let href = window.location.href;
             globalStore.isLogin = false;

frontend/src/views/setting/safe/ssl/index.vue

@@ -30,6 +30,12 @@
                                 {{ $t('setting.selfSignedHelper') }}
                             </span>
                         </el-form-item>
+                        <el-form-item v-if="form.sslType === 'import'" :label="$t('commons.button.import')" prop="type">
+                            <el-select v-model="form.itemSSLType">
+                                <el-option :label="$t('website.pasteSSL')" value="paste"></el-option>
+                                <el-option :label="$t('website.localSSL')" value="local"></el-option>
+                            </el-select>
+                        </el-form-item>
 
                         <el-form-item v-if="form.timeout">
                             <el-tag>{{ $t('setting.domainOrIP') }} {{ form.domain }}</el-tag>
@@ -46,7 +52,7 @@
                             </el-button>
                         </el-form-item>
 
-                        <div v-if="form.sslType === 'import'">
+                        <div v-if="form.sslType === 'import' && form.itemSSLType === 'paste'">
                             <el-form-item :label="$t('website.privateKey')" prop="key">
                                 <el-input v-model="form.key" :autosize="{ minRows: 5, maxRows: 10 }" type="textarea" />
                             </el-form-item>
@@ -55,6 +61,23 @@
                             </el-form-item>
                         </div>
 
+                        <div v-if="form.sslType === 'import' && form.itemSSLType === 'local'">
+                            <el-form-item :label="$t('website.privateKey')" prop="key">
+                                <el-input v-model="form.key">
+                                    <template #prepend>
+                                        <FileList @choose="getKeyPath" :dir="false"></FileList>
+                                    </template>
+                                </el-input>
+                            </el-form-item>
+                            <el-form-item class="marginTop" :label="$t('website.certificate')" prop="cert">
+                                <el-input v-model="form.cert">
+                                    <template #prepend>
+                                        <FileList @choose="getCertPath" :dir="false"></FileList>
+                                    </template>
+                                </el-input>
+                            </el-form-item>
+                        </div>
+
                         <div v-if="form.sslType === 'select'">
                             <el-form-item :label="$t('setting.certificate')" prop="sslID">
                                 <el-select v-model="form.sslID" @change="changeSSl(form.sslID)">
@@ -129,6 +152,7 @@ const form = reactive({
     ssl: 'enable',
     domain: '',
     sslType: 'self',
+    itemSSLType: 'paste',
     sslID: null as number,
     cert: '',
     key: '',
@@ -152,7 +176,12 @@ interface DialogProps {
     sslInfo?: Setting.SSLInfo;
 }
 const acceptParams = async (params: DialogProps): Promise<void> => {
+    if (params.sslType.indexOf('-') !== -1) {
+        form.sslType = 'import';
+        form.itemSSLType = params.sslType.split('-')[1];
+    } else {
         form.sslType = params.sslType;
+    }
     form.cert = params.sslInfo?.cert || '';
     form.key = params.sslInfo?.key || '';
     form.rootPath = params.sslInfo?.rootPath || '';
@@ -183,6 +212,14 @@ const changeSSl = (sslid: number) => {
     itemSSL.value = res[0];
 };
 
+const getKeyPath = (path: string) => {
+    form.key = path;
+};
+
+const getCertPath = (path: string) => {
+    form.cert = path;
+};
+
 const onDownload = async () => {
     await downloadSSL().then(async (file) => {
         const downloadUrl = window.URL.createObjectURL(new Blob([file]));
@@ -204,9 +241,13 @@ const onSaveSSL = async (formEl: FormInstance | undefined) => {
             cancelButtonText: i18n.global.t('commons.button.cancel'),
             type: 'info',
         }).then(async () => {
+            let itemType = form.sslType;
+            if (form.sslType === 'import') {
+                itemType = form.itemSSLType === 'paste' ? 'import-paste' : 'import-local';
+            }
             let param = {
                 ssl: 'enable',
-                sslType: form.sslType,
+                sslType: itemType,
                 domain: '',
                 sslID: form.sslID,
                 cert: form.cert,