WebSockets - Giao tiếp với máy chủ
Phần lớn Web được xây dựng dựa trên mô hình yêu cầu / phản hồi của HTTP. Khách hàng tải lên một trang web và sau đó không có gì xảy ra cho đến khi người dùng nhấp vào trang tiếp theo. Khoảng năm 2005, AJAX bắt đầu làm cho web trở nên năng động hơn. Tuy nhiên, tất cả giao tiếp HTTP được điều khiển bởi máy khách, yêu cầu tương tác của người dùng hoặc thăm dò định kỳ để tải dữ liệu mới từ máy chủ.
Các công nghệ cho phép máy chủ gửi dữ liệu đến máy khách ngay khi nó biết rằng dữ liệu mới có sẵn đã xuất hiện từ khá lâu. Họ đi bằng những cái tên như"Push" hoặc là “Comet”.
Với long polling, máy khách sẽ mở một kết nối HTTP đến máy chủ, kết nối này sẽ giữ cho nó mở cho đến khi gửi phản hồi. Bất cứ khi nào máy chủ thực sự có dữ liệu mới, nó sẽ gửi phản hồi. Bỏ phiếu dài và các kỹ thuật khác hoạt động khá tốt. Tuy nhiên, tất cả những điều này đều có chung một vấn đề, chúng mang theo chi phí của HTTP, điều này không phù hợp với các ứng dụng có độ trễ thấp. Ví dụ: trò chơi bắn súng nhiều người chơi trong trình duyệt hoặc bất kỳ trò chơi trực tuyến nào khác có thành phần thời gian thực.
Đưa Sockets lên web
Đặc tả Web Socket xác định một API thiết lập các kết nối "socket" giữa trình duyệt web và máy chủ. Theo thuật ngữ của giáo dân, có một kết nối liên tục giữa máy khách và máy chủ và cả hai bên có thể bắt đầu gửi dữ liệu bất kỳ lúc nào.
Kết nối ổ cắm web có thể được mở đơn giản bằng cách sử dụng một hàm tạo -
var connection = new WebSocket('ws://html5rocks.websocket.org/echo', ['soap', 'xmpp']);wslà lược đồ URL mới cho các kết nối WebSocket. Ngoài ra còn cówss, đối với kết nối WebSocket an toàn theo cùng một cách https được sử dụng cho các kết nối HTTP an toàn.
Việc gắn một số trình xử lý sự kiện ngay lập tức vào kết nối cho phép bạn biết khi nào kết nối được mở, nhận được tin nhắn đến hoặc có lỗi.
Đối số thứ hai chấp nhận tùy chọn subprotocols. Nó có thể là một chuỗi hoặc một mảng chuỗi. Mỗi chuỗi phải đại diện cho mộtsubprotocol tên và máy chủ chỉ chấp nhận một trong các subprotocolstrong mảng. Đã được chấp nhậnsubprotocol có thể được xác định bằng cách truy cập thuộc tính giao thức của đối tượng WebSocket.
// When the connection is open, send some data to the server
connection.onopen = function () {
connection.send('Ping'); // Send the message 'Ping' to the server
};
// Log errors
connection.onerror = function (error) {
console.log('WebSocket Error ' + error);
};
// Log messages from the server
connection.onmessage = function (e) {
console.log('Server: ' + e.data);
};Giao tiếp với Máy chủ
Ngay sau khi chúng tôi có kết nối đến máy chủ (khi sự kiện mở được kích hoạt), chúng tôi có thể bắt đầu gửi dữ liệu đến máy chủ bằng phương thức gửi (tin nhắn của bạn) trên đối tượng kết nối. Nó từng chỉ hỗ trợ các chuỗi, nhưng trong đặc điểm kỹ thuật mới nhất, giờ đây nó cũng có thể gửi các tin nhắn nhị phân. Để gửi dữ liệu nhị phân, đối tượng Blob hoặc ArrayBuffer được sử dụng.
// Sending String
connection.send('your message');
// Sending canvas ImageData as ArrayBuffer
var img = canvas_context.getImageData(0, 0, 400, 320);
var binary = new Uint8Array(img.data.length);
for (var i = 0; i < img.data.length; i++) {
binary[i] = img.data[i];
}
connection.send(binary.buffer);
// Sending file as Blob
var file = document.querySelector('input[type = "file"]').files[0];
connection.send(file);Tương tự, máy chủ có thể gửi tin nhắn cho chúng tôi bất cứ lúc nào. Bất cứ khi nào điều này xảy ra, cuộc gọi lại nội dung sẽ kích hoạt. Lệnh gọi lại nhận một đối tượng sự kiện và thông báo thực có thể truy cập được thông qua thuộc datatính.
WebSocket cũng có thể nhận tin nhắn nhị phân trong thông số kỹ thuật mới nhất. Khung nhị phân có thể được nhận ở định dạng Blob hoặc ArrayBuffer. Để chỉ định định dạng của tệp nhị phân đã nhận, hãy đặt thuộc tính binaryType của đối tượng WebSocket thành 'blob' hoặc 'arraybuffer'. Định dạng mặc định là 'blob'.
// Setting binaryType to accept received binary as either 'blob' or 'arraybuffer'
connection.binaryType = 'arraybuffer';
connection.onmessage = function(e) {
console.log(e.data.byteLength); // ArrayBuffer object if binary
};Một tính năng mới được bổ sung khác của WebSocket là các tiện ích mở rộng. Sử dụng tiện ích mở rộng, có thể gửi các khung hình được nén, ghép kênh, v.v.
// Determining accepted extensions
console.log(connection.extensions);Giao tiếp đa nguồn gốc
Là một giao thức hiện đại, giao tiếp đa nguồn được đưa vào WebSocket. WebSocket cho phép giao tiếp giữa các bên trên bất kỳ miền nào. Máy chủ quyết định có cung cấp dịch vụ của mình cho tất cả các máy khách hay chỉ những máy khách nằm trên một tập hợp các miền được xác định rõ.
Máy chủ proxy
Mỗi công nghệ mới đều đi kèm với một loạt vấn đề mới. Trong trường hợp của WebSocket, đó là khả năng tương thích với các máy chủ proxy, trung gian kết nối HTTP trong hầu hết các mạng công ty. Giao thức WebSocket sử dụng hệ thống nâng cấp HTTP (thường được sử dụng cho HTTP / SSL) để "nâng cấp" kết nối HTTP thành kết nối WebSocket. Một số máy chủ proxy không thích điều này và sẽ ngắt kết nối. Do đó, ngay cả khi một ứng dụng khách nhất định sử dụng giao thức WebSocket, vẫn có thể không thiết lập được kết nối. Điều này làm cho phần tiếp theo thậm chí còn quan trọng hơn :)
Phía máy chủ
Sử dụng WebSocket tạo ra một kiểu sử dụng hoàn toàn mới cho các ứng dụng phía máy chủ. Trong khi các ngăn xếp máy chủ truyền thống như LAMP được thiết kế theo chu trình yêu cầu / phản hồi HTTP, chúng thường không xử lý tốt với một số lượng lớn các kết nối WebSocket đang mở. Giữ một số lượng lớn các kết nối mở cùng một lúc đòi hỏi một kiến trúc nhận được sự đồng thời cao với chi phí hiệu suất thấp.