68 lines
3.4 MiB
HTML
68 lines
3.4 MiB
HTML
|
<!-- index.html -->
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<link href="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video-js.min.css" rel="stylesheet">
|
||
|
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/video.js/7.3.0/video.min.js"></script>
|
||
|
|
<script type="text/javascript" src="http://cdn.sockjs.org/sockjs-0.3.4.js"></script>
|
||
|
|
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="container">
|
||
|
|
<h1>WebSocket Test</h1>
|
||
|
|
<form class="form-inline" id="echo-form">
|
||
|
|
<div class="form-group">
|
||
|
|
<p>数据输入的参数格式</p>
|
||
|
|
|
||
|
|
<textarea cols="2" rows="6" style="width:600px;height:200px;" class="form-control" id="message">
|
||
|
|
{
|
||
|
|
"Topic": "Unreal",
|
||
|
|
"Data": {
|
||
|
|
"Key": "audio",
|
||
|
|
"Value": "D:\coding\NeRF\xuniren\aispeech\data\audio\aud_1.wav",
|
||
|
|
"Time": 10,
|
||
|
|
"Type": "interact"
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</textarea>
|
||
|
|
</div>
|
||
|
|
<button type="submit" class="btn btn-default">Send</button>
|
||
|
|
</form>
|
||
|
|
<div id="log">
|
||
|
|
|
||
|
|
</div>
|
||
|
|
<video id="example_video" controls="controls" ></video>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
<script type="text/javascript" charset="utf-8">
|
||
|
|
|
||
|
|
$(document).ready(function() {
|
||
|
|
var ws = new WebSocket('ws://39.106.151.142:8000/dighuman');
|
||
|
|
//aa = {"video": "data:video/mp4;base64,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
|
||
|
|
//document.getElementsByTagName("video")[0].setAttribute("src", aa["video"]);
|
||
|
|
ws.onopen = function() {
|
||
|
|
console.log('Connected');
|
||
|
|
};
|
||
|
|
ws.onmessage = function(e) {
|
||
|
|
console.log('Received: ' + e.data);
|
||
|
|
data = e
|
||
|
|
var vid = JSON.parse(data.data);
|
||
|
|
console.log(typeof(vid),vid)
|
||
|
|
document.getElementsByTagName("video")[0].setAttribute("src", vid["video"]);
|
||
|
|
|
||
|
|
};
|
||
|
|
ws.onclose = function(e) {
|
||
|
|
console.log('Closed');
|
||
|
|
};
|
||
|
|
$('#echo-form').on('submit', function(e) {
|
||
|
|
e.preventDefault();
|
||
|
|
var message = $('#message').val();
|
||
|
|
console.log('Sending: ' + message);
|
||
|
|
ws.send(message);
|
||
|
|
$('#message').val('');
|
||
|
|
});
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
</html>
|