ให้เรตสมาชิก: 4 / 5

ดาวใช้งานดาวใช้งานดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งาน
 
Websocket ใน HTML 5 เทคโนโลยี ติดต่อเร็ว กว่า Ajax ไม่ต้องรีเฟรชหน้า
Websocket ใน HTML 5 เทคโนโลยี ติดต่อเร็ว กว่า Ajax ไม่ต้องรีเฟรชหน้า

Websocket คือ ถ้าจะอธิบายให้สั้นๆ และได้ใจความ 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 หรือหยุดการติดต่
ลองดูตัวอย่างโค้ด 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> 

เรียกน้ำย่อยวันนี้แค่นี้ก่อน วันหลังจะเอาความรู้เรื่อง เทคโนโลยี ตัวนี้มาลงอีกครับ พูดคุยกันได้ที่เว็บบอร์ด Pogramming - PHP

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
MOD_MTB_NEWS_RECENT
ท่า "นอน" โปรแกรมเมอร์ และอาชีพต่างๆ
โดย Before Dong จ 11 ก.ย. 2017 10:24 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
140
จ 11 ก.ย. 2017 10:24 am โดย Before Dong
ทำรูปภาพกิจกรรมแบบนี้ยังไงคะ
โดย mmmook จ 11 ก.ย. 2017 10:18 am บอร์ด Joomla Development
0
78
จ 11 ก.ย. 2017 10:18 am โดย mmmook
สอบถามการทำ joomla รูปแบบนี้ค่ะ
โดย mmmook จ 11 ก.ย. 2017 8:50 am บอร์ด Joomla Development
1
96
จ 11 ก.ย. 2017 8:50 am โดย tsukasaz
เก็บรูปใน onedrive
โดย บุคคลทั่วไป ส 09 ก.ย. 2017 2:02 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
151
ส 09 ก.ย. 2017 2:02 pm โดย บุคคลทั่วไป
วิธีติดตั้ง Firefox 33 บนระบบปฏิบัติการ Ubuntu
โดย natnicha001 ส 09 ก.ย. 2017 10:54 am บอร์ด Linux - Web Server
0
87
ส 09 ก.ย. 2017 10:54 am โดย natnicha001
อยากรู้ว่า TinyMCE ไฟล์ css เอาใส่ไว้ที่ไหนถึงเรียกใช้งานได้ Joomla
โดย Before Dong ส 09 ก.ย. 2017 10:33 am บอร์ด Joomla Development
0
58
ส 09 ก.ย. 2017 10:33 am โดย Before Dong
สติถิ การใช้งานกูลเกิล ใช้ทำอะไรการเข้า Google การใช้งาน
โดย Before Dong ส 09 ก.ย. 2017 10:23 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
100
ส 09 ก.ย. 2017 10:23 am โดย Before Dong
c# Crystal Reports 2008 v12 XI Business objects
โดย jataz2 ศ 08 ก.ย. 2017 1:17 pm บอร์ด Programming - C/C++ & java & Python
0
70
ศ 08 ก.ย. 2017 1:17 pm โดย jataz2
ป้องกัน Server Linux ติด Backlist ด้วย Linux Malware Detect (LMD) ใช้ได้ทั้ง Ubuntu และ CentOS
โดย mindphp ศ 08 ก.ย. 2017 6:15 am บอร์ด Linux - Web Server
3
109
ศ 08 ก.ย. 2017 6:15 am โดย mindphp
ถึงเวลาโปรแกรมเมอร์รันโค้ดครั้งแรก
โดย mindphp ศ 08 ก.ย. 2017 1:39 am บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
2
169
ศ 08 ก.ย. 2017 1:39 am โดย ANNA200
อยากให้ Featured Article เป็นแบบในรูปทำยังไงหรอครับ
โดย Before Dong พฤ 07 ก.ย. 2017 5:11 pm บอร์ด Joomla Development
2
102
พฤ 07 ก.ย. 2017 5:11 pm โดย Before Dong
แนะนำแอพพลิเคชั่น Viber (ไวเบอร์)
โดย natnicha001 พฤ 07 ก.ย. 2017 2:36 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
60
พฤ 07 ก.ย. 2017 2:36 pm โดย natnicha001
อยากทราบวิธี เพิ่ม Insert Template ในบทความ ครับ
โดย Before Dong พฤ 07 ก.ย. 2017 2:20 pm บอร์ด Joomla Development
1
64
พฤ 07 ก.ย. 2017 2:20 pm โดย Before Dong
วิธีการเช่า Adobe Cloud (อะโดบี เคลาด)
โดย natnicha001 พฤ 07 ก.ย. 2017 1:43 pm บอร์ด Graphic design
0
73
พฤ 07 ก.ย. 2017 1:43 pm โดย natnicha001
มีปัญหาตรงurlเว็บครับ จุมล่า
โดย giantseed พฤ 07 ก.ย. 2017 11:13 am บอร์ด Joomla Development
2
58
พฤ 07 ก.ย. 2017 11:13 am โดย giantseed
อยากทราบวิธีติดตั้ง selenium บนระบบปฏิบัติการ ๊Ubuntu
โดย natnicha001 พฤ 07 ก.ย. 2017 11:05 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
7
162
พฤ 07 ก.ย. 2017 11:05 am โดย natnicha001
มีปัญหาตรงurlเว็บครับ จุมล่า
โดย giantseed พฤ 07 ก.ย. 2017 10:59 am บอร์ด Joomla Development
4
80
พฤ 07 ก.ย. 2017 10:59 am โดย tsukasaz
เข้าไม่ได้จำรหัสไม่ได้บอกที่ส่งมาเบอร์086416
โดย Samran Konkaew พฤ 07 ก.ย. 2017 8:30 am บอร์ด Programming - PHP
1
78
พฤ 07 ก.ย. 2017 8:30 am โดย mindphp
ไฟล์รูปภาพไม่ขึ้นเวลาอัพโหลด
โดย บุคคลทั่วไป พฤ 07 ก.ย. 2017 12:33 am บอร์ด Programming - PHP
1
85
พฤ 07 ก.ย. 2017 12:33 am โดย บุคคลทั่วไป
แนะนำแอพพลิเคชั่น Skyscanner (สคาย สแกนเนอร์)
โดย natnicha001 พ 06 ก.ย. 2017 1:09 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
0
50
พ 06 ก.ย. 2017 1:09 pm โดย natnicha001