当前位置: 首页 > article >正文

Websock Demo(一)前端代码


<html>
<head>
  <meta charset="UTF-8">
  Netty WebSocket 时间服务器
</head>
<br/>
<body>
<br>
<script type="text/javascript">
  var socket;
  if (!window.WebSocket) {
    window.WebSocket = window.MozWebSocket;
  }
  if (window.WebSocket) {
  
    socket = new WebSocket("ws://ip:端口/base/websocket"); 
    socket.onmessage = function (event) {
      console.log("xxx" + event)
      var ta = document.getElementById('responseText');
      ta.value = ta.value + '\n' + event.data;
    };
    socket.onopen = function (event) {
      var ta = document.getElementById('responseText');
      ta.value = "打开WebSocket服务正常,浏览器支持WebSocket!";
    };
    socket.onclose = function (event) {
      var ta = document.getElementById('responseText');
      ta.value = "WebSocket 关闭!";
    }
  } else {
    alert("抱歉,您的浏览器不支持WebSocket协议!");
  }

  function send(message) {
    if (!window.WebSocket) {
      return;
    }
    if (socket.readyState == WebSocket.OPEN) {
      socket.send(message);
    }else {
      alert("WebSocket连接没有建立成功!");
    }
  }
</script>
<form οnsubmit="return false;">
 
  <input type="text" name="message" value="默认值">
  <br/><br/>
  <input type="button" value="发送WebSocket请求消息" οnclick="send(this.form.message.value)">
  <hr color="blue"/>
  <h3>服务端返回的应答消息</h3>
  <textarea id="responseText" style="width:500px; height: 300px;"></textarea>
</form>
</body>
</html>


http://www.kler.cn/a/560590.html

相关文章:

  • pytest运行用例的常见方式及参数
  • ChatGPT免费背后的技术暗战 国产数字孪生如何打造“虚实共生”新生态?
  • 【C】初阶数据结构7 -- 树与顺序结构的二叉树(堆)
  • 链表(LinkedList)面试题
  • 蓝桥杯客观题
  • 网络安全-新型路径攻击流程及防御措施
  • 蓝桥杯学习笔记03-滑动窗口不定长(最长/最大)
  • 性能测试项目实战
  • VMware安装CentOS 10
  • 传统 HTML 表单如何支持PUT DELETE 方法提交请求
  • Java 代理模式 (Proxy)详解
  • 最小化重投影误差求解PnP
  • 【ICE】飞冰项目中根据不同域名设置不同的网站logo
  • Python Django系列—入门实例(二)
  • 全面解析 Node-RED:功能、Docker 部署与实战示例
  • 伪404兼容huawei生效显示404
  • windows server 2016 安装 sqlserver2016数据库
  • GCC编译器(含预处理/编译/汇编/链接四阶段详解)
  • Visual Studio 安装全攻略
  • flutter Column嵌套ListView高度自适应问题