<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>webSocketTest客户端</title>

</head>

<body>

        <h4>客户端输入：</h4>

        <textarea id = "message" name="message" style="width: 200px;height: 100px"></textarea>

        <br/>

        <input type="button" value="发送到服务器" onclick="sendMessage()" />

        <h4>服务器返回消息：</h4>

        <textarea id = "responseText" name="message" style="width: 1100px;height: 100px"></textarea>

        <br/>

        <input type="button" οnclick="javascript:document.getElementById('responseText').value=''" value="clear data">

 <script type="text/javascript">

    function send(){

        alert(2);

    }

    var webSocket;

    if(window.WebSocket){

        webSocket = new WebSocket("ws://127.0.0.1:2048/ws");

        //客户端收到服务器的方法，这个方法就会被回调

        webSocket.onmessage = function (ev) {

            var contents = document.getElementById("responseText");

            contents.value = contents.value +"\n"+ ev.data;

        }

        webSocket.onopen = function (ev) {

            var contents = document.getElementById("responseText");

            contents.value = "与服务器端的websocket连接建立";

            var data = '{"method":"init","identifier":"11VKF7M0020199"}';

            webSocket.send(data);

        }

        webSocket.onclose = function (ev) {

            var contents = document.getElementById("responseText");

            contents.value =  contents.value +"\n"+ "与服务器端的websocket连接断开";

        }

    }else{

        alert("该环境不支持websocket")

    }

    function sendMessage() {

        //alert(document.getElementById("message").value);

        if(window.webSocket){

            if(webSocket.readyState == WebSocket.OPEN){

                var data2 = '{"method":"video","serialNumber":"yjdp"}';

                var data= '{"method":"video","identifier":"11VKF7M0020199","toIdentifier":"yjdp","status":"'+document.getElementById("message").value+'","url":"http://127.0.0.1:8081/UAV_FILES/FILES/0UYKG7K002001F.mp4"}';

                webSocket.send(data);

            }else{

                alert("与服务器连接尚未建立")

            }

        }

    }

</script>

</body>

</html>

java WebSocket HTML页面的更多相关文章

  1. Java WebSocket HttpSession与WebSocket Session的关联

    当HttpSession中止(通过显示地失效或超时)时,Web容器会把HttpSession属性从HttpSession中清除. javax.servlet.http.HttpSessionBindi ...

  2. 使用Jetty搭建Java Websocket Server，实现图像传输

    https://my.oschina.net/yushulx/blog/298140 How to Implement a Java WebSocket Server for Image Transm ...

  3. MinerHtmlThread.java 爬取页面线程

    MinerHtmlThread.java 爬取页面线程 package com.iteye.injavawetrust.miner; import org.apache.commons.logging ...

  4. Java WebSocket 线程安全的保证

    Java WebSocket线程安全基于3点: 1 在新的客户端连接时,WebSocket容器会创建一个新的端点实例,对应的会话实例表示从唯一的客户端到该端点实例的唯一连接. 2 每个WebSocke ...

  5. java websocket学习

    引言: websocket,webservice傻傻分不清楚,都觉得是很高深的东西,理解中的webservice是一种协议,通信协议,类似http协议的那种,比如使用webservice协议调后台接口 ...

  6. java websocket开发的客户端程序

    最近用java websocket开发的客户端程序,在和服务端链接通后,在数据传输完毕后,客户端自动关闭了链接,如何能保持链接不断开 这个是客户端的启动类,在循环完毕后,会自动断开和服务器的链接,开始 ...

  7. jsp(java server pages)：java服务器端的页面

    jsp(java server pages):java服务器端的页面 JSP的执行过程1.浏览器输入一个jsp页面2.tomcat会接受*.jsp请求,将该请求发送到org.apache.jasper ...

  8. java WebSocket Demo

    1.IDEA创建Module,结构如图(Tomcat8.0) 2.引入jar包:javax.websocket-api.jar 3.新建WebSocketTest类 import javax.webs ...

  9. Java WebSocket实现网络聊天室(群聊+私聊)

    1.简单说明 在网上看到一份比较nice的基于webSocket网页聊天项目,准备看看学习学习,如是有了这篇文章!原博主博客:http://blog.csdn.net/Amayadream/artic ...

随机推荐

  1. pycharm右键运行unittest、pytest文件

    在实际学习过程中,有时候会出现右键运行文件,但没有任何结果的情况.这就是没有使用unittest/pytest 的方式运行. 解决方法: 添加好

  2. addRoutes进行权限控制

    用addRoutes实现动态路由:https://www.jianshu.com/p/0bea4a1b0350 详解基于vue,vue-router, vuex以及addRoutes进行权限控制:ht ...

  3. Python 中__new__()和__init__()的区别

    转自: https://blog.csdn.net/weixin_37579123/article/details/89515577 __new__方法:类级别的方法 特性: 1.是在类准备将自身实例 ...

  4. Linux通配符知识深度实践详解

    注意:linux通配符和三剑客(grep.awk.sed)正则表达式是不一样的,因此,代表的意义也有较大的区别. 通配符一般用户命令行bash环境,而Linux正则表达式用于grep.sed.awk场 ...

  5. Windows主机SAM文件格式破解解密

    文件格式如是下图这种格式: 那么就可以通过通过kali终端samdump2 + system + sam 生成出来通过hashcat -m 1000去跑,或者通过md5查询

  6. [Comet OJ - Contest #4 D][39D 1584]求和_"数位dp"

    求和 题目大意: 数据范围: 题解: 脑筋急转弯可还行..... 我们发现只需要最后枚举个位/xk/xk 因为前面的贡献都是确定的了. 故此我们最后暴力统计一下就好咯. 不知道为啥我组合数一直过不去, ...

  7. Linux_目录基本操作_常用命令【详解】

    Linux_常用命令 Linux文件系统的目录树结构:[Linux世界里一切皆文件]:说白了,就是文件和文件夹(目录)之间的操作. 普通用户kkb所有文件及文件夹,其实都位于root用户的 /home ...

  8. idea的配置文件------application.properties和application.yml

    当application.yml 和 application.properties 两个文件同时存在的时候,application.properties的优先级是高于application.yml的, ...

  9. 【深入浅出-JVM】（1）：Java 虚拟机

    Java 虚拟机地位 种类 BEA的JRockit Solaris的Exact VM IBM的J9 感谢您的耐心阅读,如果您发现文章中有一些没表述清楚的,或者是不对的地方,请给我留言,您的鼓励是作者写 ...

  10. 后缀数组练习2：可重叠的k次最长重复子串

    其实和上一题是差不多的,只是在二分check的时候有一些小小的改动 1468: 后缀数组2:可重叠的k次最长重复子串 poj3261 时间限制: 1 Sec  内存限制: 128 MB提交: 113  ...