1)HTTP is not easy to implement in real time:

1, HTTP protocol is stateless, the server will only respond to requests from the client, but there is no continuous connection between it and the client.

2. It is very easy to capture events occurring in the browser (such as a user clicking on a box) that can easily generate data interactions with the server (such as Ajax). However, the reverse is not possible: an event occurs on the server side, and the server cannot actively inform its clients of this event in real time. Information about events is passed from the server to the client only when the client queries the current state of the server.

2) Previous real-time application solutions

1, long polling: the client will send a request to the server every very short time to see if there is a new message. As long as the polling speed is fast enough, such as 1 second, it can give the impression that the interaction is in real time. This is a helpless move, in fact, the server and client both caused a lot of performance waste.

2. Long connections: The client requests only once, but the server holds the connection and does not return a result (imagine the browser turning around without res.end()). When the server has new data, it sends it back, and when it has new data, it sends it back, and it stays suspended. This approach also results in significant performance waste.

3)WebSocket protocol can make browser and server full duplex real-time communication, mutual, the server can also take the initiative to notify the client.

The principle of WebSocket is very simple: use HTTP request to generate handshake, HTTP header contains WebSocket protocol request, so after the handshake, the two transfer to TCP protocol for communication (QQ protocol). Now between the browser and the server, is QQ and QQ server relationship.

So WebSocket protocol, need browser support, more need server support.

  • Browsers that support WebSocket include Chrome 4, firefox 4, Internet explorer 10, and Safari5
  • WebSocket supports Node 0, Apache 7.0.2, and Nginx1.3

4) socket’s official website

website

5) Use webSocket in Node

NPM install socket.io

var http = require('http); var fs = require('fs'); var server = http.createServer((req,res)=>{ if(req.url == '/'){ fs.readFile('./index.html',(err,data)=>{ if(err) throw err; res.writeHead(200,{'Content-Type':'text/html; charset=utf8'}); Res.end (data)})}}) var IO = require('socket. IO ')(server) IO. On ('connection',(socket)=>{// Monitor connection // monitor socket Receive MSG socket.on('event',(MSG)=>{console.log(MSG) //=> print test foreground to send // return an event to front-end socket.emit('fanhui',' this is returned from background ')})}) server.listen(5000)Copy the code

When visiting http://localhost:5000/socket.io/socket.io.js you will find that returns a js code This is the hide

//index.html // reference <script SRC ="/socket.io/socket.io.js"></script> <script> var socket = IO (); On ('fanhui',function(MSG){console.log(MSG) //=> print this is returned from the background})  </script>Copy the code

6) Chat room production using socket broadcast

The principle is that every time an emit event is sent by one person in the background (Node), everyone can receive it

//nodejs IO. On ('connection',(socket)=>{socket.on(' receive foreground event ',(MSG)=>{// If any foreground event is triggered, IO. Emit (' event returned to foreground ', MSG)})}Copy the code