lisang
/
vue3-element-admin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: ✨ 集成`websocket`发送和订阅

This commit is contained in:
郝先瑞 2023-09-07 18:47:12 +08:00
parent eb535b3855
commit ab14ea128a
2 changed files with 9 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
package.json
View File

@ -50,6 +50,7 @@
"element-plus": "^2.3.12", "element-plus": "^2.3.12",
"lodash-es": "^4.17.21", "lodash-es": "^4.17.21",
"mockjs": "^1.1.0", "mockjs": "^1.1.0",
"net": "^1.0.2",
"nprogress": "^0.2.0", "nprogress": "^0.2.0",
"path-browserify": "^1.0.1", "path-browserify": "^1.0.1",
"path-to-regexp": "^6.2.0", "path-to-regexp": "^6.2.0",
@ -57,8 +58,8 @@
"screenfull": "^6.0.0", "screenfull": "^6.0.0",
"sockjs-client": "1.6.1", "sockjs-client": "1.6.1",
"sortablejs": "^1.15.0", "sortablejs": "^1.15.0",
"terser": "^5.19.3",
"stompjs": "^2.3.3", "stompjs": "^2.3.3",
"terser": "^5.19.3",
"vue": "^3.3.4", "vue": "^3.3.4",
"vue-i18n": "9.2.2", "vue-i18n": "9.2.2",
"vue-router": "^4.2.0", "vue-router": "^4.2.0",

10
src/views/demo/websocket.vue
View File

@ -4,8 +4,8 @@ import { sendToAll, sendToUser } from "@/api/websocket"; // 点对点消息列
import { useUserStore } from "@/store/modules/user"; import { useUserStore } from "@/store/modules/user";
import SockJS from "sockjs-client"; // 报错 global is not defined 换成下面的引入 // import SockJS from "sockjs-client"; // 报错 global is not defined 换成下面的引入
// import SockJS from "sockjs-client/dist/sockjs.min.js"; import SockJS from "sockjs-client/dist/sockjs.min.js";
import Stomp from "stompjs"; import Stomp from "stompjs";
const inputVal = ref("初始内容"); const inputVal = ref("初始内容");
@ -17,6 +17,8 @@ const userId = useUserStore().userId;
function handleSendToAll() { function handleSendToAll() {
sendToAll(inputVal.value); sendToAll(inputVal.value);
stompClient.send("/app/sendToAll", {}, inputVal.value);
} }
function handleSendToUser() { function handleSendToUser() {
@ -26,7 +28,9 @@ function handleSendToUser() {
let stompClient: Stomp.Client; let stompClient: Stomp.Client;
function initWebSocket() { function initWebSocket() {
stompClient = Stomp.overWS("ws://localhost:8989/ws"); let socket = new SockJS("http://localhost:8989/ws");
stompClient = Stomp.over(socket);
stompClient.connect({}, () => { stompClient.connect({}, () => {
console.log("连接成功"); console.log("连接成功");