🐛 修复停止方式

electron/api/frpc.ts

@@ -2,11 +2,13 @@ import {app, ipcMain} from "electron";
 import {Config, getConfig} from "../storage/config";
 import {listProxy} from "../storage/proxy";
 import {getVersionById} from "../storage/version";
+import treeKill from "tree-kill";
 
 const fs = require("fs");
 const path = require("path");
 
 const {exec, spawn} = require("child_process");
+
 export let frpcProcess = null;
 
 const runningCmd = {
@@ -14,13 +16,6 @@ const runningCmd = {
     configPath: null
 };
 
-// const getFrpc = (config: Config) => {
-//   getVersionById(config.currentVersion, (err, document) => {
-//     if (!err) {
-//     }
-//   });
-// };
-
 /**
  * 获取选择版本的工作目录
  * @param versionId 版本ID
@@ -78,14 +73,24 @@ log.level = "${config.logLevel}"
 log.maxDays = ${config.logMaxDays}
 webServer.addr = "127.0.0.1"
 webServer.port = 57400
+transport.tls.enable = ${config.tlsConfigEnable}
+${config.tlsConfigEnable ? `
+transport.tls.certFile = "${config.tlsConfigCertFile}"
+transport.tls.keyFile = "${config.tlsConfigKeyFile}"
+transport.tls.trustedCaFile = "${config.tlsConfigTrustedCaFile}"
+transport.tls.serverName = "${config.tlsConfigServerName}"
+` : ""}
 
-${proxyToml}
+
+${proxyToml.join("")}
       `;
 
             // const configPath = path.join("frp.toml");
             const filename = "frp.toml";
+            const configPath = path.join(app.getPath("userData"), filename)
+            console.debug("生成配置成功", configPath)
             fs.writeFile(
-                path.join(app.getPath("userData"), filename), // 配置文件目录
+                configPath, // 配置文件目录
                 toml, // 配置文件内容
                 {flag: "w"},
                 err => {
@@ -106,6 +111,7 @@ ${proxyToml}
  */
 const startFrpcProcess = (commandPath: string, configPath: string) => {
     const command = `${commandPath} -c ${configPath}`;
+    console.info("启动", command)
     frpcProcess = spawn(command, {
         cwd: app.getPath("userData"),
         shell: true
@@ -113,11 +119,11 @@ const startFrpcProcess = (commandPath: string, configPath: string) => {
     runningCmd.commandPath = commandPath;
     runningCmd.configPath = configPath;
     frpcProcess.stdout.on("data", data => {
-        console.log(`命令输出: ${data}`);
+        console.debug(`命令输出: ${data}`);
     });
     frpcProcess.stdout.on("error", data => {
-        console.log(`执行错误: ${data}`);
-        frpcProcess.kill("SIGINT");
+        console.log("启动错误", data)
+        stopFrpcProcess()
     });
 };
 
@@ -128,7 +134,7 @@ export const reloadFrpcProcess = () => {
                 if (config) {
                     generateConfig(config, configPath => {
                         const command = `${runningCmd.commandPath} reload -c ${configPath}`;
-                        console.log("重启", command);
+                        console.info("重启", command);
                         exec(command, {
                             cwd: app.getPath("userData"),
                             shell: true
@@ -140,6 +146,18 @@ export const reloadFrpcProcess = () => {
     }
 };
 
+export const stopFrpcProcess = () => {
+    if (frpcProcess) {
+        treeKill(frpcProcess.pid, (error: Error) => {
+            if (error) {
+                console.log("关闭失败", frpcProcess.pid, error)
+            } else {
+                frpcProcess = null
+            }
+        })
+    }
+}
+
 export const initFrpcApi = () => {
     ipcMain.handle("frpc.running", async (event, args) => {
         if (!frpcProcess) {
@@ -184,8 +202,7 @@ export const initFrpcApi = () => {
 
     ipcMain.on("frpc.stop", () => {
         if (frpcProcess && !frpcProcess.killed) {
-            console.log("关闭");
-            frpcProcess.kill();
+            stopFrpcProcess()
         }
     });
 };

src/views/home/index.vue

@@ -1,9 +1,9 @@
 <script lang="ts" setup>
-import { defineComponent, onMounted, onUnmounted, ref } from "vue";
+import {defineComponent, onMounted, onUnmounted, ref} from "vue";
 import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
-import { ipcRenderer } from "electron";
-import { Icon } from "@iconify/vue";
-import { ElMessageBox } from "element-plus";
+import {ipcRenderer} from "electron";
+import {Icon} from "@iconify/vue";
+import {ElMessageBox} from "element-plus";
 import router from "@/router";
 
 defineComponent({
@@ -32,6 +32,7 @@ onMounted(() => {
   setInterval(() => {
     ipcRenderer.invoke("frpc.running").then(data => {
       running.value = data;
+      console.log('进程状态', data)
     });
   }, 300);
 
@@ -57,37 +58,37 @@ onUnmounted(() => {
 
 <template>
   <div class="main">
-    <breadcrumb />
+    <breadcrumb/>
     <div class="app-container-breadcrumb">
       <div
-        class="w-full h-full bg-white p-4 rounded drop-shadow-lg overflow-y-auto flex justify-center items-center"
+          class="w-full h-full bg-white p-4 rounded drop-shadow-lg overflow-y-auto flex justify-center items-center"
       >
         <div class="flex">
           <div
-            class="w-40 h-40 border-[#5A3DAA] text-[#5A3DAA] border-4 rounded-full flex justify-center items-center text-[100px] relative"
+              class="w-40 h-40 border-[#5A3DAA] text-[#5A3DAA] border-4 rounded-full flex justify-center items-center text-[100px] relative"
           >
             <transition name="fade">
               <div
-                v-show="running"
-                class="z-0 rounded-full opacity-20 left-circle bg-[#5A3DAA] w-full h-full animation-rotate-1"
+                  v-show="running"
+                  class="z-0 rounded-full opacity-20 left-circle bg-[#5A3DAA] w-full h-full animation-rotate-1"
               />
             </transition>
             <transition name="fade">
               <div
-                v-show="running"
-                class="z-0 rounded-full opacity-20 right-circle top-[10px] bg-[#5A3DAA] w-full h-full animation-rotate-2"
+                  v-show="running"
+                  class="z-0 rounded-full opacity-20 right-circle top-[10px] bg-[#5A3DAA] w-full h-full animation-rotate-2"
               />
             </transition>
             <transition name="fade">
               <div
-                v-show="running"
-                class="z-0 rounded-full opacity-20 top-circle bg-[#5A3DAA] w-full h-full animation-rotate-3"
+                  v-show="running"
+                  class="z-0 rounded-full opacity-20 top-circle bg-[#5A3DAA] w-full h-full animation-rotate-3"
               />
             </transition>
             <div
-              class="bg-white z-10 w-full h-full bg-white absolute rounded-full flex justify-center items-center"
+                class="bg-white z-10 w-full h-full bg-white absolute rounded-full flex justify-center items-center"
             >
-              <Icon icon="material-symbols:rocket-launch-rounded" />
+              <Icon icon="material-symbols:rocket-launch-rounded"/>
             </div>
           </div>
           <div class="flex justify-center items-center">
@@ -97,16 +98,19 @@ onUnmounted(() => {
                   Frpc {{ running ? "已启动" : "已断开" }}
                 </div>
               </transition>
-              <el-button
-                class="block"
-                type="text"
-                v-if="running"
-                @click="$router.replace({ name: 'Logger' })"
-                >查看日志
-              </el-button>
+<!--              <el-button-->
+<!--                  class="block"-->
+<!--                  type="text"-->
+<!--                  v-if="running"-->
+<!--                  @click="$router.replace({ name: 'Logger' })"-->
+<!--              >查看日志-->
+<!--              </el-button>-->
+              <div class="w-full justify-center text-center">
+                <el-link v-if="running" type="primary" @click="$router.replace({ name: 'Logger' })">查看日志</el-link>
+              </div>
               <div
-                class="w-full h-8 bg-[#563EA4] rounded flex justify-center items-center text-white font-bold cursor-pointer"
-                @click="handleButtonClick"
+                  class="w-full h-8 bg-[#563EA4] rounded flex justify-center items-center text-white font-bold cursor-pointer"
+                  @click="handleButtonClick"
               >
                 {{ running ? "断 开" : "启 动" }}
               </div>