outman/frpc-desktop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge branch 'develop'

Browse Source
This commit is contained in:
刘嘉伟 2024-12-04 17:06:30 +08:00
commit 3751a52cd6
14 changed files with 296 additions and 77 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
README.md
View File

@ -100,7 +100,7 @@
**捐赠名单**
| 🕰 时间 | 📡 平台 | 🤲 捐赠者 | 💰 金额 | ✉️ 捐赠留言 |
|------------|-------|-----------|-------|--------------------|
|------------|-------|-----------|-------|--------------------------|
| 2024-08-06 | 微信 | 三木 | 1 元 | 无 |
| 2024-08-25 | 微信 | 晚风 | 1 元 | 无 |
| 2024-08-27 | 微信 | x | 1 元 | 无 |
@ -115,6 +115,9 @@
| 2024-11-20 | 微信 | 一東 | 20 元 | 请你喝咖啡 |
| 2024-11-20 | 微信 | KEVINSKH | 10 元 | 感谢开发方便快捷的图形化操作界面👍 |
| 2024-11-26 | 微信 | | 3 元 | 无 |
| 2024-11-26 | 微信 | Kaori | 1 元 | 谢谢大佬的项目，要是能添加web控制页面就更好了 |
| 2024-12-03 | 微信 | 17¥ | 20 元 | 谢谢，很方便的软件 |
| 2024-12-03 | 微信 | Cr@k3r | 5 元 | 感谢你的工作 |
## 贡献者

4
electron/api/config.ts
View File

@ -144,7 +144,9 @@ export const initConfigApi = win => {
metaToken: sourceConfig?.metadatas?.token || "",
systemSelfStart: false,
systemStartupConnect: false,
systemSilentStartup: false
systemSilentStartup: false,
webEnable: true,
webPort: sourceConfig?.webServer?.port || 57400
};
let frpcProxys = [];
// 解析proxy

9
electron/api/frpc.ts
View File

@ -56,7 +56,8 @@ ${
: ""
}
[[${
(m.type === "stcp" || m.type === "xtcp") && m.stcpModel === "visitors"
(m.type === "stcp" || m.type === "xtcp" || m.type === "sudp") &&
m.stcpModel === "visitors"
? "visitors"
: "proxies"
}]]
@ -98,6 +99,7 @@ httpPassword = "${m.httpPassword}"
break;
case "stcp":
case "xtcp":
case "sudp":
if (m.stcpModel === "visitors") {
// 访问者
toml += `
@ -169,7 +171,7 @@ log.to = "frpc.log"
log.level = "${config.logLevel}"
log.maxDays = ${config.logMaxDays}
webServer.addr = "127.0.0.1"
webServer.port = 57400
webServer.port = ${config.webPort}
transport.tls.enable = ${config.tlsConfigEnable}
${
config.tlsConfigEnable && config.tlsConfigCertFile
@ -252,6 +254,7 @@ httpPassword = "${m.httpPassword}"
break;
case "stcp":
case "xtcp":
case "sudp":
if (m.stcpModel === "visitors") {
// 访问者
ini += `
@ -322,7 +325,7 @@ log_file = "frpc.log"
log_level = ${config.logLevel}
log_max_days = ${config.logMaxDays}
admin_addr = 127.0.0.1
admin_port = 57400
admin_port = ${config.webPort}
tls_enable = ${config.tlsConfigEnable}
${

3
electron/api/github.ts
View File

@ -119,7 +119,8 @@ export const initGitHubApi = () => {
ipcMain.on("github.getFrpVersions", async event => {
const request = net.request({
method: "get",
url: "https://api.github.com/repos/fatedier/frp/releases?page=1&per_page=1000"
// url: "https://api.github.com/repos/fatedier/frp/releases?page=1&per_page=1000"
url: "https://api.jwinks.com/github/releases"
});
request.on("response", response => {
let responseData: Buffer = Buffer.alloc(0);

15
electron/api/logger.ts
View File

@ -1,4 +1,4 @@
import { app, ipcMain } from "electron";
import { app, ipcMain, shell } from "electron";
const fs = require("fs");
const path = require("path");
@ -28,4 +28,17 @@ export const initLoggerApi = () => {
}
});
});
ipcMain.on("logger.openLog", (event, args) => {
console.log('正在打开日志');
shell.openPath(logPath).then((errorMessage) => {
if (errorMessage) {
console.error('Failed to open Logger:', errorMessage);
event.reply("Logger.openLog.hook", false);
} else {
console.log('Logger opened successfully');
event.reply("Logger.openLog.hook", true);
}
});
});
};

5
package.json
View File

@ -11,7 +11,10 @@
"frp",
"frpc",
"proxy",
"electron-app"
"electron-app",
"vue",
"vue3",
"vite"
],
"engines": {
"node": ">= 18"

16
src/components/IconifyIcon/src/offlineIcon.ts
View File

@ -1,10 +1,5 @@
import {addIcon} from "@iconify/vue/dist/offline";
/**
* 这里存放本地图标，在 src/layout/index.vue 文件中加载，避免在首启动加载
*/
// 本地菜单图标，后端在路由的icon中返回对应的图标字符串并且前端在此处使用addIcon添加即可渲染菜单图标
import Cloud from "@iconify-icons/material-symbols/cloud";
import RocketLaunchRounded from "@iconify-icons/material-symbols/rocket-launch-rounded";
import Download from "@iconify-icons/material-symbols/download-2";
@ -17,7 +12,6 @@ import MoreVert from "@iconify-icons/material-symbols/more-vert";
import Add from "@iconify-icons/material-symbols/add";
import BringYourOwnIpRounded from "@iconify-icons/material-symbols/bring-your-own-ip-rounded";
import DeleteRounded from "@iconify-icons/material-symbols/delete-rounded";
import RefreshRounded from "@iconify-icons/material-symbols/refresh-rounded";
import CancelPresentation from "@iconify-icons/material-symbols/cancel-presentation";
import GestureSelect from "@iconify-icons/material-symbols/gesture-select";
import SaveRounded from "@iconify-icons/material-symbols/save-rounded";
@ -36,6 +30,10 @@ import deviceReset from "@iconify-icons/material-symbols/device-reset";
import switchAccessOutlineRounded from "@iconify-icons/material-symbols/switch-access-outline-rounded";
import switchAccessRounded from "@iconify-icons/material-symbols/switch-access-rounded";
import chargerRounded from "@iconify-icons/material-symbols/charger-rounded";
import fileOpenRounded from "@iconify-icons/material-symbols/file-open-rounded";
import attachMoneyRounded from "@iconify-icons/material-symbols/attach-money-rounded";
import volunteerActivismSharp from "@iconify-icons/material-symbols/volunteer-activism-sharp";
import description from "@iconify-icons/material-symbols/description";
addIcon("cloud", Cloud);
addIcon("rocket-launch-rounded", RocketLaunchRounded);
@ -52,7 +50,6 @@ addIcon("delete-rounded", DeleteRounded);
addIcon("cancel-presentation", CancelPresentation);
addIcon("gesture-select", GestureSelect);
addIcon("save-rounded", SaveRounded);
addIcon("refresh-rounded", RefreshRounded);
addIcon("info", Info);
addIcon("question-mark", QuestionMark);
addIcon("check-circle-rounded", CheckCircleRounded);
@ -67,5 +64,8 @@ addIcon("downloadRounded", downloadRounded);
addIcon("deviceReset", deviceReset);
addIcon("switchAccessOutlineRounded", switchAccessOutlineRounded);
addIcon("switchAccessRounded", switchAccessRounded);
addIcon("file-open-rounded", fileOpenRounded);
addIcon("attach-money-rounded", attachMoneyRounded);
addIcon("volunteer-activism-sharp", volunteerActivismSharp);
addIcon("description", description);

16
src/layout/compoenets/LeftMenu.vue
View File

@ -118,8 +118,21 @@ onMounted(() => {
></IconifyIconOffline>
</li>
</ul>
<div class="menu-footer mb-2">
<!-- <div-->
<!-- class="menu animate__animated"-->
<!-- @click="handleOpenGitHubReleases"-->
<!-- :data-step="guideSteps.Version?.step"-->
<!-- :data-intro="guideSteps.Version?.intro"-->
<!-- data-position="top"-->
<!-- >-->
<!-- <IconifyIconOffline-->
<!-- class="animate__animated"-->
<!-- icon="attach-money-rounded"-->
<!-- ></IconifyIconOffline>-->
<!-- </div>-->
<div
class="version mb-2 animate__animated"
class="version animate__animated"
@click="handleOpenGitHubReleases"
:data-step="guideSteps.Version?.step"
:data-intro="guideSteps.Version?.intro"
@ -128,4 +141,5 @@ onMounted(() => {
{{ pkg.version }}
</div>
</div>
</div>
</template>

13
src/styles/layout.scss
View File

@ -54,11 +54,18 @@ $danger-color: #F56C6C;
display: flex; /* 设置为 flexbox */
flex-direction: column; /* 纵向排列子元素 */
.menu-footer {
margin-top: auto;
}
.version {
height: 40px;
width: 60px;
display: flex;
justify-content: center;
align-items: center;
color: $primary-color;
text-align: center;
margin-top: auto;
font-weight: bold;
font-size: 14px;
cursor: pointer;
@ -68,7 +75,7 @@ $danger-color: #F56C6C;
animation: heartBeat 1s;
}
.menu-container {
.menu-container, .menu-footer {
.menu {
display: flex;

24
src/views/about/index.vue
View File

@ -44,6 +44,22 @@ const handleOpenGitHub = () => {
ipcRenderer.send("common.openUrl", "https://github.com/luckjiawei/frpc-desktop")
}
/**
* 打开捐赠界面
*/
const handleOpenDonate = () => {
ipcRenderer.send("common.openUrl", "https://jwinks.com/donate")
}
/**
* 打开文档
*/
const handleOpenDoc = () => {
ipcRenderer.send("common.openUrl", "https://jwinks.com/p/frp")
}
/**
* 获取最后一个版本
*/
@ -124,6 +140,14 @@ defineComponent({
</p>
</div>
<div class="mt-[12px]">
<el-button plain type="success" @click="handleOpenDoc">
<IconifyIconOffline class="cursor-pointer mr-2" icon="description"/>
使用教程
</el-button>
<el-button plain type="success" @click="handleOpenDonate">
<IconifyIconOffline class="cursor-pointer mr-2" icon="volunteer-activism-sharp"/>
捐赠名单
</el-button>
<el-button plain type="primary" @click="handleOpenGitHub">
<Icon class="cursor-pointer mr-2" icon="logos:github-icon"/>
仓库地址

85
src/views/config/index.vue
View File

@ -45,7 +45,9 @@ const defaultFormData = ref<FrpConfig>({
user: "",
metaToken: "",
transportHeartbeatInterval: 30,
transportHeartbeatTimeout: 90
transportHeartbeatTimeout: 90,
webEnable: true,
webPort: 57400
});
const formData = ref<FrpConfig>(defaultFormData.value);
@ -113,6 +115,12 @@ const rules = reactive<FormRules>({
],
transportHeartbeatTimeout: [
{ required: true, message: "心跳超时时间不能为空", trigger: "change" }
],
webEnable: [
{ required: true, message: "web界面开关不能为空", trigger: "change" }
],
webPort: [
{ required: true, message: "web界面端口不能为空", trigger: "change" }
]
});
@ -187,6 +195,10 @@ onMounted(() => {
data.transportHeartbeatTimeout =
defaultFormData.value.transportHeartbeatTimeout;
}
if (data.webEnable == null || data.webEnable == undefined) {
data.webEnable = true;
data.webPort = 57400;
}
formData.value = data;
}
}
@ -687,7 +699,7 @@ onUnmounted(() => {
<div class="h2">TLS Config</div>
</el-col>
<el-col :span="24">
<el-form-item label="是否启用TLS：" prop="tlsConfigEnable">
<el-form-item label="启用TLS：" prop="tlsConfigEnable">
<el-switch
active-text="开"
inline-prompt
@ -876,7 +888,7 @@ onUnmounted(() => {
<div class="h2">代理</div>
</el-col>
<el-col :span="24">
<el-form-item label="是否启动代理：" prop="proxyConfigEnable">
<el-form-item label="启用代理：" prop="proxyConfigEnable">
<el-switch
active-text="开"
inline-prompt
@ -915,6 +927,73 @@ onUnmounted(() => {
</el-col>
</template>
<el-col :span="24">
<div class="h2">Web 界面</div>
</el-col>
<el-col :span="12">
<el-form-item label="启用Web界面：" prop="webEnable">
<template #label>
<div class="h-full flex items-center mr-1">
<el-popover width="300" placement="top" trigger="hover">
<template #reference>
<IconifyIconOffline
class="text-base"
color="#5A3DAA"
icon="info"
/>
</template>
热更新等功能依赖于web界面，<span class="font-black text-[#5A3DAA]"
>不可停用Web</span
>
</el-popover>
</div>
启用Web：
</template>
<el-switch
active-text="开"
inline-prompt
disabled
inactive-text="关"
v-model="formData.webEnable"
/>
</el-form-item>
</el-col>
<template v-if="formData.webEnable">
<el-col :span="12">
<el-form-item label="Web 端口：" prop="webPort">
<template #label>
<div class="h-full flex items-center mr-1">
<el-popover width="300" placement="top" trigger="hover">
<template #default>
对应参数：<span class="font-black text-[#5A3DAA]"
>webServer.port</span
><br/>
自行保证端口没有被占用，否则会导致启动失败
</template>
<template #reference>
<IconifyIconOffline
class="text-base"
color="#5A3DAA"
icon="info"
/>
</template>
</el-popover>
</div>
Web 端口：
</template>
<el-input-number
placeholder="57400"
v-model="formData.webPort"
:min="0"
:max="65535"
controls-position="right"
></el-input-number>
</el-form-item>
</el-col>
</template>
<el-col :span="24">
<div class="h2">日志配置</div>
</el-col>

54
src/views/logger/index.vue
View File

@ -1,7 +1,10 @@
<script lang="ts" setup>
import {defineComponent, onMounted, onUnmounted, ref} from "vue";
import { createVNode, defineComponent, onMounted, onUnmounted, ref } from "vue";
import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
import { ipcRenderer } from "electron";
import IconifyIconOffline from "@/components/IconifyIcon/src/iconifyIconOffline";
import { useDebounce, useDebounceFn } from "@vueuse/core";
import { ElMessage } from "element-plus";
defineComponent({
name: "Logger"
@ -29,6 +32,10 @@ const handleLog2Html = (logContent: string) => {
return logs.reverse().join("");
};
const refreshStatus = ref(false);
const logLoading = ref(true);
onMounted(() => {
ipcRenderer.send("logger.getLog");
ipcRenderer.on("Logger.getLog.hook", (event, args) => {
@ -38,14 +45,48 @@ onMounted(() => {
if (args) {
loggerContent.value = handleLog2Html(args);
}
logLoading.value = false;
if (refreshStatus.value) {
// 刷新逻辑
ElMessage({
type: "success",
message: "刷新成功"
});
} else {
ipcRenderer.send("logger.update");
}
});
ipcRenderer.on("Logger.update.hook", (event, args) => {
console.log("logger update hook", 1);
if (args) {
loggerContent.value = handleLog2Html(args);
}
});
ipcRenderer.on("Logger.openLog.hook", (event, args) => {
if (args) {
ElMessage({
type: "success",
message: "打开日志成功"
});
}
});
});
const openLocalLog = useDebounceFn(() => {
ipcRenderer.send("logger.openLog");
}, 1000);
const refreshLog = useDebounceFn(() => {
// ElMessage({
// type: "warning",
// icon: "<IconifyIconOffline icon=\"file-open-rounded\" />",
// message: "正在刷新日志..."
// });
refreshStatus.value = true;
logLoading.value = true;
ipcRenderer.send("logger.getLog");
}, 300);
onUnmounted(() => {
ipcRenderer.removeAllListeners("Logger.getLog.hook");
@ -53,8 +94,15 @@ onUnmounted(() => {
</script>
<template>
<div class="main">
<breadcrumb/>
<div class="app-container-breadcrumb">
<breadcrumb>
<el-button plain type="primary" @click="refreshLog">
<IconifyIconOffline icon="refresh-rounded" />
</el-button>
<el-button plain type="primary" @click="openLocalLog">
<IconifyIconOffline icon="file-open-rounded" />
</el-button>
</breadcrumb>
<div class="app-container-breadcrumb" v-loading="logLoading">
<div
class="w-full h-full p-2 bg-[#2B2B2B] rounded drop-shadow-lg overflow-y-auto"
v-html="loggerContent"

36
src/views/proxy/index.vue
View File

@ -74,7 +74,7 @@ const editForm = ref<Proxy>(defaultForm.value);
/**
* 代理类型
*/
const proxyTypes = ref(["http", "https", "tcp", "udp", "stcp", "xtcp"]);
const proxyTypes = ref(["http", "https", "tcp", "udp", "stcp", "xtcp", "sudp"]);
const stcpModels = ref([
{
@ -172,20 +172,28 @@ const isStcp = computed(() => {
return editForm.value.type === "stcp";
});
const isSudp = computed(() => {
return editForm.value.type === "sudp";
});
const isXtcp = computed(() => {
return editForm.value.type === "xtcp";
});
const isStcpVisited = computed(() => {
return (
(editForm.value.type === "stcp" || editForm.value.type === "xtcp") &&
(editForm.value.type === "stcp" ||
editForm.value.type === "sudp" ||
editForm.value.type === "xtcp") &&
editForm.value.stcpModel === "visited"
);
});
const isStcpVisitors = computed(() => {
return (
(editForm.value.type === "stcp" || editForm.value.type === "xtcp") &&
(editForm.value.type === "stcp" ||
editForm.value.type === "sudp" ||
editForm.value.type === "xtcp") &&
editForm.value.stcpModel === "visitors"
);
});
@ -463,7 +471,11 @@ const handleCopyAccessAddress = (proxy: Proxy) => {
accessAddressStr = `${proxy.type}://${proxy.customDomains[0]}`;
} else if (proxy.type === "tcp" || proxy.type === "udp") {
accessAddressStr = `${frpcConfig.value.serverAddr}:${proxy.remotePort}`;
} else if (proxy.type === "stcp" || proxy.type === "xtcp") {
} else if (
proxy.type === "stcp" ||
proxy.type === "xtcp" ||
proxy.type === "sudp"
) {
accessAddressStr = `${proxy.bindAddr}:${proxy.bindPort}`;
}
const { copy, copied } = useClipboard();
@ -612,7 +624,9 @@ onUnmounted(() => {
</el-tag>
<el-tag
v-if="
(proxy.type === 'stcp' || proxy.type === 'xtcp') &&
(proxy.type === 'stcp' ||
proxy.type === 'xtcp' ||
proxy.type === 'sudp') &&
proxy.stcpModel === 'visitors'
"
size="small"
@ -622,7 +636,9 @@ onUnmounted(() => {
<el-tag
size="small"
v-if="
(proxy.type === 'stcp' || proxy.type === 'xtcp') &&
(proxy.type === 'stcp' ||
proxy.type === 'xtcp' ||
proxy.type === 'sudp') &&
proxy.stcpModel === 'visited'
"
>被访问者
@ -796,7 +812,7 @@ onUnmounted(() => {
</el-radio-group>
</el-form-item>
</el-col>
<template v-if="isStcp || isXtcp">
<template v-if="isStcp || isSudp || isXtcp">
<el-col :span="12">
<el-form-item :label="`${editForm.type}模式：`" prop="stcpModel">
<el-radio-group v-model="editForm.stcpModel">
@ -866,7 +882,7 @@ onUnmounted(() => {
</el-button>
</el-form-item>
</el-col>
<template v-if="!(isStcp || isXtcp) || isStcpVisited">
<template v-if="!(isStcp || isXtcp || isSudp) || isStcpVisited">
<el-col :span="12">
<el-form-item label="内网地址：" prop="localIp">
<el-autocomplete
@ -1325,6 +1341,10 @@ onUnmounted(() => {
background: #f8bf4b;
}
.sudp {
background: #3d4bb9;
}
.domain-input {
width: calc(100% - 115px);
}

2
types/global.d.ts vendored
View File

@ -83,6 +83,8 @@ declare global {
metaToken: string;
transportHeartbeatInterval: number;
transportHeartbeatTimeout: number;
webEnable: boolean;
webPort: number;
};
type GitHubMirror = {