1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
| import getWsUrl from './getWsUrl';
|
| export default function (url) {
| const wsUri = getWsUrl(url);
| // 重连时间间隔 默认10秒
| const reConnectDelay = 10 * 1000;
| return {
| data() {
| return {
| SOCKET: null,
| reConnectDelay,
| timer: null
| }
| },
| computed: {
| isWSOpen: {
| cache: false,
| get() {
| return this.SOCKET && 1 == this.SOCKET.readyState;
| }
| }
| },
| methods: {
| // 打开链接
| openSocket() {
| // 初始化WebSocket 如果已经初始化 则什么都不做
| if (this.SOCKET) {
| return false;
| }
| this.WSClose();
| this.WSInit();
| },
| // 初始化
| WSInit() {
| // 未被初始化初始化
| if (!this.isWSOpen) {
| console.log('=====WSinit, url:', wsUri);
| let SOCKET = new WebSocket(wsUri);
| this.SOCKET = SOCKET;
| this.SOCKET.onmessage = this.onWSMessage;
| this.SOCKET.onopen = this.onWSOpen;
| this.SOCKET.onerror = this.onWSError;
| this.SOCKET.onclose = this.WSClose;
| }
| },
| onWSOpen() {
| },
| onWSMessage() {
| },
| onWSError(Event) {
| console.log('链接失败', wsUri);
| this.WSClose(Event);
| },
| WSClose(Event) {
| if (this.SOCKET) {
| switch (this.SOCKET.readyState) {
| case 0:
| this.SOCKET.onopen = () => {
| this.SOCKET.close();
| console.log('链接关闭', wsUri, 'close事件对象:', Event);
| this.SOCKET = null;
| // 没有event对象 则为手动关闭
| if (Event) {
| this.reConnect();
| }
| }
| break;
| case 1:
| this.SOCKET.close();
| console.log('链接关闭', wsUri, 'close事件对象:', Event);
| this.SOCKET = null;
| // 没有event对象 则为手动关闭
| if (Event) {
| this.reConnect();
| }
| break;
| case 2:
| this.SOCKET.onclose = () => {
| console.log('链接关闭', wsUri, 'close事件对象:', Event);
| this.SOCKET = null;
| // 没有event对象 则为手动关闭
| if (Event) {
| this.reConnect();
| }
| }
| break;
| case 3:
| console.log('链接关闭', wsUri, 'close事件对象:', Event);
| this.SOCKET = null;
| // 没有event对象 则为手动关闭
| if (Event) {
| this.reConnect();
| }
| break;
| }
| }
| },
| // 重连
| reConnect() {
| // 重连计时开始 就不另重连
| if (this.timer) {
| return;
| }
| this.timer = setTimeout(() => {
| this.timer = null;
| this.WSInit();
| }, this.reConnectDelay);
| }
| },
| mounted() {
| this.openSocket();
| },
| beforeDestroy() {
| this.WSClose();
| }
| }
| }
|
|
