-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtest.html
90 lines (75 loc) · 1.68 KB
/
test.html
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
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.min.js"></script>
</head>
<body>
<div id="app">
<hr>
Room:
<input v-model='roomId'></input>
<input v-if="ws_OK==false" type="button" value="connect" @click="connect()"></input>
<input v-if="ws_OK==true" type="button" value="disconnect" @click="disconnect()"></input>
<div v-if="ws_OK==true">
<textarea style="width:100%;height:500px;background:#999;">{{recvMsg}}</textarea>
<input v-model='cmd'></input>
<input type="button" value="send" @click="sendCmd()"></input>
</div>
</div>
<br>
<script>
var app = new Vue({
el: '#app',
data: {
roomId: 'webconsole_1234567',
roomType: '1',
uri:'ws://127.0.0.1:3333/wsmatcher/',
ws: null,
ws_OK: false,
recvMsg:'',
cmd:''
},
methods:{
connect() {
this.ws = new WebSocket(this.url)
var that = this
this.ws.onopen = function (evt) {
console.log("Connection opened")
that.ws_OK = true
}
this.ws.onmessage = function (evt) {
console.log("Received Message: " + evt.data)
that.recvMsg += evt.data
}
this.ws.onclose = function (evt) {
console.log("Connection closed")
that.ws_OK = false
}
},
disconnect() {
this.ws_OK = false
this.ws = null
},
sendCmd() {
this.recvMsg = ""
this.ws.send(this.cmd)
this.cmd = ''
}
},
created: function(){
},
mounted:function(){
},
computed: {
url: function() {
return this.uri + this.roomId + '?type=' + this.roomType
}
}
})
</script>
<hr>
<script>
console.log('i am demo')
</script>
</body>
</html>