ความคิดเห็น: โดยทั่วไปข้อมูลผู้ใช้ที่ลงทะเบียนบนหน้าเว็บแบบดั้งเดิมจะถูกส่งไปยังหน้าผ่านโพสต์หรือ AJAX หลังจากป้อน HTML5 เรามีวิธีอื่นในการโต้ตอบกับข้อมูลผ่าน WebSocket เราจะแนะนำรายละเอียดต่อไป เพื่อนที่จำเป็นต้องรู้สามารถอ้างถึงได้
โดยทั่วไปข้อมูลผู้ใช้ที่ลงทะเบียนในหน้าเว็บแบบดั้งเดิมจะถูกส่งไปยังหน้าผ่านโพสต์หรือ AJAX หลังจาก HTML5 เรามีวิธีอื่นในการโต้ตอบกับข้อมูลผ่าน WebSocket WebSocket มีความยืดหยุ่นที่หน้าเว็บแบบดั้งเดิมไม่มีในการโต้ตอบข้อมูล หลังจากสร้างการเชื่อมต่อที่ยาวนานผ่าน WebSocket เซิร์ฟเวอร์สามารถส่งข้อมูลไปยังไคลเอนต์ได้โดยตรง ไม่จำเป็นต้องนำข้อมูลส่วนหัว HTTP จำนวนมากสำหรับการโต้ตอบข้อมูลแต่ละครั้ง โปรโตคอล WebSocket นั้นรองรับข้อความและสตรีมข้อมูลสองรูปแบบ มันง่ายมากที่จะโต้ตอบกับ JavaScript ผ่านข้อความ JSON การสื่อสารระหว่าง JSON และ WebSocket นั้นสะดวกมาก แต่เพื่อให้บรรลุความสะดวกนี้เรายังต้องทำบรรจุภัณฑ์ง่ายๆ โชคดีที่ส่วนประกอบ JSON ที่มีอยู่บนแพลตฟอร์มต่าง ๆ ค่อนข้างเติบโต โดยการวิเคราะห์วิธีการที่สอดคล้องกันของการแมปข้อมูล JSON ไปยังเซิร์ฟเวอร์มันจะดำเนินการ
ต่อไปนี้คือการลงทะเบียนผู้ใช้อย่างง่ายเพื่อสะท้อนกระบวนการของ HTML5 ที่มีปฏิสัมพันธ์กับ JOSN และ WebSocket เนื่องจากมันถูกห่อหุ้มจึงสะดวกในการใช้งาน
html:ฟังก์ชั่นนั้นง่ายมากและข้อมูลการลงทะเบียนจะถูกส่งหลังจากเชื่อมต่อกับบริการ WebSocket แน่นอนว่าเพื่อให้มีความยืดหยุ่นมากขึ้นเราจะเปิดรูปแบบการเชื่อมต่ออีกครั้งเมื่อตรวจสอบการเชื่อมต่อจะปิด รหัส JS เฉพาะมีดังนี้:
ฟังก์ชั่นเชื่อมต่อ () {
channel = new tcpChannel ();
channel.connected = function (evt) {
$ ('#dlgconnect'). กล่องโต้ตอบ ('ปิด');
-
channel.disposed = function (evt) {
$ ('#dlgconnect'). กล่องโต้ตอบ ('เปิด');
-
channel.error = function (evt) {
การแจ้งเตือน (EVT);
-
channel.connect ($ ('#txthost'). val ());
-
รหัสมีความกระชับมากหรือไม่? เหตุผลหลักคือ TCPChannel ถูกห่อหุ้มบนพื้นฐานของ WebSocket สามารถดาวน์โหลดรหัสโดยละเอียดและเข้าใจได้ หลังจากการเชื่อมต่อสำเร็จคุณจะป้อนแบบฟอร์มลงทะเบียน
หลังจากกรอกข้อมูลการลงทะเบียนบางอย่างให้คลิกลงทะเบียนเพื่อส่งข้อมูลไปยังเซิร์ฟเวอร์ผ่าน WebSocket รหัส JS ที่ส่งที่เกี่ยวข้องมีดังนี้:
var invokeregister = {url: 'handler.onregister', พารามิเตอร์: {ชื่อผู้ใช้: '', อีเมล: '', รหัสผ่าน: ''}};
ฟังก์ชั่นลงทะเบียน () {
$ ('#frmregister'). แบบฟอร์ม ('ส่ง', {
onsubmit: function () {
var isvalid = $ (this) .form ('ตรวจสอบ');
ถ้า (isvalid) {
Invokeregister.parameters = $ ('#frmregister'). serializeObject ();
channel.send (Invokeregister, function (ผลลัพธ์) {
การแจ้งเตือน (result.data);
-
-
กลับเท็จ;
-
-
-
เมื่อข้อมูลการตรวจสอบสำเร็จจะสามารถส่งวัตถุคำอธิบายการโทรวิธีผ่าน TCPChannel URL คือวิธีการคลาสที่ระบุในการเรียกและพารามิเตอร์เป็นพารามิเตอร์ของวิธีการและพารามิเตอร์อาจเป็นประเภทโครงสร้างที่ซับซ้อน พารามิเตอร์ที่สองคือการประมวลผลการโทรกลับ
C#บริการขึ้นอยู่กับการประมวลผลส่วนขยายของด้วงดังนั้นรหัสจึงง่ายมาก รหัสวิธีตรรกะสำหรับการลงทะเบียนข้างต้นมีดังนี้:
ผู้ดูแลชั้นเรียนสาธารณะ
-
สตริงสาธารณะ onregister (ชื่อผู้ใช้สตริง, อีเมลสตริง, รหัสผ่านสตริง)
-
Console.WriteLine (ชื่อผู้ใช้);
Console.WriteLine (อีเมล);
Console.WriteLine (รหัสผ่าน);
คืนชื่อผู้ใช้;
-
-
วิธีการนี้จำเป็นต้องกำหนดพารามิเตอร์ที่เกี่ยวข้องเท่านั้น คอนโทรลเลอร์ขยายข้อความของ Beetle จะวิเคราะห์ข้อมูล JSON ที่ส่งโดย JS โดยอัตโนมัติสำหรับการวิเคราะห์และเชื่อมโยงกับวิธีการที่เกี่ยวข้องสำหรับการดำเนินการ สามารถรับรหัสโดยละเอียดของคอนโทรลเลอร์ผ่านการดาวน์โหลด หลังจากตรรกะเสร็จสิ้นเราจะต้องเปิดบริการ WebSocket ที่เกี่ยวข้องเท่านั้น
-
โมฆะคงที่หลัก (สตริง [] args)
-
Beetle.Controllers.Controller.Register (ใหม่ Handler ());
tcputils.setup ("ด้วง");
โปรแกรมเซิร์ฟเวอร์ = โปรแกรมใหม่ ();
Server.Open (8088);
Console.WriteLine ("WebSocket Start@8088");
System.threading.thread.sleep (-1);
-
Void Onerror ที่ได้รับการป้องกัน (ผู้ส่งวัตถุ, ChannelerRoreVentArgs E)
-
base.onerror (ผู้ส่ง, e);
Console.WriteLine (E.Exception.message);
-
ได้รับการป้องกันการแทนที่โมฆะ onconnected (ผู้ส่งวัตถุ, ChannelEventArgs E)
-
base.onconnected (ผู้ส่ง, e);
Console.WriteLine ("{0} เชื่อมต่อ", e.channel.endpoint);
-
ได้รับการป้องกันการแทนที่โมฆะ ondisposed (ผู้ส่งวัตถุ, channeldisposedeventargs e)
-
base.ondisposed (ผู้ส่ง, e);
Console.WriteLine ("{0} กระจาย", e.channel.endpoint);
-
-
การโต้ตอบและการประมวลผลข้อความ WebSocket Object ประเภทนี้ตาม HTML5 เสร็จสมบูรณ์และจำเป็นต้องใช้รหัสจำนวนเล็กน้อยเพื่อใช้การประมวลผลข้อมูลปฏิสัมพันธ์ของ JS และบริการ เพื่อให้ได้ฟังก์ชั่นการโต้ตอบที่สะดวกนี้ไม่สามารถบันทึกการห่อหุ้มต่อไปนี้ได้ การวิเคราะห์โปรโตคอล WebSocket, การประมวลผลวัตถุ JSON และการกระจายการควบคุมข้อความ หากคุณต้องการทราบรายละเอียดที่เกี่ยวข้องคุณสามารถดาวน์โหลดซอร์สโค้ดเพื่อดูได้websocket.server.rar (641.79 kb)