Closed. This question is off-topic 。它目前不接受答案。
想改善这个问题吗？ Update the question 所以它是堆栈溢出的 on-topic。
8年前关闭。
Improve this question
我一直在网上搜索演示 WebSocket 的简单页面。但是我发现的所有示例似乎都支持旧协议(protocol)，无法在 Firefox 6 和 Chrome 14 中工作。
例如:http://html5demos.com/web-socket
我只是想在某处看到一些可行的演示，这样我就可以确保是我的代码失败了，而不是浏览器对 web 套接字的实现。
想改善这个问题吗？ Update the question 所以它是堆栈溢出的 on-topic。
8年前关闭。
Improve this question
我一直在网上搜索演示 WebSocket 的简单页面。但是我发现的所有示例似乎都支持旧协议(protocol)，无法在 Firefox 6 和 Chrome 14 中工作。
例如:http://html5demos.com/web-socket
我只是想在某处看到一些可行的演示，这样我就可以确保是我的代码失败了，而不是浏览器对 web 套接字的实现。
最佳答案
WEBSOCKET 服务器演示目前适用于 Firefox 7 BETA 和 Chrome DEV(现在为 16)。不是 Firefox 6，它使用 WEBSOCKET 草案协议(protocol)的旧版本。 (只是想我会提到这一点，因为我看到来自 Firefox 6 的很多服务器点击 - 肯定会让那些尝试它的人不满意。)
这是 Cameron 建议的演示中的代码。不确定它是否完全符合您对“简单”事物的要求。它在一个框架内运行，并且函数 showResults() 打印从浏览器发送的信息以及从服务器收到的信息被发送到另一个框架。所有源代码都可在 ( demo server changes - check bottom of this blog article for up-to-date link to demo ... demo has a download link ) 获得。否则，将它(在开始时)转回单页应用程序时不应该花费大量精力。建议如果您需要，首先将 showResults() 指向同一页面中的 div 而不是其他页面。
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<title>HLL Command Center</title>
<meta http-equiv="Content-Type" content="text/html; charset="utf-8" />
<meta name="description" content="HTML5 Websockets for the HLL high level logic open source project" />
<meta name="keywords" content="high level logic, hll, open source, artificial intelligence, agents" />
<meta name="author" content="Roger F. Gay" />
<meta name="owner" content="[email protected]" />
<meta name="copyright" content="%a9 2011 Roger F. Gay" />
<meta name="license" content="Lesser General Public License (LGPL v. 2.1)" />
<meta name="website" content="http://hll.dev.java.net" />
<meta name="permission" content="restricted" />
<meta name="created" content="20110801" />
<meta name="changed" content="20110902" />
<meta name="security" content="public" />
<meta name="generator" content="skill, knowledge, and intelligence" />
<style type="text/css">
body {background-color:Khaki;}
</style>
<script type="text/javascript">
var websocket;
var connected=false;
var frameDoc;
var appType;
function doConnect(wsURIValue) {
if (connected) {
showResults("<span style='color: red;'>You're already connected!</span>");
} else {
if (appType == "Mozilla") {
websocket = new MozWebSocket(document.getElementById('wsURI').value);
} else {
websocket = new WebSocket(document.getElementById('wsURI').value);
}
websocket.onopen = function(evt) { onOpen(evt) };
websocket.onclose = function(evt) { onClose(evt) };
websocket.onmessage = function(evt) { onMessage(evt) };
websocket.onerror = function(evt) { onError(evt) };
}
}
function onOpen(evt) {
connected=true;
showResults("CONNECTED");
doSend("WebSocket rocks!");
}
function onClose(evt) {
connected=false;
websocket.close();
showResults("DISCONNECTED");
}
function doPing () {
if (connected) {
showResults("Not yet implemented in browser. Sending pseudo-ping message: 'Ping'.");
websocket.send('Ping');
} else {
showResults("<span style='color: red;'>NOT CONNECTED: No pseudo-ping message sent.</span>");
}
}
function onMessage(evt) {
showResults("<span style='color: blue;'>RESP: " + evt.data + "</span>");
}
function onError(evt) {
showResults("<span style='color: red;'>ERROR:</span> " + evt.data);
}
function doSend(message) {
if (connected) {
websocket.send(message);
showResults("SENT: " + message);
} else {
showResults("<span style='color: red;'>NOT CONNECTED: No message sent.</span>");
}
}
function doMultiple (message) {
for (i=0; i<n_times; i++) {
if (connected) {
websocket.send(message);
showResults("SENT: " + message);
} else {
showResults("<span style='color: red;'>NOT CONNECTED: No message sent.</span>");
}
}
}
function doClose(message) {
if (connected) {
showResults("CLOSING");
websocket.close();
connected=false;
} else {
showResults("<span style='color: red;'>NOT CONNECTED</span>");
}
}
function showResults(message) {
frameDoc.showResults(message);
}
function init() {
if ((frameDoc = parent.results)) {
document.getElementById('wsURI').value=wsUri;
document.getElementById('message').value=mess;
showResults("Frame communication confirmed.");
} else {
document.getElementById("testit1").innerHTML = "<span style='color:red'>Interframe communication failed for this webpage.</span>";
alert("Problem printing output: This application has been tested with up-to-date versions of Chrome, Firefox, and MSIE. (May 22, 2011)");
return;
}
if (typeof MozWebSocket != "undefined") { // (window.MozWebSocket)
appType = "Mozilla";
} else if (window.WebSocket) {
appType = "Chrome";
} else {
showResults('<strong style="color: red;">ERROR: This browser does not support WebSockets.</strong>');
return;
}
}
function changeNTimes () {
n_times = flowContainer.ntimes.options[document.flowContainer.ntimes.selectedIndex].value;
}
var wsUri = "ws://isr2.mine.nu/echo";
var mess = "HLL International: " + String.fromCharCode(196,197,214) + " " + String.fromCharCode(945,946,948) + " " + String.fromCharCode(20149,20150,20153) + " " + String.fromCharCode(1490,1513,1488,1458) + " " + String.fromCharCode(286,350,399);
var n_times=5;
// window.addEventListener("load", init, false);
</script>
</head>
<body onload="init()">
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/chrome-frame/1/CFInstall.min.js"></script>
<b>Server: </b>
<input type='button' onclick="doConnect(document.getElementById('wsURI').value)" value='Open Connection' />
<input type='button' onclick="doClose()" value='Close Connection' />
<input type='button' onclick="doPing()" value='Ping' /><br>
<input type='text' style="text-align:left;" size='65' id='wsURI' /><br><br>
<span style="background-color:#CCCCCC">
<b><input type="radio" id="encoding" value="text" disabled="true" checked /> text
<input type="radio" id="encoding" value="binary" disabled="true" /> binary</b>
(binary not yet browser supported) <br><br>
</span>
<b>Message: </b>
<input type='button' onclick="doSend(document.getElementById('message').value)" value='Send Message to Server' /><br>
<textarea cols="50" rows="3" maxlength='260' id="message" ></textarea><br><br>
<b>Continuation (will be sent if not null): </b><br>
<textarea cols="50" rows="3" maxlength='125' id="continued" ></textarea><br><br>
<form name="flowContainer">
<input type='button' onclick="doMultiple(document.getElementById('message').value)" value='MultiMessage' /><br>
<select name="ntimes" onchange="changeNTimes()">
<option value="5" selected="selected">5</option>
<option value="10">10</option>
<option value="20">20</option>
</select>
</form>
<div id='testit3' name='testit3' style='color:blue'></div><br><br>
<div id='testit1' name='testit1' style='color:green'></div>
<script>
// You may want to place these lines inside an onload handler
CFInstall.check({
mode: "overlay",
destination: "http://www.waikiki.com"
});
</script>
</body>
</html>
关于html - 最新 WebSocket 协议(protocol)的演示页面，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7570143/
10-12 20:51