Tuesday, February 7, 2017

Web Communication/Message

MessageEvent: This interface is for message events used in WebSocket, WebRTC RTCDataChannel, server-sent events, cross-document messaging, channel messaging, and broadcast channels.

1. EventSource: This interface is used to receive server-sent events. It connects to a server over HTTP and receives events in text/event-stream format without closing the connection.

2. WebSocket: This interface is used to enable Web applications to maintain bidirectional communications with server-side processes

3. window.postMessage(message, targetOrigin, transfer): This method is used to post message to the given window.
  • Message can be structured objects, e.g. nested objects and arrays, can contain JavaScript values (strings, numbers, Date objects, etc), and can contain certain data objects such as File Blob, FileList, and ArrayBuffer objects.
  • If the origin of the target window doesn't match the given origin, the message is discarded, to avoid information leakage. To send the message to the target regardless of origin, set the target origin to "*". To restrict the message to same-origin targets only, without needing to explicitly state the origin, set the target origin to "/".
  • Objects listed in transfer are transferred, not just cloned, meaning that they are no longer usable on the sending side.
4. MessageChannel: The interface of the Channel Messaging API allows us to create a new message channel and send data through it via its two MessagePort properties. This will enable independent pieces of code (e.g. running in different browsing contexts) to communicate directly.
  • MessagePort: MessagePort objects are transferable objects, Each channel has two message ports. Data sent through one port is received by the other port, and vice versa.
5. BroadcastChannel: This interface represents a named channel that any browsing context of a given origin can subscribe to. It allows communication between different documents (in different windows, tabs, frames or iframes) of the same origin.

Detect Chrome incognito mode

It is a best practice to NOT check browser versions to do feature support, instead, use feature detection. When detecting Chrome incognito mode, using feature detection might be a solution in Javascript. Use storage API is not a solution due to cross browser implementation difference regarding private window browsing.

Here is an example of using File API.


function main() {
  var fs = window.RequestFileSystem || window.webkitRequestFileSystem;
  if (!fs) {
    result.textContent = "check failed?";
  fs(window.TEMPORARY, 100, function(fs) {
    result.textContent = "it does not seem like you are in incognito mode";
  }, function(err) {
    result.textContent = "it seems like you are in incognito mode";

Too many protocols

Application Layer
RTP: Real-time Transport Protocol (RFC 3550)
RTCP: RTP Control Protocol
SIP: Session Initiation Protocol
SDP: Session Description Protocol
RTSP: Real Time Streaming Protocol
SRTP: Secure Real-time Transport Protocol

Transport Layer
DCCP: Datagram Congestion Control Protocol
SCTP, Stream Control Transmission Protocol
TCP: Transmission Control Protocol
UDP: User Datagram Protocol
RDP: Reliable Datagram Protocol

Internet Layer
IP: Internet Protocol
IPSec: Internet Protocol Security
ICMP: Internet Control Message Protocol

Link Layer
IEEE 802