html5中websocket用法示例代码-html代码-BFW代码库

html5中websocket用法示例代码

代码语言：html

所属分类：其他

代码描述：html5中websocket用法示例代码，简单地演示了websocket的连接、发送消息、接受消息、关闭连接功能。

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <p>
        <input id="url" type="text" value="ws://web.debug.only.bfw.wiki:8089" style="width:300px;" placeholder="websocket地址" />
        <button onclick="connect()">连接</button>
    </p>
    <p>
        <input id="text" type="text" placeholder="说点啥" />
        <button onclick="send()">发送消息</button>
    </p>
    <button onclick="closeWebSocket()">关闭WebSocket连接</button>
    <hr />
    <div id="message"></div>
</body>
<script>
    var websocket = null;



    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function () {
        closeWebSocket();
    }

    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML) {
        document.getElementById('message').innerHTML += innerHTML + '<br/>';
    }

    //关闭WebSocket连接
    function closeWe.........完整代码请登录后点击上方下载按钮下载查看