public/electron-egg
1
0
Fork 0
mirror of https://gitee.com/dromara/electron-egg.git synced 2026-05-14 19:52:10 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: cross demo

Browse Source
This commit is contained in:
gaoshuaixing
2024-12-29 16:12:44 +08:00
parent 412107acf7
commit cf0bb49725
2 changed files with 194 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

210
frontend/src/views/cross/java/Index.vue
View File

@@ -1,118 +1,102 @@
<template>
<div id="app-cross-java">
<div class="one-block-1">
<span>
1. 基础控制
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="getUrl()"> 获取地址 </a-button>
<a-button @click="kill()"> kill </a-button>
<a-button @click="info()"> 查看 </a-button>
</a-space>
</div>
<div class="one-block-1">
<span>
2. 发送http请求
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="request(1)"> 前端发送 </a-button>
<a-button @click="request(2)"> 主进程发送 </a-button>
</a-space>
</div>
<div class="one-block-1">
<span>
3. 多个服务
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="killAll()"> kill所有 </a-button>
</a-space>
</div>
<div id="app-cross-java">
<div class="one-block-1">
<span>
1. 基础控制
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="getUrl()"> 获取地址 </a-button>
<a-button @click="kill()"> kill </a-button>
<a-button @click="info()"> 查看 </a-button>
</a-space>
</div>
</template>
<script>
import { ipcApiRoute } from '@/api';
import { ipc } from '@/utils/ipcRenderer';
import axios from 'axios';
export default {
data() {
return {
type: 1,
serverUrl: ''
};
},
methods: {
info() {
ipc.invoke(ipcApiRoute.cross.crossInfo, {}).then(res => {
console.log('res:', res);
})
},
getUrl() {
ipc.invoke(ipcApiRoute.cross.getCrossUrl, {name: 'javaapp'}).then(url => {
this.serverUrl = url;
this.$message.info(`服务地址: ${url}`);
})
},
kill() {
// name参数是 进程对象上的name，这里仅作为参照
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'one', name: 'javaapp'})
},
killAll() {
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'all', name: 'javaapp'})
},
create() {
ipc.invoke(ipcApiRoute.cross.createCrossServer, { program: 'java' })
},
request(type) {
if (type == 1 && this.serverUrl == "") {
this.$message.info("请先获取服务地址");
return
}
<div class="one-block-1">
<span>
2. 发送http请求
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="request(1)"> 前端发送 </a-button>
<a-button @click="request(2)"> 主进程发送 </a-button>
</a-space>
</div>
</div>
</template>
<script setup>
import { ipcApiRoute } from '@/api';
import { ipc } from '@/utils/ipcRenderer';
import axios from 'axios';
import { ref } from 'vue';
import { message } from 'ant-design-vue';
if (type == 1) {
const testApi = this.serverUrl + '/test1/get';
const cfg = {
method: 'get',
url: testApi,
params: { id: '1111111'},
timeout: 1000,
}
axios(cfg).then(res => {
console.log('res:', res);
const data = res.data || null;
this.$message.info(`服务返回: ${data}`);
})
} else {
ipc.invoke(ipcApiRoute.cross.requestApi, {name: 'javaapp', urlPath: '/test1/get', params: { id: '1111111'}}).then(res => {
console.log('res:', res);
const data = res || null;
this.$message.info(`服务返回: ${data}`);
})
}
}
}
};
</script>
<style lang="less" scoped>
#app-cross-java {
padding: 0px 10px;
text-align: left;
width: 100%;
.one-block-1 {
font-size: 16px;
padding-top: 10px;
}
.one-block-2 {
padding-top: 10px;
}
const serverUrl = ref('');
function info() {
ipc.invoke(ipcApiRoute.cross.crossInfo, {}).then(res => {
console.log('res:', res);
})
}
function getUrl() {
ipc.invoke(ipcApiRoute.cross.getCrossUrl, {name: 'javaapp'}).then(url => {
serverUrl.value = url;
message.info(`服务地址: ${url}`);
})
}
function kill() {
// name参数是 进程对象上的name，这里仅作为参照
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'one', name: 'javaapp'})
}
function create() {
ipc.invoke(ipcApiRoute.cross.createCrossServer, { program: 'java' })
}
function request(type) {
if (type == 1 && serverUrl.value == "") {
message.info("请先获取服务地址");
return
}
</style>
if (type == 1) {
const testApi = serverUrl.value + '/test1/get';
const cfg = {
method: 'get',
url: testApi,
params: { id: '1111111'},
timeout: 1000,
}
axios(cfg).then(res => {
console.log('res:', res);
const data = res.data || null;
message.info(`服务返回: ${data}`);
})
} else {
ipc.invoke(ipcApiRoute.cross.requestApi, {name: 'javaapp', urlPath: '/test1/get', params: { id: '1111111'}}).then(res => {
console.log('res:', res);
const data = res || null;
message.info(`服务返回: ${data}`);
})
}
}
</script>
<style lang="less" scoped>
#app-cross-java {
padding: 0px 10px;
text-align: left;
width: 100%;
.one-block-1 {
font-size: 16px;
padding-top: 10px;
}
.one-block-2 {
padding-top: 10px;
}
}
</style>

210
frontend/src/views/cross/python/Index.vue
View File

@@ -1,117 +1,101 @@
<template>
<div id="app-cross-python">
<div class="one-block-1">
<span>
1. 基础控制
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="getUrl()"> 获取地址 </a-button>
<a-button @click="kill()"> kill </a-button>
<a-button @click="info()"> test </a-button>
</a-space>
</div>
<div class="one-block-1">
<span>
2. 发送http请求
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="request(1)"> 前端发送 </a-button>
<a-button @click="request(2)"> 主进程发送 </a-button>
</a-space>
</div>
<div class="one-block-1">
<span>
3. 多个服务
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="killAll()"> kill all </a-button>
</a-space>
</div>
<div id="app-cross-python">
<div class="one-block-1">
<span>
1. 基础控制
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="create()"> 启动 </a-button>
<a-button @click="getUrl()"> 获取地址 </a-button>
<a-button @click="kill()"> kill </a-button>
<a-button @click="info()"> test </a-button>
</a-space>
</div>
</template>
<script>
import { ipcApiRoute } from '@/api';
import { ipc } from '@/utils/ipcRenderer';
import axios from 'axios';
export default {
data() {
return {
type: 1,
serverUrl: ''
};
},
methods: {
info() {
ipc.invoke(ipcApiRoute.cross.crossInfo, {}).then(res => {
console.log('res:', res);
})
},
getUrl() {
ipc.invoke(ipcApiRoute.cross.getCrossUrl, {name: 'pyapp'}).then(url => {
this.serverUrl = url;
this.$message.info(`服务地址: ${url}`);
})
},
kill() {
// name参数是 进程对象上的name，这里仅作为参照
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'one', name: 'pyapp'})
},
killAll() {
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'all', name: 'pyapp'})
},
create() {
ipc.invoke(ipcApiRoute.cross.createCrossServer, { program: 'python' })
},
request(type) {
if (type == 1 && this.serverUrl == "") {
this.$message.info("请先获取服务地址");
return
}
if (type == 1) {
const testApi = this.serverUrl + '/api/hello';
const cfg = {
method: 'get',
url: testApi,
params: { id: '111'},
timeout: 1000,
}
axios(cfg).then(res => {
console.log('res:', res);
const data = res.data || null;
this.$message.info(`服务返回: ${JSON.stringify(data)}`);
})
} else {
ipc.invoke(ipcApiRoute.cross.requestApi, {name: 'pyapp', urlPath: '/api/hello'}).then(res => {
console.log('res:', res);
const data = res || null;
this.$message.info(`服务返回: ${JSON.stringify(data)}`);
})
}
}
}
};
</script>
<style lang="less" scoped>
#app-cross-python {
padding: 0px 10px;
text-align: left;
width: 100%;
.one-block-1 {
font-size: 16px;
padding-top: 10px;
}
.one-block-2 {
padding-top: 10px;
}
<div class="one-block-1">
<span>
2. 发送http请求
</span>
</div>
<div class="one-block-2">
<a-space>
<a-button @click="request(1)"> 前端发送 </a-button>
<a-button @click="request(2)"> 主进程发送 </a-button>
</a-space>
</div>
</div>
</template>
<script setup>
import { ipcApiRoute } from '@/api';
import { ipc } from '@/utils/ipcRenderer';
import axios from 'axios';
import { ref } from 'vue';
import { message } from 'ant-design-vue';
const serverUrl = ref('');
function info() {
ipc.invoke(ipcApiRoute.cross.crossInfo, {}).then(res => {
console.log('res:', res);
})
}
function getUrl() {
ipc.invoke(ipcApiRoute.cross.getCrossUrl, {name: 'pyapp'}).then(url => {
serverUrl.value = url;
message.info(`服务地址: ${url}`);
})
}
function kill() {
// name参数是 进程对象上的name，这里仅作为参照
ipc.invoke(ipcApiRoute.cross.killCrossServer, {type: 'one', name: 'pyapp'})
}
function create() {
ipc.invoke(ipcApiRoute.cross.createCrossServer, { program: 'python' })
}
function request(type) {
if (type == 1 && serverUrl.value == "") {
message.info("请先获取服务地址");
return
}
</style>
if (type == 1) {
const testApi = serverUrl.value + '/api/hello';
const cfg = {
method: 'get',
url: testApi,
params: { id: '111'},
timeout: 1000,
}
axios(cfg).then(res => {
console.log('res:', res);
const data = res.data || null;
message.info(`服务返回: ${JSON.stringify(data)}`);
})
} else {
ipc.invoke(ipcApiRoute.cross.requestApi, {name: 'pyapp', urlPath: '/api/hello'}).then(res => {
console.log('res:', res);
const data = res || null;
message.info(`服务返回: ${JSON.stringify(data)}`);
})
}
}
</script>
<style lang="less" scoped>
#app-cross-python {
padding: 0px 10px;
text-align: left;
width: 100%;
.one-block-1 {
font-size: 16px;
padding-top: 10px;
}
.one-block-2 {
padding-top: 10px;
}
}
</style>