ให้เรตสมาชิก: 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
restart Odoo Server และ สั่งแสดง Log ในคำสั่งเดียว
โดย mindphp ศ 18 ส.ค. 2017 3:32 am บอร์ด Odoo
0
2
ศ 18 ส.ค. 2017 3:32 am โดย mindphp
Joomla ออกเวอร์ชั่น 3.7.5 Fix Bug ติดตั้ง Joomla ไม่ได้เมือใช้ remote ฐานข้อมูล
โดย mindphp ศ 18 ส.ค. 2017 3:23 am บอร์ด PHP News
1
31
ศ 18 ส.ค. 2017 3:23 am โดย toonytoony2004
สอบถามวิธีเรียกใช้งาน Jcrop.js
โดย Ik Kat พฤ 17 ส.ค. 2017 5:30 pm บอร์ด JavaScript & Jquery Ajax
3
31
พฤ 17 ส.ค. 2017 5:30 pm โดย thatsawan
คู่มือการใช้งานโปรแกรม OpenShot Video Editor โปรแกรมตัดต่อ VDO เบื้องต้น
โดย meeieis พฤ 17 ส.ค. 2017 4:01 pm บอร์ด Graphic design
0
31
พฤ 17 ส.ค. 2017 4:01 pm โดย meeieis
รู้จักคำสั่ง page_source ใน selenium webdriver
โดย บัวบุญ จันทะโคตร พฤ 17 ส.ค. 2017 3:08 pm บอร์ด Python Knowledge
0
17
พฤ 17 ส.ค. 2017 3:08 pm โดย บัวบุญ จันทะโคตร
เปลี่ยน ธีมแล้วโฆษณาไม่ขึ้นครับ
โดย Dia Ry พ 16 ส.ค. 2017 9:02 pm บอร์ด Programming - PHP
2
27
พ 16 ส.ค. 2017 9:02 pm โดย Dia Ry
เขียน php ติดต่อ dbf
โดย บุคคลทั่วไป พ 16 ส.ค. 2017 4:46 pm บอร์ด Programming - PHP
4
57
พ 16 ส.ค. 2017 4:46 pm โดย บุคคลทั่วไป
สอบถามวิธีการเรียกใช้งาน JavaScript
โดย Ik Kat พ 16 ส.ค. 2017 4:28 pm บอร์ด JavaScript & Jquery Ajax
1
40
พ 16 ส.ค. 2017 4:28 pm โดย บัวบุญ จันทะโคตร
ความหมายของ Error Code บน Browser แบบที่เจอกันบ่อยๆ
โดย nuattawoot พ 16 ส.ค. 2017 2:20 pm บอร์ด HTML CSS
0
23
พ 16 ส.ค. 2017 2:20 pm โดย nuattawoot
อยากรู้วิธีทำ Menu Drop Down ใน Joomla ครับ
โดย Before Dong พ 16 ส.ค. 2017 10:12 am บอร์ด Joomla Development
2
38
พ 16 ส.ค. 2017 10:12 am โดย Before Dong
สร้าง regex ค้นหาคำใน css แล้วเกิด error จะต้องแก้ไขยังไงครับ
โดย บัวบุญ จันทะโคตร อ 15 ส.ค. 2017 11:39 am บอร์ด Programming - C/C++ & java & Python
1
46
อ 15 ส.ค. 2017 11:39 am โดย P'Eak
สร้างงานใน python เเล้วส่งค่าไปเรียก methon เเล้ว error
โดย thatsawan จ 14 ส.ค. 2017 7:48 pm บอร์ด Odoo
5
8
จ 14 ส.ค. 2017 7:48 pm โดย mindphp
ต้องการจัดข้อมูลใน Python ให้มันเพิ่ม keyเเละก็แบ่งข้อมูลออกมา
โดย thatsawan อ 13 ส.ค. 2017 11:39 pm บอร์ด Programming - C/C++ & java & Python
2
55
อ 13 ส.ค. 2017 11:39 pm โดย mindphp
ทำไมเข้าไม่ได้
โดย Sakon Suksi อ 13 ส.ค. 2017 10:31 pm บอร์ด Programming - PHP
0
24
อ 13 ส.ค. 2017 10:31 pm โดย Sakon Suksi
เเนะนำการใช้งาน Structured Data Markup Helper โปรแกรมช่วยเสริม search engine
โดย thatsawan อ 13 ส.ค. 2017 3:38 pm บอร์ด PHP Knowledge
0
31
อ 13 ส.ค. 2017 3:38 pm โดย thatsawan
Google Rich Snippet คืออะไร มีผลกับ Search engine อย่างไร
โดย thatsawan อ 13 ส.ค. 2017 3:21 pm บอร์ด PHP Knowledge
1
40
อ 13 ส.ค. 2017 3:21 pm โดย mindphp
ขอคำแนะนำการหัดเขียนโปรแกรมครับ
โดย toonytoony2004 อ 13 ส.ค. 2017 2:54 pm บอร์ด พูดคุยเรื่องทั่วไป จับฉ่าย
3
65
อ 13 ส.ค. 2017 2:54 pm โดย toonytoony2004
รูปแบบการหาค่าช้ำใน list แบบ array
โดย nuattawoot ศ 11 ส.ค. 2017 3:21 pm บอร์ด Programming - C/C++ & java & Python
0
39
ศ 11 ส.ค. 2017 3:21 pm โดย nuattawoot
อยากทราบว่า regular expression urllib คืออะไร ทำงานยังไงครับ
โดย บัวบุญ จันทะโคตร ศ 11 ส.ค. 2017 3:17 pm บอร์ด Programming - C/C++ & java & Python
1
35
ศ 11 ส.ค. 2017 3:17 pm โดย P'Eak
อยากทราบวิธีการแก้ไข Error fullpage screenshot ใน selenium จะต้องแก้ไขยังไงครับ
โดย บัวบุญ จันทะโคตร ศ 11 ส.ค. 2017 11:01 am บอร์ด Programming - C/C++ & java & Python
0
40
ศ 11 ส.ค. 2017 11:01 am โดย บัวบุญ จันทะโคตร