實(shí)現(xiàn)方案
采用目前比較成熟的WebSocket技術(shù),WebSocket協(xié)議為創(chuàng)建客戶端和服務(wù)器端需要實(shí)時(shí)雙向通訊的webapp提供了一個(gè)選擇。其為HTML5的一部分,WebSocket相較于原來開發(fā)這類app的方法來說,其能使開發(fā)更加地簡單。大部分現(xiàn)在的瀏覽器都支持WebSocket,比如Firefox,IE,Chrome,Safari,Opera,并且越來越多的服務(wù)器框架現(xiàn)在也同樣支持WebSocket。
WebSocket集群
在實(shí)際的生產(chǎn)環(huán)境中,要求多個(gè)WebSocket服務(wù)器必須具有高性能和高可用,那么WebSocket協(xié)議就需要一個(gè)負(fù)載均衡層,NGINX從1.3開始支持WebSocket,其可以作為一個(gè)反向代理和為WebSocket程序做負(fù)載均衡。
Nginx配置
注:看官方文檔說 Nginx 在 1.3 以后的版本才支持 websocket 反向代理,所以要想使用支持 websocket 的功能,必須升級(jí)到 1.3 以后的版本
NGINX通過允許一個(gè)在客戶端和后端服務(wù)器之間建立的隧道來支持WebSocket。為了NGINX發(fā)送來至于客戶端Upgrade請(qǐng)求到后端服務(wù)器,Upgrade和Connection頭部必須被設(shè)置明確。
代碼實(shí)例:
upstream wsbackend { server 127.0.0.1:8080; server 127.0.0.1:8081;}server { listen 80; server_name ws.52itstyle.com; location / { proxy_pass http://wsbackend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; }}
前端配置:
$(function(){ socket.init();});//Nginx反向代理實(shí)現(xiàn)websocketvar basePath = "ws://ws.52itstyle.com//acts_competition/";socket = { webSocket : "", init : function() { if ('WebSocket' in window) { webSocket = new WebSocket(basePath+'webSocketServer'); } else if ('MozWebSocket' in window) { webSocket = new MozWebSocket(basePath+"webSocketServer"); } else { webSocket = new SockJS(basePath+"sockjs/webSocketServer"); } webSocket.onerror = function(event) { //alert("websockt連接發(fā)生錯(cuò)誤,請(qǐng)刷新頁面重試!") }; webSocket.onopen = function(event) { }; webSocket.onmessage = function(event) { }; }, sendData : function(data) { webSocket.send(data); },}
最后,重啟下Nginx即可。
反向代理服務(wù)器在支持WebSocket時(shí)面臨的挑戰(zhàn)
總結(jié)
以上就是這篇文章的全部內(nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,如果有疑問大家可以留言交流,謝謝大家對(duì)VEVB武林網(wǎng)的支持。
新聞熱點(diǎn)
疑難解答
圖片精選