abu/wzj-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

实现websocket代理，初始化不可放nav导航栏，会连接失败，所以只能放首页

Browse Source
This commit is contained in:
thiszhc 2023-10-20 20:04:18 +08:00
parent 9150b88334
commit 31fead7d32
5 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -25,4 +25,4 @@ VITE_APP_RSA_PUBLIC_KEY = 'MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKoR8mX0rGKLqzcWmOzbf
VITE_APP_CLIENT_ID = 'e5cd7e4891bf95d1d19206ce24a7b32e' VITE_APP_CLIENT_ID = 'e5cd7e4891bf95d1d19206ce24a7b32e'
#websocket地址 #websocket地址
VITE_APP_WEBSOCKET_URL = 'ws://127.0.0.1:8098/resource/websocket' VITE_APP_WEBSOCKET_URL = '/resource/websocket'

6
src/layout/components/Navbar.vue
View File

@ -98,14 +98,13 @@ import { ComponentInternalInstance } from "vue";
import { TenantVO } from "@/api/types"; import { TenantVO } from "@/api/types";
import notice from './notice/index.vue'; import notice from './notice/index.vue';
import useNoticeStore from '@/store/modules/notice'; import useNoticeStore from '@/store/modules/notice';
import { getToken } from '@/utils/auth';
const appStore = useAppStore(); const appStore = useAppStore();
const userStore = useUserStore(); const userStore = useUserStore();
const settingsStore = useSettingsStore(); const settingsStore = useSettingsStore();
const noticeStore = storeToRefs(useNoticeStore()); const noticeStore = storeToRefs(useNoticeStore());
const newNotice = ref(<number>0); const newNotice = ref(<number>0);
let websocket = new WebSocket(import.meta.env.VITE_APP_WEBSOCKET_URL + '?Authorization=Bearer ' + getToken() + '&clientid=' + import.meta.env.VITE_APP_CLIENT_ID);
const { proxy } = getCurrentInstance() as ComponentInternalInstance; const { proxy } = getCurrentInstance() as ComponentInternalInstance;
const userId = ref(userStore.userId); const userId = ref(userStore.userId);
@ -181,7 +180,8 @@ const handleCommand = (command: string) => {
commandMap[command](); commandMap[command]();
} }
} }
//用深度监听
//用深度监听 消息
watch(() => noticeStore.state.value.notices, (newVal, oldVal) => { watch(() => noticeStore.state.value.notices, (newVal, oldVal) => {
newNotice.value = newVal.length; newNotice.value = newVal.length;
}, { deep: true }); }, { deep: true });

2
src/views/index.vue
View File

@ -99,7 +99,7 @@
import { initWebSocket } from '@/utils/websocket'; import { initWebSocket } from '@/utils/websocket';
onMounted(() => { onMounted(() => {
initWebSocket(import.meta.env.VITE_APP_WEBSOCKET_URL); initWebSocket("ws://"+window.location.host+import.meta.env.VITE_APP_BASE_API+import.meta.env.VITE_APP_WEBSOCKET_URL);
}); });
const goTarget = (url:string) => { const goTarget = (url:string) => {

2
src/views/tool/webSocket/index.vue
View File

@ -38,7 +38,7 @@ interface Conf {
} }
const conf = reactive(<Conf>{ const conf = reactive(<Conf>{
url: import.meta.env.VITE_APP_WEBSOCKET_URL, // 连接地址 url: "ws://localhost"+import.meta.env.VITE_APP_BASE_API+import.meta.env.VITE_APP_WEBSOCKET_URL, // 连接地址
send: '123', // 发送信息 send: '123', // 发送信息
message: [], // 消息列表 message: [], // 消息列表
}); });

1
vite.config.ts
View File

@ -28,6 +28,7 @@ export default defineConfig(({ mode, command }: ConfigEnv): UserConfig => {
[env.VITE_APP_BASE_API]: { [env.VITE_APP_BASE_API]: {
target: 'http://localhost:8080', target: 'http://localhost:8080',
changeOrigin: true, changeOrigin: true,
ws: true,
rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '') rewrite: (path) => path.replace(new RegExp('^' + env.VITE_APP_BASE_API), '')
} }
} }