项目作者: devsullo

项目描述 :
STOMP Over WebSocket service for angular2
高级语言: JavaScript
项目地址: git://github.com/devsullo/ng2-STOMP-Over-WebSocket.git
创建时间: 2017-03-16T14:32:55Z
项目社区:https://github.com/devsullo/ng2-STOMP-Over-WebSocket

开源协议:MIT License

下载


ng2-STOMP-Over-WebSocket

STOMP Over WebSocket service for angular2

Competible with: angular4 and ionic3

Website

3 step of installation

1) npm i —save stompjs
2) npm i —save sockjs-client
3) npm i —save ng2-stomp-service

Setup

In -> typings.d.ts

Add stompjs and sockjs-client module declaration

  1. declare module 'stompjs';
  2. declare module 'sockjs-client';

In -> app.module.ts

  1. import { StompService } from 'ng2-stomp-service';
  2. @NgModule({
  3. ...
  4. providers: [StompService]
  5. })

Fast usage example

  1. import { StompService } from 'ng2-stomp-service';
  2. private subscription : any;
  3. constructor(stomp: StompService) {
  4. //configuration
  5. stomp.configure({
  6. host:'test.com',
  7. debug:true,
  8. queue:{'init':false}
  9. });
  10. //start connection
  11. stomp.startConnect().then(() => {
  12. stomp.done('init');
  13. console.log('connected');
  14. //subscribe
  15. this.subscription = stomp.subscribe('/destination', this.response);
  16. //send data
  17. stomp.send('destionation',{"data":"data"});
  18. //unsubscribe
  19. this.subscription.unsubscribe();
  20. //disconnect
  21. stomp.disconnect().then(() => {
  22. console.log( 'Connection closed' )
  23. })
  24. });
  25. }
  26. //response
  27. public response = (data) => {
  28. console.log(data)
  29. }

The Queue

When your application is going to scale the ‘fast usage example’ is not for you.. but it’s helpful for beginning.

When you have routes and different actions in your application you will need to use ‘queue’ of subscriptions with after() and done() methods.

First create queue of subscriptions. The first one ‘init’ is required then we can add other queue for example ‘user’ and assign it as false.

  1. stomp.configure({
  2. host:'test.com',
  3. debug:true,
  4. queue:{'init':false,'user':false}
  5. });

When connection established we have to call done() methdod with ‘init’ parameter.

  1. stomp.startConnect().then(() => {
  2. stomp.done('init');
  3. })

Now we can use after() method in different components and classes. Which checks continuously if specified queue have been done.

  1. stomp.after('init').then(()=>{
  2. stomp.subscribe('user',(data)=>{
  3. //here we done our queue
  4. stomp.done('user');
  5. })
  6. })

As you can see we subscribed ‘user’ destination when ‘init’ queue has been complated. As you understand you can done your queue list when you want.. If some component needs user information you have to use following code

  1. stomp.after('user').then(()=>{
  2. console.log('do something')
  3. })

Methods

  1. /**
  2. * Stomp configuration.
  3. * @param {object} config: a configuration object.
  4. * {host:string} websocket endpoint
  5. * {headers?:Object} headers (optional)
  6. * {heartbeatIn?: number} heartbeats out (optional)
  7. * {heartbeatOut?: number} heartbeat in (optional)
  8. * {debug?:boolean} debuging (optional)
  9. * {recTimeout?:number} reconnection time (ms) (optional)
  10. * {queue:Object} queue object
  11. * {queueCheckTime?:number} queue cheking Time (ms) (optional)
  12. */
  13. stomp.configure();
  14. /**
  15. * Start connection
  16. * @return {Promise} if resolved
  17. */
  18. stomp.startConnect()
  19. /**
  20. * Subscribe.
  21. * @param {string} destination: subscibe destination.
  22. * @param {Function} callback(message,headers): called after server response.
  23. * @param {object} headers: optional headers.
  24. */
  25. stomp.subscribe();
  26. /**
  27. * Send message.
  28. * @param {string} destination: send destination.
  29. * @param {object} body: a object that sends.
  30. * @param {object} headers: optional headers.
  31. */
  32. stomp.send();
  33. /**
  34. * Unsubscribe subscription.
  35. */
  36. this.subscription.unsubscribe();
  37. /**
  38. * Disconnect
  39. * @return {Promise} if resolved
  40. */
  41. stomp.disconnect()
  42. /**
  43. * After specified subscription queue.
  44. * @param {string} name: queue name.
  45. * @return {Promise} if resolved
  46. */
  47. stomp.after()
  48. /**
  49. * Done specified subscription queue.
  50. * @param {string} name: queue name.
  51. */
  52. stomp.done()
  53. /**
  54. * Turn specified subscription queue on pending mode
  55. * @param {string} name: queue name.
  56. */
  57. stomp.pending()