101 lines
3.7 KiB
HTML
101 lines
3.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
|
|
<head>
|
|
<title>websocket测试</title>
|
|
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
|
|
<link href="/jscss/style.css" rel="stylesheet" type="text/css" />
|
|
<script type="text/javascript" src="/jscss/theme.js"></script>
|
|
<style>
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container" style="display: flex;flex-flow: column;height: 100vh;">
|
|
<code>golang 直接实现。php通过workman实现。</code>
|
|
<div class="row char3">
|
|
<div class="ciy-form col-24 col-md-8">
|
|
<label>ws addr</label>
|
|
<div>
|
|
<input name="ws" style="width:100%;" type="text" value="/ws/?func=/admin/wsdemo/go.demo" />
|
|
</div>
|
|
<div style="flex: none;">
|
|
<a class="lang btn" onclick="connect()">connect</a>
|
|
<a class="lang btn" onclick="wsclose()">close</a>
|
|
</div>
|
|
</div>
|
|
<div class="ciy-form col-24 col-md-8">
|
|
<label>data</label>
|
|
<div>
|
|
<input name="data" style="width:100%;" type="text" />
|
|
</div>
|
|
<div style="flex: none;">
|
|
<a class="lang btn" onclick="send()">send</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div id="id_inp"></div>
|
|
<div style="flex: 1;overflow: auto;position: relative;">
|
|
<div style="position:absolute;top:0;right:0;cursor: pointer;" onclick="$5('#id_log').html('')">clear</div>
|
|
<div id="id_log"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<script type="text/javascript" src="/jscss/ciy.js"></script>
|
|
<script type="text/javascript" src="/jscss/ciy_websocket.js"></script>
|
|
<script type="text/javascript" src="../common.js"></script>
|
|
<script type="text/javascript">
|
|
'use strict';
|
|
var ws;
|
|
ciyfn.pageload(function () {
|
|
|
|
});
|
|
function connect() {
|
|
if(ws)
|
|
ws.close();
|
|
var wsurl = $5('[name=ws]').val();
|
|
if(wsurl.indexOf("ws") !== 0){
|
|
console.log(location);
|
|
wsurl = "wss://" + location.host + wsurl;
|
|
}
|
|
var url = wsurl;
|
|
url += '&_ciyauth=' + ciyfn.getstorage('_' + ciy_vars.tokenfield);
|
|
ws = new ciyclass.websocket(url);
|
|
ws.onopen = function (event) {
|
|
$5('#id_log').append('<div>connected:'+wsurl+'</div>');
|
|
console.log('open', event);
|
|
}
|
|
ws.onmessage = function (event) {
|
|
$5('#id_log').append('<div>Recv:' + event.data + '</div>');
|
|
console.log('onmessage', event);
|
|
}
|
|
ws.onclose = function (event) {
|
|
$5('#id_log').append('<div>Close:' + event.data + '</div>');
|
|
console.log('onclose', event);
|
|
ws.close();
|
|
}
|
|
ws.onerror = function (event) {
|
|
$5('#id_log').append('<div>Error:' + event.data + '</div>');
|
|
console.log('onerror', event);
|
|
}
|
|
console.log(ws);
|
|
}
|
|
function send() {
|
|
if(!ws)
|
|
connect();
|
|
var data = $5('[name=data]').val();
|
|
$5('#id_log').append('<div>Send:' + data + '</div>');
|
|
ws.sendjson({data:data});
|
|
}
|
|
function wsclose() {
|
|
if(ws)
|
|
ws.close();
|
|
ws = null;
|
|
$5('#id_log').append('<div>close</div>');
|
|
}
|
|
</script>
|
|
</body>
|
|
|
|
</html> |