Last active
April 3, 2018 03:52
-
-
Save joeherold/a822cf31b2d58412779d to your computer and use it in GitHub Desktop.
a sample implementation of socket.io in angular2 and typescript
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/**! | |
* nodocms backend application | |
* Copyright(c) 2015 Johannes Pichler - webpixels | |
* Created by johannespichler on 23.11.15. | |
* LGPLv3.0 Licensed | |
**/ | |
/** | |
we declare io here for typescript. io is a global window object | |
you have to provide socket.io in your html markup for your application like: | |
<script src="socket.io/socket.io.js"></script> | |
or | |
<script src="path/to/my/socket.io.js"></script> | |
*/ | |
declare var io:any; | |
/** | |
* the NodoSocket Object Class | |
*/ | |
export class NodoSocket { | |
static instance:NodoSocket = null; | |
static isCreating:Boolean = false; | |
socket:any; | |
/** | |
* constuctor with control handle, that you can not instantiate by new NodoSocket(); | |
* socket should act as a real singleton, not to have multiple socket connection instances | |
* within the same application to the same resource | |
*/ | |
constructor() { | |
if (!NodoSocket.isCreating) { | |
throw new Error("This is a real singleton. Get an instance via var socket = NodoSocket.getInsance(); !"); | |
} | |
console.info("creating socket object"); | |
this.socket = io; | |
console.info("establishing connection to server..."); | |
this.socket.connect(); | |
} | |
/** | |
* receive data form Socket-Server | |
* @param eventName | |
* @param callback | |
*/ | |
public on(eventName, callback):void { | |
this.socket.on(eventName, function () { | |
var args = arguments; | |
if (typeof callback == "function") { | |
callback.apply(this.socket, args); | |
} | |
}); | |
} | |
/** | |
* submit data to socket-server | |
* @param eventName | |
* @param data | |
* @param callback | |
*/ | |
public emit(eventName, data, callback):void { | |
this.socket.emit(eventName, data, function () { | |
var args = arguments; | |
if (typeof callback == "function") { | |
callback.apply(this.socket, args); | |
} | |
}); | |
} | |
/** | |
* get instance wrapper | |
* @returns {NodoSocket} | |
*/ | |
static getInstance():NodoSocket { | |
if (NodoSocket.instance === null) { | |
NodoSocket.isCreating = true; | |
NodoSocket.instance = new NodoSocket(); | |
NodoSocket.isCreating = false; | |
} | |
console.log("NodoSocket.instance",NodoSocket.instance); | |
return NodoSocket.instance; | |
} | |
} | |
/** | |
usage: | |
in an angular2 component controller, you may use it that way: | |
var mySocket = NodoSocket.getInstance(); | |
!!!IMPORTANT: the arguments you will get back in your callback depends on your socket server implementation | |
mySocket.emit("api:model", { | |
requestID: "aSampleRequestID, | |
model: "aSampleCollectionName, | |
action: "update", | |
id: "aSampleID", | |
doc: {firstname:"john", lastname:"doe"} | |
}, function (err, result, data) { | |
if(err){ | |
// handle error here | |
return; | |
} | |
if(data){ | |
// handle your data here | |
} | |
}); | |
or for listening on events | |
!!!IMPORTANT: the arguments you will get back in your callback depends on your socket server implementation | |
mySocket.on("api:model:created", function (collectionName, id, editor, requestID){ | |
// handle your stuff here | |
}); | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment