From a36c1048739ee1772ab1fc46ae5f82b0918c0f29 Mon Sep 17 00:00:00 2001 From: Bryan Nielsen Date: Thu, 28 Feb 2019 10:12:43 -0700 Subject: [PATCH 1/4] Added setProtocols() method to allow changes to websocket protocols used in reconnects. --- README.md | 4 ++++ package.json | 10 +++++++--- reconnecting-websocket.js | 11 +++++++++-- reconnecting-websocket.min.js | 2 +- 4 files changed, 21 insertions(+), 6 deletions(-) diff --git a/README.md b/README.md index 49da932..f6212cc 100644 --- a/README.md +++ b/README.md @@ -142,6 +142,10 @@ socket.timeoutInterval = 5400; - Transmits data to the server over the WebSocket connection. - Accepts @param data a text string, ArrayBuffer or Blob +#### `ws.setProtocols(protocols)` +- Set a new protocols value to be used on follow up reconnects. Useful when connection requires an access token that expires and renews. + + Like this? Check out [websocketd](https://github.com/joewalnes/websocketd) for the simplest way to create WebSocket backends from any programming language. [Follow @joewalnes](https://twitter.com/joewalnes) diff --git a/package.json b/package.json index d520927..5e36b8e 100644 --- a/package.json +++ b/package.json @@ -1,10 +1,11 @@ { "name": "ReconnectingWebSocket", - "version": "1.0.1", + "version": "1.0.2", "description": "A small JavaScript library that decorates the WebSocket API to provide a WebSocket connection that will automatically reconnect if the connection is dropped.", "main": "reconnecting-websocket.js", "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" + "test": "echo \"Error: no test specified\" && exit 1", + "minifi": "uglifyjs --compress --mangle -o reconnecting-websocket.min.js -- reconnecting-websocket.js" }, "repository": { "type": "git", @@ -15,5 +16,8 @@ "bugs": { "url": "https://github.com/joewalnes/reconnecting-websocket/issues" }, - "homepage": "https://github.com/joewalnes/reconnecting-websocket" + "homepage": "https://github.com/joewalnes/reconnecting-websocket", + "dependencies": { + "uglify-js": "^3.4.9" + } } diff --git a/reconnecting-websocket.js b/reconnecting-websocket.js index 0cd4332..44e574c 100644 --- a/reconnecting-websocket.js +++ b/reconnecting-websocket.js @@ -131,7 +131,10 @@ maxReconnectAttempts: null, /** The binary type, possible values 'blob' or 'arraybuffer', default 'blob'. */ - binaryType: 'blob' + binaryType: 'blob', + + /** The sub-protocols to use when creating a websocket */ + protocols: protocols || null } if (!options) { options = {}; } @@ -205,8 +208,12 @@ return evt; }; + this.setProtocols = function (protocols) { + settings.protocols = protocols; + }; + this.open = function (reconnectAttempt) { - ws = new WebSocket(self.url, protocols || []); + ws = new WebSocket(self.url, settings.protocols || []); ws.binaryType = this.binaryType; if (reconnectAttempt) { diff --git a/reconnecting-websocket.min.js b/reconnecting-websocket.min.js index 3015099..52260e1 100644 --- a/reconnecting-websocket.min.js +++ b/reconnecting-websocket.min.js @@ -1 +1 @@ -!function(a,b){"function"==typeof define&&define.amd?define([],b):"undefined"!=typeof module&&module.exports?module.exports=b():a.ReconnectingWebSocket=b()}(this,function(){function a(b,c,d){function l(a,b){var c=document.createEvent("CustomEvent");return c.initCustomEvent(a,!1,!1,b),c}var e={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3};d||(d={});for(var f in e)this[f]="undefined"!=typeof d[f]?d[f]:e[f];this.url=b,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var h,g=this,i=!1,j=!1,k=document.createElement("div");k.addEventListener("open",function(a){g.onopen(a)}),k.addEventListener("close",function(a){g.onclose(a)}),k.addEventListener("connecting",function(a){g.onconnecting(a)}),k.addEventListener("message",function(a){g.onmessage(a)}),k.addEventListener("error",function(a){g.onerror(a)}),this.addEventListener=k.addEventListener.bind(k),this.removeEventListener=k.removeEventListener.bind(k),this.dispatchEvent=k.dispatchEvent.bind(k),this.open=function(b){h=new WebSocket(g.url,c||[]),b||k.dispatchEvent(l("connecting")),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",g.url);var d=h,e=setTimeout(function(){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",g.url),j=!0,d.close(),j=!1},g.timeoutInterval);h.onopen=function(){clearTimeout(e),(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onopen",g.url),g.protocol=h.protocol,g.readyState=WebSocket.OPEN,g.reconnectAttempts=0;var d=l("open");d.isReconnect=b,b=!1,k.dispatchEvent(d)},h.onclose=function(c){if(clearTimeout(e),h=null,i)g.readyState=WebSocket.CLOSED,k.dispatchEvent(l("close"));else{g.readyState=WebSocket.CONNECTING;var d=l("connecting");d.code=c.code,d.reason=c.reason,d.wasClean=c.wasClean,k.dispatchEvent(d),b||j||((g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onclose",g.url),k.dispatchEvent(l("close")));var e=g.reconnectInterval*Math.pow(g.reconnectDecay,g.reconnectAttempts);setTimeout(function(){g.reconnectAttempts++,g.open(!0)},e>g.maxReconnectInterval?g.maxReconnectInterval:e)}},h.onmessage=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",g.url,b.data);var c=l("message");c.data=b.data,k.dispatchEvent(c)},h.onerror=function(b){(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","onerror",g.url,b),k.dispatchEvent(l("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(b){if(h)return(g.debug||a.debugAll)&&console.debug("ReconnectingWebSocket","send",g.url,b),h.send(b);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(a,b){"undefined"==typeof a&&(a=1e3),i=!0,h&&h.close(a,b)},this.refresh=function(){h&&h.close()}}return a.prototype.onopen=function(){},a.prototype.onclose=function(){},a.prototype.onconnecting=function(){},a.prototype.onmessage=function(){},a.prototype.onerror=function(){},a.debugAll=!1,a.CONNECTING=WebSocket.CONNECTING,a.OPEN=WebSocket.OPEN,a.CLOSING=WebSocket.CLOSING,a.CLOSED=WebSocket.CLOSED,a}); +!function(e,t){"function"==typeof define&&define.amd?define([],t):"undefined"!=typeof module&&module.exports?module.exports=t():e.ReconnectingWebSocket=t()}(this,function(){if("WebSocket"in window)return l.prototype.onopen=function(e){},l.prototype.onclose=function(e){},l.prototype.onconnecting=function(e){},l.prototype.onmessage=function(e){},l.prototype.onerror=function(e){},l.debugAll=!1,l.CONNECTING=WebSocket.CONNECTING,l.OPEN=WebSocket.OPEN,l.CLOSING=WebSocket.CLOSING,l.CLOSED=WebSocket.CLOSED,l;function l(e,t,n){var c={debug:!1,automaticOpen:!0,reconnectInterval:1e3,maxReconnectInterval:3e4,reconnectDecay:1.5,timeoutInterval:2e3,maxReconnectAttempts:null,binaryType:"blob",protocols:t||null};for(var o in n||(n={}),c)void 0!==n[o]?this[o]=n[o]:this[o]=c[o];this.url=e,this.reconnectAttempts=0,this.readyState=WebSocket.CONNECTING,this.protocol=null;var i,r=this,s=!1,u=!1,a=document.createElement("div");function d(e,t){var n=document.createEvent("CustomEvent");return n.initCustomEvent(e,!1,!1,t),n}a.addEventListener("open",function(e){r.onopen(e)}),a.addEventListener("close",function(e){r.onclose(e)}),a.addEventListener("connecting",function(e){r.onconnecting(e)}),a.addEventListener("message",function(e){r.onmessage(e)}),a.addEventListener("error",function(e){r.onerror(e)}),this.addEventListener=a.addEventListener.bind(a),this.removeEventListener=a.removeEventListener.bind(a),this.dispatchEvent=a.dispatchEvent.bind(a),this.setProtocols=function(e){c.protocols=e},this.open=function(o){if((i=new WebSocket(r.url,c.protocols||[])).binaryType=this.binaryType,o){if(this.maxReconnectAttempts&&this.reconnectAttempts>this.maxReconnectAttempts)return}else a.dispatchEvent(d("connecting")),this.reconnectAttempts=0;(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","attempt-connect",r.url);var e=i,n=setTimeout(function(){(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","connection-timeout",r.url),u=!0,e.close(),u=!1},r.timeoutInterval);i.onopen=function(e){clearTimeout(n),(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","onopen",r.url),r.protocol=i.protocol,r.readyState=WebSocket.OPEN,r.reconnectAttempts=0;var t=d("open");t.isReconnect=o,o=!1,a.dispatchEvent(t)},i.onclose=function(e){if(clearTimeout(n),i=null,s)r.readyState=WebSocket.CLOSED,a.dispatchEvent(d("close"));else{r.readyState=WebSocket.CONNECTING;var t=d("connecting");t.code=e.code,t.reason=e.reason,t.wasClean=e.wasClean,a.dispatchEvent(t),o||u||((r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","onclose",r.url),a.dispatchEvent(d("close")));var n=r.reconnectInterval*Math.pow(r.reconnectDecay,r.reconnectAttempts);setTimeout(function(){r.reconnectAttempts++,r.open(!0)},n>r.maxReconnectInterval?r.maxReconnectInterval:n)}},i.onmessage=function(e){(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","onmessage",r.url,e.data);var t=d("message");t.data=e.data,a.dispatchEvent(t)},i.onerror=function(e){(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","onerror",r.url,e),a.dispatchEvent(d("error"))}},1==this.automaticOpen&&this.open(!1),this.send=function(e){if(i)return(r.debug||l.debugAll)&&console.debug("ReconnectingWebSocket","send",r.url,e),i.send(e);throw"INVALID_STATE_ERR : Pausing to reconnect websocket"},this.close=function(e,t){void 0===e&&(e=1e3),s=!0,i&&i.close(e,t)},this.refresh=function(){i&&i.close()}}}); \ No newline at end of file From d2000c54b5995d86c12300796ab642edc90974c7 Mon Sep 17 00:00:00 2001 From: Bryan Nielsen Date: Thu, 14 Mar 2019 10:49:35 -0700 Subject: [PATCH 2/4] Move minification uglify-js dependency to devDependencies. --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 5e36b8e..5e937a2 100644 --- a/package.json +++ b/package.json @@ -17,7 +17,7 @@ "url": "https://github.com/joewalnes/reconnecting-websocket/issues" }, "homepage": "https://github.com/joewalnes/reconnecting-websocket", - "dependencies": { + "devDependencies": { "uglify-js": "^3.4.9" } } From 249012c5e4aaab4cae5ce1cca969ad0e1f251a7a Mon Sep 17 00:00:00 2001 From: Bryan Nielsen Date: Tue, 19 Mar 2019 11:36:12 -0700 Subject: [PATCH 3/4] Added an npm release and verify script. --- package.json | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/package.json b/package.json index 5e937a2..2fd7055 100644 --- a/package.json +++ b/package.json @@ -5,7 +5,9 @@ "main": "reconnecting-websocket.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", - "minifi": "uglifyjs --compress --mangle -o reconnecting-websocket.min.js -- reconnecting-websocket.js" + "release": "npm run minifi -- -o reconnecting-websocket.min.js reconnecting-websocket.js", + "verify": "npm run minifi -- -o verify_reconnecting-websocket.min.js reconnecting-websocket.js && files-compare reconnecting-websocket.min.js verify_reconnecting-websocket.min.js", + "minifi": "uglifyjs --compress --mangle" }, "repository": { "type": "git", @@ -18,6 +20,7 @@ }, "homepage": "https://github.com/joewalnes/reconnecting-websocket", "devDependencies": { + "files-compare": "^1.0.2", "uglify-js": "^3.4.9" } } From 54bb6dc19b24cee28692603a9b7b715ff7c41341 Mon Sep 17 00:00:00 2001 From: Bryan Nielsen Date: Tue, 19 Mar 2019 11:38:27 -0700 Subject: [PATCH 4/4] Added documentation about npm scripts. --- README.md | 20 ++++++++++++++++++++ 1 file changed, 20 insertions(+) diff --git a/README.md b/README.md index f6212cc..f555846 100644 --- a/README.md +++ b/README.md @@ -146,6 +146,26 @@ socket.timeoutInterval = 5400; - Set a new protocols value to be used on follow up reconnects. Useful when connection requires an access token that expires and renews. +## Release and Verify + +NPM scripts are included in the package.json to create a minified version for release and to verify the minified version included in a release. +Run *npm install* to load the development modules required for the release and verify scripts. + + +#### Release + +The npm release script will create a new minified version of the library. + +> npm run release + + +#### Verify + +The verify script can be used to validate the minified release matches the source by creating a new verification minified file and then making the comparison. + +> npm run verify + + Like this? Check out [websocketd](https://github.com/joewalnes/websocketd) for the simplest way to create WebSocket backends from any programming language. [Follow @joewalnes](https://twitter.com/joewalnes)