添加websocket
This commit is contained in:
jmal
parent
fde62aaaa8
commit
ff0cce8e16
@ -2,6 +2,7 @@
|
||||
ENV = 'development'
|
||||
|
||||
# base api
|
||||
VUE_APP_WEBSOCKET = 'http://localhost:8088'
|
||||
VUE_APP_BASE_API = '/api'
|
||||
VUE_APP_BASE_FILE_API = '/file'
|
||||
VUE_APP_BASE_PRIVIEW_API = '/priview'
|
||||
|
||||
@ -2,6 +2,7 @@
|
||||
ENV = 'production'
|
||||
|
||||
# base api
|
||||
VUE_APP_WEBSOCKET = 'http://www.jmal.cloud:8088'
|
||||
VUE_APP_BASE_API = '/api'
|
||||
VUE_APP_BASE_FILE_API = '/file'
|
||||
VUE_APP_BASE_PRIVIEW_API = '/priview'
|
||||
|
||||
@ -4,6 +4,7 @@ NODE_ENV = production
|
||||
ENV = 'staging'
|
||||
|
||||
# base api
|
||||
VUE_APP_WEBSOCKET = 'http://localhost:8088'
|
||||
VUE_APP_BASE_API = '/api'
|
||||
VUE_APP_BASE_FILE_API = '/file'
|
||||
VUE_APP_BASE_PRIVIEW_API = '/priview'
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
"scriptjs": "^2.5.9",
|
||||
"sortablejs": "^1.10.2",
|
||||
"spark-md5": "^3.0.0",
|
||||
"stompjs": "^2.3.3",
|
||||
"v-contextmenu": "^2.9.0",
|
||||
"v-viewer": "^1.5.1",
|
||||
"vant": "2.5.0",
|
||||
|
||||
@ -447,8 +447,10 @@
|
||||
import '@/utils/directives.js'
|
||||
|
||||
import 'pl-table/themes/index.css';
|
||||
// import 'pl-table/themes/plTableStyle.css';
|
||||
import { PlTable, PlTableColumn } from 'pl-table';
|
||||
|
||||
// import ws from '@/websocket/websocket_config';
|
||||
|
||||
var rowStyleExecuting = false
|
||||
export default {
|
||||
name: 'ShowFile',
|
||||
@ -762,6 +764,9 @@
|
||||
|
||||
// 画矩形选区
|
||||
this.darwRectangle()
|
||||
|
||||
// 监听websocket
|
||||
this.onmessage()
|
||||
},
|
||||
destroyed() {
|
||||
window.removeEventListener('popstate', this.goBack, false);
|
||||
@ -799,6 +804,14 @@
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onmessage(){
|
||||
// if(ws.isConnected){
|
||||
// // 订阅系统数据
|
||||
// this.stompClient = ws.stompClient.subscribe('/topic/updateData', (msg) => {
|
||||
// console.log('/topic/updateData',msg)
|
||||
// },ws.headers);
|
||||
// }
|
||||
},
|
||||
load () {
|
||||
this.getFileList(true)
|
||||
},
|
||||
|
||||
@ -15,7 +15,7 @@
|
||||
<div slot="title" class="simtext-header-title">
|
||||
<span class="title-name">{{file.name}}</span>
|
||||
<div class="title-extension">
|
||||
<el-button v-if="isShowUpdateBtn" @click="update" :class="lightTheme?'':'dark-button'" size="small" :loading="updating">保存所有</el-button>
|
||||
<el-button v-if="isShowUpdateBtn" @click="saveAll" :class="lightTheme?'':'dark-button'" size="small" :loading="updating">保存所有</el-button>
|
||||
<!-- <el-button @click="changePreviewMode">{{previewMode?'预览模式':'源码模式'}}</el-button> -->
|
||||
<el-button @click="skinning" :class="lightTheme?'':'dark-button'" size="small" :icon="lightTheme?'el-icon-moon':'el-icon-sunny'" circle></el-button>
|
||||
<button class="title-extension-button" @click="fullScreen" size="small">
|
||||
@ -54,7 +54,7 @@
|
||||
:width="editorWidth"
|
||||
:height="editorHieght"
|
||||
:theme="lightTheme?'vs':'vs-dark'"
|
||||
:language="language"
|
||||
:language="item.language"
|
||||
:diffEditor="diffEditor"
|
||||
original="..."
|
||||
:value="item.content"
|
||||
@ -114,7 +114,6 @@
|
||||
return{
|
||||
lightTheme: true,
|
||||
defalutLanguage: 'redis',
|
||||
language: this.defalutLanguage,
|
||||
lineWrapping: false,
|
||||
options: {
|
||||
fontSize: 14,
|
||||
@ -184,13 +183,6 @@
|
||||
offset: 100,
|
||||
message: '<span> 正在加载数据...</span>'
|
||||
})
|
||||
let languages = monaco.languages.getLanguages();
|
||||
const languagesIndex = languages.findIndex(item => item.extensions && item.extensions.includes('.'+file.suffix))
|
||||
if(languagesIndex > -1){
|
||||
this.language = languages[languagesIndex].id
|
||||
}else{
|
||||
this.language = this.defalutLanguage
|
||||
}
|
||||
if(lineWrapping.includes(file.suffix)) {
|
||||
this.options.wordWrap = 'wordWrapColumn'
|
||||
this.lineWrapping = true
|
||||
@ -222,9 +214,12 @@
|
||||
this.editableTabs.push({
|
||||
title: res.data.name,
|
||||
copyTitle: res.data.name,
|
||||
language: this.getEditorLanguage(res.data.suffix),
|
||||
status: undefined,//标签状态
|
||||
name: res.data.path.substring(1,res.data.path.length)+res.data.name,
|
||||
content: res.data.contentText
|
||||
})
|
||||
console.log(this.editableTabs)
|
||||
this.editableTabsValue = res.data.path.substring(1,res.data.path.length)+res.data.name
|
||||
|
||||
// 界面的渲染后的初始化工作
|
||||
@ -243,6 +238,15 @@
|
||||
}
|
||||
},
|
||||
methods:{
|
||||
getEditorLanguage(suffix) {
|
||||
let editorLanguage = this.defalutLanguage
|
||||
let languages = monaco.languages.getLanguages();
|
||||
const languagesIndex = languages.findIndex(item => item.extensions && item.extensions.includes('.' + suffix))
|
||||
if (languagesIndex > -1) {
|
||||
editorLanguage = languages[languagesIndex].id
|
||||
}
|
||||
return editorLanguage;
|
||||
},
|
||||
upperLeve(){
|
||||
this.$refs.fancTree.upperLeve()
|
||||
},
|
||||
@ -319,12 +323,19 @@
|
||||
this.loading.close()
|
||||
if(this.editableTabs.findIndex(tab=> tab.name===row.path) < 0){
|
||||
// 添加一个tab
|
||||
let tab = {title: row.name,copyTitle: row.name,name: row.path,content: res.data.contentText}
|
||||
let thisTabIndex = this.editableTabs.findIndex(tab=> tab.name===this.editableTabsValue)
|
||||
if(this.editableTabs[thisTabIndex].title !== this.editableTabs[thisTabIndex].copyTitle){
|
||||
this.editableTabs.push(tab)
|
||||
}else{
|
||||
let tab = {
|
||||
title:row.name,
|
||||
copyTitle:row.name,
|
||||
status: undefined,
|
||||
language: this.getEditorLanguage(row.suffix),
|
||||
name:row.path,
|
||||
content:res.data.contentText
|
||||
}
|
||||
let thisTabIndex = this.editableTabs.findIndex(tab=> tab.status===undefined)
|
||||
if(thisTabIndex > -1){
|
||||
this.editableTabs[thisTabIndex] = tab
|
||||
}else{
|
||||
this.editableTabs.push(tab)
|
||||
}
|
||||
}
|
||||
this.editableTabsValue = row.path
|
||||
@ -358,6 +369,7 @@
|
||||
if(value === this.editableTabs[index].content){
|
||||
if(this.editableTabs[index].copyTitle !== this.editableTabs[index].title){
|
||||
this.editableTabs[index].title = this.editableTabs[index].copyTitle
|
||||
this.editableTabs[index].status = 'Modified'
|
||||
// 没有任何改变
|
||||
if(this.editableTabs.findIndex(tab=>tab.title !== tab.copyTitle) < 0){
|
||||
this.isShowUpdateBtn = false
|
||||
@ -366,10 +378,18 @@
|
||||
}else{
|
||||
if(this.editableTabs[index].copyTitle === this.editableTabs[index].title){
|
||||
this.editableTabs[index].title += '*'
|
||||
this.editableTabs[index].status = 'Modifying'
|
||||
this.isShowUpdateBtn = true
|
||||
}
|
||||
}
|
||||
},
|
||||
saveAll(){
|
||||
this.editableTabs.forEach((tab,index) => {
|
||||
if(tab.status === 'Modifying'){
|
||||
this.update(tab.content,tab.name,index)
|
||||
}
|
||||
})
|
||||
},
|
||||
save(value,index) {
|
||||
if(value !== this.editableTabs[index].content && this.isShowUpdateBtn){
|
||||
this.update(value,this.editableTabs[index].name,index)
|
||||
@ -379,6 +399,7 @@
|
||||
this.updating = true
|
||||
markdownApi.editMarkdownByPath({
|
||||
relativePath: path,
|
||||
userId: this.$store.state.user.userId,
|
||||
username: this.$store.state.user.name,
|
||||
contentText: value
|
||||
}).then(() => {
|
||||
@ -387,6 +408,7 @@
|
||||
this.editableTabs[index].content = value
|
||||
if(this.editableTabs[index].copyTitle !== this.editableTabs[index].title){
|
||||
this.editableTabs[index].title = this.editableTabs[index].copyTitle
|
||||
this.editableTabs[index].status = 'Modified'
|
||||
// 没有任何改变
|
||||
if(this.editableTabs.findIndex(tab=>tab.title !== tab.copyTitle) < 0){
|
||||
this.isShowUpdateBtn = false
|
||||
@ -461,7 +483,7 @@
|
||||
}
|
||||
});
|
||||
}
|
||||
if(!this.editableTabs[index].copyTitle !== this.editableTabs[index].title){
|
||||
if(this.editableTabs[removeIndex].status !== 'Modifying'){
|
||||
this.editableTabsValue = activeName;
|
||||
this.editableTabs = tabs.filter(tab => tab.name !== targetName);
|
||||
}else{
|
||||
|
||||
@ -22,6 +22,9 @@ import { getToken } from '@/utils/auth'
|
||||
import AudioPreview from "@/components/preview/AudioPreview";
|
||||
import globalUploader from '@/components/SimpleUploader/globalUploader.vue'
|
||||
|
||||
import {toConnection} from "@/websocket/sockJS";
|
||||
import ws from '@/websocket/websocket_config';
|
||||
|
||||
export default {
|
||||
name: 'Layout',
|
||||
components: {
|
||||
@ -65,6 +68,11 @@ export default {
|
||||
|
||||
if(getToken()){
|
||||
this.isShow = window.pc;
|
||||
//与服务器建立websocket连接
|
||||
console.log(ws)
|
||||
if(!ws.isConnected){
|
||||
toConnection(this.$store.state.user.name,this.$store.state.user.token);
|
||||
}
|
||||
}else{
|
||||
this.isShow = false
|
||||
}
|
||||
|
||||
50
src/websocket/sockJS.js
Normal file
50
src/websocket/sockJS.js
Normal file
@ -0,0 +1,50 @@
|
||||
import SockJS from 'sockjs-client';
|
||||
import Stomp from './stomp-index';
|
||||
import ws from './websocket_config';
|
||||
|
||||
export function toConnection(username,token) {
|
||||
connect(username,token);
|
||||
// 断开重连机制,尝试发送消息,捕获异常发生时重连
|
||||
ws.timer = setInterval(() => {
|
||||
try {
|
||||
if(ws.isConnected){
|
||||
ws.stompClient.send("test");
|
||||
}else{
|
||||
connect(username,token);
|
||||
}
|
||||
} catch (err) {
|
||||
connect(username,token);
|
||||
}
|
||||
}, 10000);
|
||||
}
|
||||
|
||||
function connect(username,token){
|
||||
//地址+端点路径，构建websocket链接地址,注意，对应config配置里的addEndpoint
|
||||
console.log("ws.url",ws.url,process.env)
|
||||
let socket = new SockJS(ws.url + '/mq' + '?name='+username+'&jmal-token='+token);
|
||||
// 获取STOMP子协议的客户端对象
|
||||
ws.stompClient = Stomp.over(socket);
|
||||
// 定义客户端的认证信息,按需求配置
|
||||
ws.headers = {
|
||||
Authorization:''
|
||||
};
|
||||
// 向服务器发起websocket连接
|
||||
ws.stompClient.connect(ws.headers,() => {
|
||||
ws.isConnected = true;
|
||||
// 订阅系统数据 '/topic/updateData/2/system'
|
||||
// 订阅合并数据 '/topic/updateData/mergeDate/2'
|
||||
// 订阅冷水机1号数据 /topic/updateData/2/1101/1
|
||||
}, (err) => {
|
||||
ws.isConnected = false;
|
||||
// 连接发生错误时的处理函数
|
||||
console.log(err);
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
export function disconnect() {
|
||||
if (ws.stompClient) {
|
||||
ws.stompClient.disconnect();
|
||||
}
|
||||
clearInterval(ws.timer);
|
||||
}
|
||||
6
src/websocket/stomp-index.js
Normal file
6
src/websocket/stomp-index.js
Normal file
@ -0,0 +1,6 @@
|
||||
var Stomp = require('./stomp.js');
|
||||
var StompNode = require('./stomp-node.js');
|
||||
|
||||
module.exports = Stomp.Stomp;
|
||||
module.exports.overTCP = StompNode.overTCP;
|
||||
module.exports.overWS = StompNode.overWS;
|
||||
108
src/websocket/stomp-node.js
Normal file
108
src/websocket/stomp-node.js
Normal file
@ -0,0 +1,108 @@
|
||||
// Generated by CoffeeScript 1.7.1
|
||||
|
||||
/*
|
||||
Stomp Over WebSocket http://www.jmesnil.net/stomp-websocket/doc/ | Apache License V2.0
|
||||
|
||||
Copyright (C) 2013 [Jeff Mesnil](http://jmesnil.net/)
|
||||
*/
|
||||
|
||||
(function() {
|
||||
var Stomp, net, overTCP, overWS, wrapTCP, wrapWS;
|
||||
|
||||
Stomp = require('./stomp');
|
||||
|
||||
net = require('net');
|
||||
|
||||
Stomp.Stomp.setInterval = function(interval, f) {
|
||||
return setInterval(f, interval);
|
||||
};
|
||||
|
||||
Stomp.Stomp.clearInterval = function(id) {
|
||||
return clearInterval(id);
|
||||
};
|
||||
|
||||
wrapTCP = function(port, host) {
|
||||
var socket, ws;
|
||||
socket = null;
|
||||
ws = {
|
||||
url: 'tcp:// ' + host + ':' + port,
|
||||
send: function(d) {
|
||||
return socket.write(d);
|
||||
},
|
||||
close: function() {
|
||||
return socket.end();
|
||||
}
|
||||
};
|
||||
socket = net.connect(port, host, function(e) {
|
||||
return ws.onopen();
|
||||
});
|
||||
socket.on('error', function(e) {
|
||||
return typeof ws.onclose === "function" ? ws.onclose(e) : void 0;
|
||||
});
|
||||
socket.on('close', function(e) {
|
||||
return typeof ws.onclose === "function" ? ws.onclose(e) : void 0;
|
||||
});
|
||||
socket.on('data', function(data) {
|
||||
var event;
|
||||
event = {
|
||||
'data': data.toString()
|
||||
};
|
||||
return ws.onmessage(event);
|
||||
});
|
||||
return ws;
|
||||
};
|
||||
|
||||
wrapWS = function(url) {
|
||||
var WebSocketClient, connection, socket, ws;
|
||||
WebSocketClient = require('websocket').client;
|
||||
connection = null;
|
||||
ws = {
|
||||
url: url,
|
||||
send: function(d) {
|
||||
return connection.sendUTF(d);
|
||||
},
|
||||
close: function() {
|
||||
return connection.close();
|
||||
}
|
||||
};
|
||||
socket = new WebSocketClient();
|
||||
socket.on('connect', function(conn) {
|
||||
connection = conn;
|
||||
ws.onopen();
|
||||
connection.on('error', function(error) {
|
||||
return typeof ws.onclose === "function" ? ws.onclose(error) : void 0;
|
||||
});
|
||||
connection.on('close', function() {
|
||||
return typeof ws.onclose === "function" ? ws.onclose() : void 0;
|
||||
});
|
||||
return connection.on('message', function(message) {
|
||||
var event;
|
||||
if (message.type === 'utf8') {
|
||||
event = {
|
||||
'data': message.utf8Data
|
||||
};
|
||||
return ws.onmessage(event);
|
||||
}
|
||||
});
|
||||
});
|
||||
socket.connect(url);
|
||||
return ws;
|
||||
};
|
||||
|
||||
overTCP = function(host, port) {
|
||||
var socket;
|
||||
socket = wrapTCP(port, host);
|
||||
return Stomp.Stomp.over(socket);
|
||||
};
|
||||
|
||||
overWS = function(url) {
|
||||
var socket;
|
||||
socket = wrapWS(url);
|
||||
return Stomp.Stomp.over(socket);
|
||||
};
|
||||
|
||||
exports.overTCP = overTCP;
|
||||
|
||||
exports.overWS = overWS;
|
||||
|
||||
}).call(this);
|
||||
488
src/websocket/stomp.js
Normal file
488
src/websocket/stomp.js
Normal file
@ -0,0 +1,488 @@
|
||||
// Generated by CoffeeScript 1.7.1
|
||||
|
||||
/*
|
||||
Stomp Over WebSocket http://www.jmesnil.net/stomp-websocket/doc/ | Apache License V2.0
|
||||
|
||||
Copyright (C) 2010-2013 [Jeff Mesnil](http://jmesnil.net/)
|
||||
Copyright (C) 2012 [FuseSource, Inc.](http://fusesource.com)
|
||||
*/
|
||||
|
||||
(function() {
|
||||
var Byte, Client, Frame, Stomp,
|
||||
__hasProp = {}.hasOwnProperty,
|
||||
__slice = [].slice;
|
||||
|
||||
Byte = {
|
||||
LF: '\x0A',
|
||||
NULL: '\x00'
|
||||
};
|
||||
|
||||
Frame = (function() {
|
||||
var unmarshallSingle;
|
||||
|
||||
function Frame(command, headers, body) {
|
||||
this.command = command;
|
||||
this.headers = headers != null ? headers : {};
|
||||
this.body = body != null ? body : '';
|
||||
}
|
||||
|
||||
Frame.prototype.toString = function() {
|
||||
var lines, name, skipContentLength, value, _ref;
|
||||
lines = [this.command];
|
||||
skipContentLength = this.headers['content-length'] === false ? true : false;
|
||||
if (skipContentLength) {
|
||||
delete this.headers['content-length'];
|
||||
}
|
||||
_ref = this.headers;
|
||||
for (name in _ref) {
|
||||
if (!__hasProp.call(_ref, name)) continue;
|
||||
value = _ref[name];
|
||||
lines.push("" + name + ":" + value);
|
||||
}
|
||||
if (this.body && !skipContentLength) {
|
||||
lines.push("content-length:" + (Frame.sizeOfUTF8(this.body)));
|
||||
}
|
||||
lines.push(Byte.LF + this.body);
|
||||
return lines.join(Byte.LF);
|
||||
};
|
||||
|
||||
Frame.sizeOfUTF8 = function(s) {
|
||||
if (s) {
|
||||
return encodeURI(s).match(/%..|./g).length;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
};
|
||||
|
||||
unmarshallSingle = function(data) {
|
||||
var body, chr, command, divider, headerLines, headers, i, idx, len, line, start, trim, _i, _j, _len, _ref, _ref1;
|
||||
divider = data.search(RegExp("" + Byte.LF + Byte.LF));
|
||||
headerLines = data.substring(0, divider).split(Byte.LF);
|
||||
command = headerLines.shift();
|
||||
headers = {};
|
||||
trim = function(str) {
|
||||
return str.replace(/^\s+|\s+$/g, '');
|
||||
};
|
||||
_ref = headerLines.reverse();
|
||||
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
||||
line = _ref[_i];
|
||||
idx = line.indexOf(':');
|
||||
headers[trim(line.substring(0, idx))] = trim(line.substring(idx + 1));
|
||||
}
|
||||
body = '';
|
||||
start = divider + 2;
|
||||
if (headers['content-length']) {
|
||||
len = parseInt(headers['content-length']);
|
||||
body = ('' + data).substring(start, start + len);
|
||||
} else {
|
||||
chr = null;
|
||||
for (i = _j = start, _ref1 = data.length; start <= _ref1 ? _j < _ref1 : _j > _ref1; i = start <= _ref1 ? ++_j : --_j) {
|
||||
chr = data.charAt(i);
|
||||
if (chr === Byte.NULL) {
|
||||
break;
|
||||
}
|
||||
body += chr;
|
||||
}
|
||||
}
|
||||
return new Frame(command, headers, body);
|
||||
};
|
||||
|
||||
Frame.unmarshall = function(datas) {
|
||||
var data;
|
||||
return (function() {
|
||||
var _i, _len, _ref, _results;
|
||||
_ref = datas.split(RegExp("" + Byte.NULL + Byte.LF + "*"));
|
||||
_results = [];
|
||||
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
||||
data = _ref[_i];
|
||||
if ((data != null ? data.length : void 0) > 0) {
|
||||
_results.push(unmarshallSingle(data));
|
||||
}
|
||||
}
|
||||
return _results;
|
||||
})();
|
||||
};
|
||||
|
||||
Frame.marshall = function(command, headers, body) {
|
||||
var frame;
|
||||
frame = new Frame(command, headers, body);
|
||||
return frame.toString() + Byte.NULL;
|
||||
};
|
||||
|
||||
return Frame;
|
||||
|
||||
})();
|
||||
|
||||
Client = (function() {
|
||||
var now;
|
||||
|
||||
function Client(ws) {
|
||||
this.ws = ws;
|
||||
this.ws.binaryType = "arraybuffer";
|
||||
this.counter = 0;
|
||||
this.connected = false;
|
||||
this.heartbeat = {
|
||||
outgoing: 10000,
|
||||
incoming: 10000
|
||||
};
|
||||
this.maxWebSocketFrameSize = 16 * 1024;
|
||||
this.subscriptions = {};
|
||||
}
|
||||
|
||||
Client.prototype.debug = function(message) {
|
||||
var _ref;
|
||||
return typeof window !== "undefined" && window !== null ? (_ref = window.console) != null ? void 0 : void 0 : void 0;
|
||||
};
|
||||
|
||||
now = function() {
|
||||
if (Date.now) {
|
||||
return Date.now();
|
||||
} else {
|
||||
return new Date().valueOf;
|
||||
}
|
||||
};
|
||||
|
||||
Client.prototype._transmit = function(command, headers, body) {
|
||||
var out;
|
||||
out = Frame.marshall(command, headers, body);
|
||||
if (typeof this.debug === "function") {
|
||||
this.debug(">>> " + out);
|
||||
}
|
||||
while (true) {
|
||||
if (out.length > this.maxWebSocketFrameSize) {
|
||||
this.ws.send(out.substring(0, this.maxWebSocketFrameSize));
|
||||
out = out.substring(this.maxWebSocketFrameSize);
|
||||
if (typeof this.debug === "function") {
|
||||
this.debug("remaining = " + out.length);
|
||||
}
|
||||
} else {
|
||||
return this.ws.send(out);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
Client.prototype._setupHeartbeat = function(headers) {
|
||||
var serverIncoming, serverOutgoing, ttl, v, _ref, _ref1;
|
||||
if ((_ref = headers.version) !== Stomp.VERSIONS.V1_1 && _ref !== Stomp.VERSIONS.V1_2) {
|
||||
return;
|
||||
}
|
||||
_ref1 = (function() {
|
||||
var _i, _len, _ref1, _results;
|
||||
_ref1 = headers['heart-beat'].split(",");
|
||||
_results = [];
|
||||
for (_i = 0, _len = _ref1.length; _i < _len; _i++) {
|
||||
v = _ref1[_i];
|
||||
_results.push(parseInt(v));
|
||||
}
|
||||
return _results;
|
||||
})(), serverOutgoing = _ref1[0], serverIncoming = _ref1[1];
|
||||
if (!(this.heartbeat.outgoing === 0 || serverIncoming === 0)) {
|
||||
ttl = Math.max(this.heartbeat.outgoing, serverIncoming);
|
||||
if (typeof this.debug === "function") {
|
||||
this.debug("send PING every " + ttl + "ms");
|
||||
}
|
||||
this.pinger = Stomp.setInterval(ttl, (function(_this) {
|
||||
return function() {
|
||||
_this.ws.send(Byte.LF);
|
||||
return typeof _this.debug === "function" ? _this.debug(">>> PING") : void 0;
|
||||
};
|
||||
})(this));
|
||||
}
|
||||
if (!(this.heartbeat.incoming === 0 || serverOutgoing === 0)) {
|
||||
ttl = Math.max(this.heartbeat.incoming, serverOutgoing);
|
||||
if (typeof this.debug === "function") {
|
||||
this.debug("check PONG every " + ttl + "ms");
|
||||
}
|
||||
return this.ponger = Stomp.setInterval(ttl, (function(_this) {
|
||||
return function() {
|
||||
var delta;
|
||||
delta = now() - _this.serverActivity;
|
||||
if (delta > ttl * 2) {
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug("did not receive server activity for the last " + delta + "ms");
|
||||
}
|
||||
return _this.ws.close();
|
||||
}
|
||||
};
|
||||
})(this));
|
||||
}
|
||||
};
|
||||
|
||||
Client.prototype._parseConnect = function() {
|
||||
var args, connectCallback, errorCallback, headers;
|
||||
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
||||
headers = {};
|
||||
switch (args.length) {
|
||||
case 2:
|
||||
headers = args[0], connectCallback = args[1];
|
||||
break;
|
||||
case 3:
|
||||
if (args[1] instanceof Function) {
|
||||
headers = args[0], connectCallback = args[1], errorCallback = args[2];
|
||||
} else {
|
||||
headers.login = args[0], headers.passcode = args[1], connectCallback = args[2];
|
||||
}
|
||||
break;
|
||||
case 4:
|
||||
headers.login = args[0], headers.passcode = args[1], connectCallback = args[2], errorCallback = args[3];
|
||||
break;
|
||||
default:
|
||||
headers.login = args[0], headers.passcode = args[1], connectCallback = args[2], errorCallback = args[3], headers.host = args[4];
|
||||
}
|
||||
return [headers, connectCallback, errorCallback];
|
||||
};
|
||||
|
||||
Client.prototype.connect = function() {
|
||||
var args, errorCallback, headers, out;
|
||||
args = 1 <= arguments.length ? __slice.call(arguments, 0) : [];
|
||||
out = this._parseConnect.apply(this, args);
|
||||
headers = out[0], this.connectCallback = out[1], errorCallback = out[2];
|
||||
if (typeof this.debug === "function") {
|
||||
this.debug("Opening Web Socket...");
|
||||
}
|
||||
this.ws.onmessage = (function(_this) {
|
||||
return function(evt) {
|
||||
var arr, c, client, data, frame, messageID, onreceive, subscription, _i, _len, _ref, _results;
|
||||
data = typeof ArrayBuffer !== 'undefined' && evt.data instanceof ArrayBuffer ? (arr = new Uint8Array(evt.data), typeof _this.debug === "function" ? _this.debug("--- got data length: " + arr.length) : void 0, ((function() {
|
||||
var _i, _len, _results;
|
||||
_results = [];
|
||||
for (_i = 0, _len = arr.length; _i < _len; _i++) {
|
||||
c = arr[_i];
|
||||
_results.push(String.fromCharCode(c));
|
||||
}
|
||||
return _results;
|
||||
})()).join('')) : evt.data;
|
||||
_this.serverActivity = now();
|
||||
if (data === Byte.LF) {
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug("<<< PONG");
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug("<<< " + data);
|
||||
}
|
||||
_ref = Frame.unmarshall(data);
|
||||
_results = [];
|
||||
for (_i = 0, _len = _ref.length; _i < _len; _i++) {
|
||||
frame = _ref[_i];
|
||||
switch (frame.command) {
|
||||
case "CONNECTED":
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug("connected to server " + frame.headers.server);
|
||||
}
|
||||
_this.connected = true;
|
||||
_this._setupHeartbeat(frame.headers);
|
||||
_results.push(typeof _this.connectCallback === "function" ? _this.connectCallback(frame) : void 0);
|
||||
break;
|
||||
case "MESSAGE":
|
||||
subscription = frame.headers.subscription;
|
||||
onreceive = _this.subscriptions[subscription] || _this.onreceive;
|
||||
if (onreceive) {
|
||||
client = _this;
|
||||
messageID = frame.headers["message-id"];
|
||||
frame.ack = function(headers) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
return client.ack(messageID, subscription, headers);
|
||||
};
|
||||
frame.nack = function(headers) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
return client.nack(messageID, subscription, headers);
|
||||
};
|
||||
_results.push(onreceive(frame));
|
||||
} else {
|
||||
_results.push(typeof _this.debug === "function" ? _this.debug("Unhandled received MESSAGE: " + frame) : void 0);
|
||||
}
|
||||
break;
|
||||
case "RECEIPT":
|
||||
_results.push(typeof _this.onreceipt === "function" ? _this.onreceipt(frame) : void 0);
|
||||
break;
|
||||
case "ERROR":
|
||||
_results.push(typeof errorCallback === "function" ? errorCallback(frame) : void 0);
|
||||
break;
|
||||
default:
|
||||
_results.push(typeof _this.debug === "function" ? _this.debug("Unhandled frame: " + frame) : void 0);
|
||||
}
|
||||
}
|
||||
return _results;
|
||||
};
|
||||
})(this);
|
||||
this.ws.onclose = (function(_this) {
|
||||
return function() {
|
||||
var msg;
|
||||
msg = "Whoops! Lost connection to " + _this.ws.url;
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug(msg);
|
||||
}
|
||||
_this._cleanUp();
|
||||
return typeof errorCallback === "function" ? errorCallback(msg) : void 0;
|
||||
};
|
||||
})(this);
|
||||
return this.ws.onopen = (function(_this) {
|
||||
return function() {
|
||||
if (typeof _this.debug === "function") {
|
||||
_this.debug('Web Socket Opened...');
|
||||
}
|
||||
headers["accept-version"] = Stomp.VERSIONS.supportedVersions();
|
||||
headers["heart-beat"] = [_this.heartbeat.outgoing, _this.heartbeat.incoming].join(',');
|
||||
return _this._transmit("CONNECT", headers);
|
||||
};
|
||||
})(this);
|
||||
};
|
||||
|
||||
Client.prototype.disconnect = function(disconnectCallback, headers) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
this._transmit("DISCONNECT", headers);
|
||||
this.ws.onclose = null;
|
||||
this.ws.close();
|
||||
this._cleanUp();
|
||||
return typeof disconnectCallback === "function" ? disconnectCallback() : void 0;
|
||||
};
|
||||
|
||||
Client.prototype._cleanUp = function() {
|
||||
this.connected = false;
|
||||
if (this.pinger) {
|
||||
Stomp.clearInterval(this.pinger);
|
||||
}
|
||||
if (this.ponger) {
|
||||
return Stomp.clearInterval(this.ponger);
|
||||
}
|
||||
};
|
||||
|
||||
Client.prototype.send = function(destination, headers, body) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
if (body == null) {
|
||||
body = '';
|
||||
}
|
||||
headers.destination = destination;
|
||||
return this._transmit("SEND", headers, body);
|
||||
};
|
||||
|
||||
Client.prototype.subscribe = function(destination, callback, headers) {
|
||||
var client;
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
if (!headers.id) {
|
||||
headers.id = "sub-" + this.counter++;
|
||||
}
|
||||
headers.destination = destination;
|
||||
this.subscriptions[headers.id] = callback;
|
||||
this._transmit("SUBSCRIBE", headers);
|
||||
client = this;
|
||||
return {
|
||||
id: headers.id,
|
||||
unsubscribe: function() {
|
||||
return client.unsubscribe(headers.id);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
Client.prototype.unsubscribe = function(id) {
|
||||
delete this.subscriptions[id];
|
||||
return this._transmit("UNSUBSCRIBE", {
|
||||
id: id
|
||||
});
|
||||
};
|
||||
|
||||
Client.prototype.begin = function(transaction) {
|
||||
var client, txid;
|
||||
txid = transaction || "tx-" + this.counter++;
|
||||
this._transmit("BEGIN", {
|
||||
transaction: txid
|
||||
});
|
||||
client = this;
|
||||
return {
|
||||
id: txid,
|
||||
commit: function() {
|
||||
return client.commit(txid);
|
||||
},
|
||||
abort: function() {
|
||||
return client.abort(txid);
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
Client.prototype.commit = function(transaction) {
|
||||
return this._transmit("COMMIT", {
|
||||
transaction: transaction
|
||||
});
|
||||
};
|
||||
|
||||
Client.prototype.abort = function(transaction) {
|
||||
return this._transmit("ABORT", {
|
||||
transaction: transaction
|
||||
});
|
||||
};
|
||||
|
||||
Client.prototype.ack = function(messageID, subscription, headers) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
headers["message-id"] = messageID;
|
||||
headers.subscription = subscription;
|
||||
return this._transmit("ACK", headers);
|
||||
};
|
||||
|
||||
Client.prototype.nack = function(messageID, subscription, headers) {
|
||||
if (headers == null) {
|
||||
headers = {};
|
||||
}
|
||||
headers["message-id"] = messageID;
|
||||
headers.subscription = subscription;
|
||||
return this._transmit("NACK", headers);
|
||||
};
|
||||
|
||||
return Client;
|
||||
|
||||
})();
|
||||
|
||||
Stomp = {
|
||||
VERSIONS: {
|
||||
V1_0: '1.0',
|
||||
V1_1: '1.1',
|
||||
V1_2: '1.2',
|
||||
supportedVersions: function() {
|
||||
return '1.1,1.0';
|
||||
}
|
||||
},
|
||||
client: function(url, protocols) {
|
||||
var klass, ws;
|
||||
if (protocols == null) {
|
||||
protocols = ['v10.stomp', 'v11.stomp'];
|
||||
}
|
||||
klass = Stomp.WebSocketClass || WebSocket;
|
||||
ws = new klass(url, protocols);
|
||||
return new Client(ws);
|
||||
},
|
||||
over: function(ws) {
|
||||
return new Client(ws);
|
||||
},
|
||||
Frame: Frame
|
||||
};
|
||||
|
||||
if (typeof exports !== "undefined" && exports !== null) {
|
||||
exports.Stomp = Stomp;
|
||||
}
|
||||
|
||||
if (typeof window !== "undefined" && window !== null) {
|
||||
Stomp.setInterval = function(interval, f) {
|
||||
return window.setInterval(f, interval);
|
||||
};
|
||||
Stomp.clearInterval = function(id) {
|
||||
return window.clearInterval(id);
|
||||
};
|
||||
window.Stomp = Stomp;
|
||||
} else if (!exports) {
|
||||
self.Stomp = Stomp;
|
||||
}
|
||||
|
||||
}).call(this);
|
||||
11
src/websocket/websocket_config.js
Normal file
11
src/websocket/websocket_config.js
Normal file
@ -0,0 +1,11 @@
|
||||
const url = process.env.VUE_APP_WEBSOCKET;
|
||||
let stompClient = '';
|
||||
let isConnected = false;
|
||||
let timer = '';
|
||||
|
||||
export default {
|
||||
stompClient,
|
||||
timer,
|
||||
url,
|
||||
isConnected,
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user