Menu
this is the demo that a Simple chat client , you must open it on webkit Browser like: chrome and Safari,
the demo use a web socket server based on node.js: websocket-server-node.js,
but i think it cant Deploy on google app engine ,
so did you know how to make a websocket using python on google app engine ,
and running the demo on it ,
thanks
this is the code :
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset=utf-8 />
<meta name="viewport" content="width=620" />
<title>HTML5 Demo: Web Socket</title>
<link rel="stylesheet" href="http://html5demos.com/css/html5demos.css" type="text/css" />
<script src="http://html5demos.com/js/h5utils.js"></script></head>
<body>
<section id="wrapper">
<header>
<h1>Web Socket</h1>
</header>
<style>
#chat { width: 97%; }
.them { font-weight: bold; }
.them:before { content: 'them '; color: #bbb; font-size: 14px; }
.you { font-style: italic; }
.you:before { content: 'you '; color: #bbb; font-size: 14px; font-weight: bold; }
#log {
overflow: auto;
max-height: 300px;
list-style: none;
padding: 0;
/* margin: 0;*/
}
#log li {
border-top: 1px solid #ccc;
margin: 0;
padding: 10px 0;
}
</style>
<article>
<form>
<input type="text" id="chat" placeholder="type and press enter to chat" />
</form>
<p id="status">Not connected</p>
<p>Users connected: <span id="connected">0</span></p>
<p>To test, open two windows with Web Socket support, type a message above and press return.</p>
<p>The server side code is available here: <a href="http://github.com/remy/html5demos/tree/master/server/">node-web-socket & server</a> (note that it runs on <a href="http://nodejs.org/" title="node.js">nodejs</a>)</p>
<ul id="log"></ul>
</article>
<script>
function openConnection() {
// uses global 'conn' object
if (conn.readyState === undefined || conn.readyState > 1) {
conn = new WebSocket('ws://node.remysharp.com:8001');
conn.onopen = function () {
state.className = 'success';
state.innerHTML = 'Socket open';
};
conn.onmessage = function (event) {
var message = JSON.parse(event.data);
if (typeof message == 'string') {
log.innerHTML = '<li class="them">' + message.replace(/[<>&]/g, function (m) { return entities[m]; }) + '</li>' + log.innerHTML;
} else {
connected.innerHTML = message;
}
};
conn.onclose = function (event) {
state.className = 'fail';
state.innerHTML = 'Socket closed';
};
}
}
var connected = document.getElementById('connected'),
log = document.getElementById('log'),
chat = document.getElementById('chat'),
form = chat.form,
conn = {},
state = document.getElementById('status'),
entities = {
'<' : '<',
'>' : '>',
'&' : '&'
};
if (window.WebSocket === undefined) {
state.innerHTML = 'Sockets not supported';
state.className = 'fail';
} else {
state.onclick = function () {
if (conn.readyState !== 1) {
conn.close();
setTimeout(function () {
openConnection();
}, 250);
}
};
addEvent(form, 'submit', function (event) {
event.preventDefault();
// if we're connected
if (conn.readyState === 1) {
conn.send(JSON.stringify(chat.value));
log.innerHTML = '<li class="you">' + chat.value.replace(/[<>&]/g, function (m) { return entities[m]; }) + '</li>' + log.innerHTML;
chat.value = '';
}
});
openConnection();
}
</script> <footer><a href="/">HTML5 demos</a>/<a id="built" href="http://twitter.com/rem">@rem built this</a>/<a href="#view-source">view source</a></footer>
</section>
<a href="http://github.com/remy/html5demos"><img style="position: absolute; top: 0; left: 0; border: 0;" src="http://s3.amazonaws.com/github/ribbons/forkme_left_darkblue_121621.png" alt="Fork me on GitHub" /></a>
</body>
</html>
462
I think you should wait for Channel API.
Channel API - The Channel API lets you build applications that can push content directly to your user’s browser (aka “Comet”). No more polling for updates!
this is already part of the SDK but does not work in production.
Here a video that show this new upcoming feature
Here a demo application with a multiplayer trivia-quiz
EDIT:
available with SDK 1.4.0
120
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
