Angularjs-socket.io

99 views
Skip to first unread message

Yonatan Kra

unread,
Feb 5, 2014, 5:04:02 PM2/5/14
to ang...@googlegroups.com
Hi,
I'm pretty new to Angular (about 2 weeks of trial and error) and it looks amazing so far.
I think I'm now ready to dive into complex integration with socket.io.
I've created a service that creates a port listener (something very simple).
I have 2 questions about it:
1) The service needs to be called by a controller.  When I switch view, it means I switch a controller.  Does that mean each time I switch view (i.e. click a menu item), I destroy the listener and create a new one? I believe it's a more basic question - what happens to the controller once I switch view - is it destroyed?
2) How would you suggest keeping the connection to the server across views? I want to call it once, and it would be active as long as the user is in the app.
Thanks

Sonny Michaud

unread,
Feb 5, 2014, 6:17:57 PM2/5/14
to ang...@googlegroups.com
I have done something very similar, but using SockJS instead of
Socket.IO. They have very similar interfaces, and, having used both, I
have come to prefer the former.

Your state will be persistent in the service, so switching view should
not cause problems. You can see my implementation here if you are
interested:

https://github.com/sonnym/fics_web_interface/blob/master/app/assets/js/services/proxy.js

This service handles the communication between itself and the server
when first run, then returns an object that allows other services (or
controllers) to send messages or register handlers for messages that
will then be dispatched upon arrival. One important thing to note is
that the dispatch occurs in a $rootScope.$apply() call to ensure that
the changes propagate through the application.

- Sonny
> --
> You received this message because you are subscribed to the Google
> Groups "AngularJS" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to angular+u...@googlegroups.com.
> To post to this group, send email to ang...@googlegroups.com.
> Visit this group at http://groups.google.com/group/angular.
> For more options, visit https://groups.google.com/groups/opt_out.

Yonatan Kra

unread,
Feb 6, 2014, 1:56:29 AM2/6/14
to ang...@googlegroups.com
Hi,
Thanks for your answer and example.
If I understand your code correctly, what you are doing is to load the socket service in a controller and every time check if it was activated before.
If it was, call the callback.  If it wasn't, open a new socket with the callback.
Is that it? And there's no need to worry about "destroy" and such stuff here?
Thanks again


On Thu, Feb 6, 2014 at 1:17 AM, Sonny Michaud <michau...@gmail.com> wrote:
I have done something very similar, but using SockJS instead of Socket.IO.  They have very similar interfaces, and, having used both, I have come to prefer the former.

Your state will be persistent in the service, so switching view should not cause problems.  You can see my implementation here if you are interested:

https://github.com/sonnym/fics_web_interface/blob/master/app/assets/js/services/proxy.js

This service handles the communication between itself and the server when first run, then returns an object that allows other services (or controllers) to send messages or register handlers for messages that will then be dispatched upon arrival.  One important thing to note is that the dispatch occurs in a $rootScope.$apply() call to ensure that the changes propagate through the application.

- Sonny


On 02/05/2014 05:04 PM, Yonatan Kra wrote:
Hi,
I'm pretty new to Angular (about 2 weeks of trial and error) and it looks amazing so far.
I think I'm now ready to dive into complex integration with socket.io.
I've created a service that creates a port listener (something very simple).
I have 2 questions about it:
1) The service needs to be called by a controller.  When I switch view, it means I switch a controller.  Does that mean each time I switch view (i.e. click a menu item), I destroy the listener and create a new one? I believe it's a more basic question - what happens to the controller once I switch view - is it destroyed?
2) How would you suggest keeping the connection to the server across views? I want to call it once, and it would be active as long as the user is in the app.
Thanks
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+unsubscribe@googlegroups.com.

To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/LZo3-S5uOeQ/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+unsubscribe@googlegroups.com.

umi

unread,
Feb 6, 2014, 9:53:31 AM2/6/14
to ang...@googlegroups.com
You might be interested in this post covering socket.io integration work angular: http://briantford.com/blog/angular-socket-io.html

Sonny Michaud

unread,
Feb 6, 2014, 6:00:11 PM2/6/14
to ang...@googlegroups.com
That is partially correct.  I am not creating a new socket each time it is called - only one is every made during the lifetime of the application.  The check to see if the socket is open is really only there in the event that the user starts sending events before the connection has been established, but then I simply continue checking thereafter.  If you wanted to do anything when the socket is closed you would do so in that service.  You could also add a method to the returned interface allowing a user to close the socket; in my case, the user has to navigate away in order to close their connection.

There is some code in there that keeps track of whether the socket is open before I switched to using socket.onopen() directly, which I should remove for clarity.  Hope this helps!

- Sonny


On 02/06/2014 01:56 AM, Yonatan Kra wrote:
Hi,
Thanks for your answer and example.
If I understand your code correctly, what you are doing is to load the socket service in a controller and every time check if it was activated before.
If it was, call the callback.  If it wasn't, open a new socket with the callback.
Is that it? And there's no need to worry about "destroy" and such stuff here?
Thanks again
On Thu, Feb 6, 2014 at 1:17 AM, Sonny Michaud <michau...@gmail.com> wrote:
I have done something very similar, but using SockJS instead of Socket.IO.  They have very similar interfaces, and, having used both, I have come to prefer the former.

Your state will be persistent in the service, so switching view should not cause problems.  You can see my implementation here if you are interested:

https://github.com/sonnym/fics_web_interface/blob/master/app/assets/js/services/proxy.js

This service handles the communication between itself and the server when first run, then returns an object that allows other services (or controllers) to send messages or register handlers for messages that will then be dispatched upon arrival.  One important thing to note is that the dispatch occurs in a $rootScope.$apply() call to ensure that the changes propagate through the application.

- Sonny


On 02/05/2014 05:04 PM, Yonatan Kra wrote:
Hi,
I'm pretty new to Angular (about 2 weeks of trial and error) and it looks amazing so far.
I think I'm now ready to dive into complex integration with socket.io.
I've created a service that creates a port listener (something very simple).
I have 2 questions about it:
1) The service needs to be called by a controller.  When I switch view, it means I switch a controller.  Does that mean each time I switch view (i.e. click a menu item), I destroy the listener and create a new one? I believe it's a more basic question - what happens to the controller once I switch view - is it destroyed?
2) How would you suggest keeping the connection to the server across views? I want to call it once, and it would be active as long as the user is in the app.
Thanks
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.

To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

--
You received this message because you are subscribed to a topic in the Google Groups "AngularJS" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/angular/LZo3-S5uOeQ/unsubscribe.
To unsubscribe from this group and all its topics, send an email to angular+u...@googlegroups.com.

To post to this group, send email to ang...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+u...@googlegroups.com.

Yonatan Kra

unread,
Feb 15, 2014, 2:48:04 AM2/15/14
to ang...@googlegroups.com

Helps a lot. Thanks

Reply all
Reply to author
Forward
0 new messages