Web Socket สำหรับคนที่เคยเขียนโปรแกรมแบบ Client-Server นั้น จะค่อนข้างคุ้นเคยกับคำว่า Server Socket ซึ่งเป็นการเปิด port ที่ Server เป็น TCP ซึ่ง client ก็ติดต่อโดยอ้างถึง ip ของ Server และ Port และทำการเชื่อมการติดต่อเพิ่มเริ่มส่งข้อมูล
Web Socket ถ้าจะอธิบายให้สั้นๆ และได้ใจความ Websocket เป็นเทคโนโลยีเพื่อใช้ การติดต่อสือสารระหว่าง Web server กับ Client แบบ Real Time Client ที่เป็น html5 + Javascript สามารถรับข้อมูลทางผั่ง Server มาแสดงผลได้ ผ่าน Protocol TCP/IP โดยไม่ต้อง Refresh หน้า เช่นเดียวกับ Ajax แต่ Websocket นั้นมีข้อดีกว่า Ajax คือ Websocket ไม่ต้องส่ง Request ใหม่ เพื่อส่งคำรองขอไปยัง server และ รอรับ respond จากทางฝั่ง Server ทำให้ Websocket ประหยัดทั้งเวลา และปริมาณข้อมูลที่ส่งไปมาระหว่าง web server กับ Client
โดยการทำงานของ Websocket มันจะรอรับ Message ทางฝั่ง web server อยู่ตลอดเวลา หลังจากที่ได้ส่งคำสั่ง ติดต่อ Websocket Server ไปแล้วในครั้งแรก และมันจะรอรับ Message จนกระทั้งจะสั่ง Close หรือหยุดการติดต่อ
ตัวอย่างโค้ด
var socket = new WebSocket(ws://websockets.org:8787/echo);
socket.onopen = function(evt) { console.log("Socket opened");};
socket.onclose = function(evt) {console.log("Socket closed");};
socket.onmessage = function(evt){console.log(evt.data);};
socket.onerror = function(evt) {console.log("Error: "+evt.data);};
socket.send("Hello World!");
จากโค้ดเป็นการสร้าง WebSocket เพื่อไว้สำหรับคุยกับ echo server และมีการกำหนด callback function เมื่อเกิดเหตุการณ์ต่างๆ เช่น opened, closed, receive a message, หรือแม้กระทั่งเมื่อเกิด error ขึ้น จากนั้นเราก็ส่งค่า Hello World! ไปยัง server และให้ browser แสดงคำว่า Hello World จากการรับค่ากลับจาก server ครับ
ซึ่ง Server ของ WebSocket หากลองค้นหาดูแล้ว จะพบว่ามีการ implement เป็นหลายภาษาอย่างแพร่หลายแล้วครับ หาหยิบจับมาใช้ได้เช่น
ตัวอย่างโค้ด HTML + Websocket
<!DOCTYPE html>
<meta charset="utf-8" />
<title>WebSocket Test By Mindphp.com</title>
<script language="javascript" type="text/javascript">
var wsUri = "ws://echo.websocket.org/";
var output;
function init()
{
output = document.getElementById("output");
testWebSocket();
}
function testWebSocket()
{
websocket = new WebSocket(wsUri);
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)
{
writeToScreen("CONNECTED");
doSend("WebSocket rocks");
}
function onClose(evt)
{
writeToScreen("DISCONNECTED");
}
function onMessage(evt)
{
alert(evt);
writeToScreen('<span style="color: blue;">RESPONSE: ' + evt.data+'</span>');
websocket.close();
}
function onError(evt)
{
writeToScreen('<span style="color: red;">ERROR:</span> ' + evt.data);
}
function doSend(message)
{
writeToScreen("SENT: " + message);
websocket.send(message);
}
function writeToScreen(message)
{
var pre = document.createElement("p");
pre.style.wordWrap = "break-word";
pre.innerHTML = message;
output.appendChild(pre);
}
window.addEventListener("load", init, false);
</script>
<h2>WebSocket Test</h2>
<input id="text" name="text" type="text" size="36">
<label>
<input type="submit" name="button" id="button" value=" Send " onClick=" doSend(document.getElementById('text').value);">
</label>
<div id="output"></div>
</html>
รับทําเว็บไซต์ 
แลกลิงค์ 
