<!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. Java学习笔记-Java中的常用类

    Java中有很多类是很常用的,此处列举System,Runtime,Date,Calendar,Math System System:类中的方法和属性都是静态的 字段摘要 static PrintSt ...

  2. Linux远程开发

    Linux远程开发 通常,当我们开发Linux程序时有两种方案: 在Linux上直接编写程序并进行运行测试和调试 在Windows或Mac OS X上借助工具进行远程开发 虽然我自己是在Linux环境 ...

  3. NLP 对抗方法整理

    NLP中对抗应用 1. 分词 , 可以用GAN来做,消除不同分词器的差异性 2. 风格迁移, 这个在图像中应用较多,在NLP中同样可行 3. 提高问答系统/阅读理解的性能. 4. 机器翻译应该也可以做 ...

  4. 二叉树（Java实现）

    一.常见用语 1.逻辑结构:描述数据之间逻辑上的相关关系.分为线性结构(如,字符串),和非线性结构(如,树,图). 2.物理结构:描述数据的存储结构,分为顺序结构(如,数组)和链式结构. 3.结点的度 ...

  5. 基于 CentOS 7 搭建 Git服务器

    Git 是一款免费.开源的分布式版本控制系统,用于敏捷高效地处理任何或小或大的项目. ⒈安装依赖库和编译工具 1.安装依赖库 yum install -y curl-devel expat-devel ...

  6. SpringCloud组件及功能介绍

    1.什么是SpringClould?    SpringCloud是一个基于SpringBoot实现的微服务架构开发工具.它为微服务架构中涉及的配置管理.服务治理.断路器.智能路由.微代理.控制总线. ...

  7. MySQL 数据库的备份和恢复

    1.DOS命令 mysqldump /*DOS命令生成文本文件*/ mysqldump -u username -h host -ppassword dbname [tbanme1,tbname2,. ...

  8. react中数据持久化缓存redux-persist

    一.安装redux-persist: npm install redux-persist --save 二..babelrc中增加redux-persist配置: "plugins" ...

  9. 发明专利定稿&递交申请啦，开心

    也不想写些什么,只是想简单的分享一下当前的心情! 第一版到最后一版中间因为各种事情耽误,一直弄到现在.5月中旬找的专利代理局中间连续修改很多次,从大改到小改,再到微调真的是学习到了! 下面就是搞定&l ...

  10. 序列化和反序列化在浏览器和 Web 服务器之间传递的数据、加密解密

    js中数组不能传递到后台,需进行json序列化: var data = new Array(); data.push({para1:name,para2:answer}); string data = ...