<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>html5 websocket test</title>
<style type="text/css">
.lahall{
font-family:'微软雅黑';
width: 682px;
background-color:lightgray;
margin:0 auto;
}
.lahtitle{
font-size:18px;
font-weight:400;
color:white;
text-shadow:2Px 3Px 2Px #000;
background-color:violet;
text-align:center;
border-radius:5px;
}
.lahbut{
margin-left:1em;
}
.lahhelp{
font-size:9px;
font-weight:1;
}
.container
{
width: 680px;
height: 300px;
overflow: auto;
border: 1px solid black;
}
.LockOff {
display: none;
visibility: hidden;
}
.LockOn {
display: block;
visibility: visible;
position: absolute;
z-index: 999;
top: 0px;
left: 0px;
width: 1024%;
height: 768%;
background-color: #ccc;
text-align: center;
padding-top: 20%;
filter: alpha(opacity=75);
opacity: 0.75;
}
</style>
<script src="jquery-min.js" type="text/javascript"></script>
<script type="text/javascript">
var ws;
var SocketCreated = false;
var isUserloggedout = false;
function lockOn(str)
{
var lock = document.getElementById('skm_LockPane');
if (lock)
lock.className = 'LockOn';
lock.innerHTML = str;
}
function lockOff()
{
var lock = document.getElementById('skm_LockPane');
lock.className = 'LockOff';
}
function ToggleConnectionClicked() {
if (SocketCreated && (ws.readyState == 0 || ws.readyState == 1)) {
lockOn("离开聊天室...");
SocketCreated = false;
isUserloggedout = true;
ws.close();
} else {
lockOn("进入聊天室...");
Log("准备连接到聊天服务器 ...");
var sUrl="ws://" + document.getElementById("Connection").value;
try {
if ("WebSocket" in window) {
ws = new WebSocket(sUrl);
}
else if("MozWebSocket" in window) {
ws = new MozWebSocket(sUrl);
}
SocketCreated = true;
isUserloggedout = false;
} catch (ex) {
Log(ex, "ERROR");
return;
}
document.getElementById("ToggleConnection").innerHTML = "断开";
ws.onopen = WSonOpen;
ws.onmessage = WSonMessage;
ws.onclose = WSonClose;
ws.onerror = WSonError;
}
};
function WSonOpen() {
lockOff();
Log("连接已经建立。", "OK");
$("#SendDataContainer").show();
ws.send("login:" + document.getElementById("txtName").value);
};
function WSonMessage(event) {
Log(event.data);
};
function WSonClose() {
lockOff();
if (isUserloggedout)
Log("【"+document.getElementById("txtName").value+"】离开了聊天室！");
document.getElementById("ToggleConnection").innerHTML = "连接";
$("#SendDataContainer").hide();
};
function WSonError() {
lockOff();
Log("远程连接中断。", "ERROR");
};
function SendDataClicked() {
if (document.getElementById("DataToSend").value.trim() != "") {
ws.send(document.getElementById("txtName").value + "说 :\"" + document.getElementById("DataToSend").value + "\"");
document.getElementById("DataToSend").value = "";
}
};
function Log(Text, MessageType) {
if (MessageType == "OK") Text = "<span style='color: green;'>" + Text + "</span>";
if (MessageType == "ERROR") Text = "<span style='color: red;'>" + Text + "</span>";
document.getElementById("LogContainer").innerHTML = document.getElementById("LogContainer").innerHTML + Text + "<br />";
var LogContainer = document.getElementById("LogContainer");
LogContainer.scrollTop = LogContainer.scrollHeight;
};
$(document).ready(function () {
$("#SendDataContainer").hide();
var WebSocketsExist = true;
try {
var dummy = new WebSocket("ws://127.0.0.1:1976");
} catch (ex) {
try
{
webSocket = new MozWebSocket("ws://127.0.0.1:1976");
}
catch(ex)
{
WebSocketsExist = false;
}
}
if (WebSocketsExist) {
Log("您的浏览器支持WebSocket. 您可以尝试连接到聊天服务器!", "OK");
document.getElementById("Connection").value = "127.0.0.1:1976";
} else {
Log("您的浏览器不支持WebSocket。请选择其他的浏览器再尝试连接服务器。", "ERROR");
document.getElementById("ToggleConnection").disabled = true;
}
$("#DataToSend").keypress(function(evt)
{
if (evt.keyCode == 13)
{
$("#SendData").click();
evt.preventDefault();
}
})
});
</script>
</head>
<body>
<div class="lahall">
<div id="skm_LockPane" class="LockOff"></div>
<form id="form1" runat="server">
<h1 class="lahtitle">Html5 WebSocket 与 Delphi 互相发消息</h1>
<br />
</p>
服务器地址: <input type="text" id="Connection" /> 用户名： <input type="text" id="txtName" value="张三"/>
<button id='ToggleConnection' type="button" onclick='ToggleConnectionClicked();'>连接</button>
<br />
<br />
<div id='LogContainer' class='container'></div>
<br />
<div id='SendDataContainer'>
<div class="lahbut">
<input type="text" id="DataToSend" size="88" />
<button id='SendData' type="button" onclick='SendDataClicked();' >发送</button>
</div>
</div>
<br />
</form>
</div>
</body>
</html>
delphi 实现 WebSocket
1星 需积分: 50 175 浏览量
2017-12-14
22:44:36
上传
评论 1
收藏 4.33MB ZIP 举报 
Delphi WebSocket.zip （11个子文件） 
html5_websocket_client 
index.html 7KB
jquery-min.js 87KB Server Win32 Debug Unit1.dcu 7KB
Project1.exe 14.69MB __history Project1.res 61KB Project1.identcache 115B Unit1.dfm 4KB Project1.dproj.local 2KB Project1.dpr 234B Unit1.pas 1KB Project1.dproj 26KB资源评论
abc_abc_tnnd2018-11-23没啥内容，
残缺的歌谣
- 粉丝: 0
- 资源: 6
最新资源
- 63bdcaf5-6734-4718-a93b-13d8f4.html
- ebb9d6214df146e2a3c4136a8e33d88b_fe6ce2e6232417d8b5b2b33b5d02c36.apk
- three.js旋转立方体
- 基于Vue的服装大脑项目数据大屏设计源码
- 今天什么节日？恶搞小软件
- Python + MongoDB开发的百度云爬虫.zip
- GB-T 28827.1-2022 信息技术服务 运行维护 第1部分：通用要求国家标准
- 负反馈放大电路的一个例子
- DMN2041L-7-F-VB一款N-Channel沟道SOT23的MOSFET晶体管参数介绍与应用说明
- 辅助抢红包APP无需root
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
