CODEWITHSUNDEEP
websocketlong-pollingserver-push
user2349457
user2349457

Reputation: 31

Remote Control for Website

I want to start to create a website which is opened on a mobile phone (any kind of smartphone). This website will have the feature to control a website you have already opened on your computer. (The Volkswagen New Century Beetle from 2011 had the feature, that i could scroll via smartphone on the website opened on my desktop computer)

We have a streaming website for horsevideos, and this will be an awesome feature for our customers, if they could watch the streams on their smart tv and control via iphone/android/wp.

Also wilmaa.com from switzerland provides a remote control for smartphone to navigate on my website on smart tv/webbrowser.

Because I need a starting point to learn how it works i was checking Google, maybe there already any remote controls outside, but unfortunately i couldn't find anything.

Maybe Stack Overflow can help me by giving some starting points on how to realize this.

Upvotes: 3

Views: 3331

Answers (1)

Niels Keurentjes
Niels Keurentjes

Reputation: 41958

To do this you need some kind of 'pushing' service able to overcome the inherent drawback of HTTP that it has always been a 'pull only' system - client initiates a request, server answers. In this case you want to push an event from the server to the client.

For the past years this has been done with so called 'long polling'. This means that you 'abuse' the mechanism present in browsers that protects the server from hanging requests, but allows them to take a while. Apache is by default configured to allow a request to last 300 seconds on most platforms. Long polling works by sending an Ajax request, and if the server has no data, instead of sending that back it just waits, until either it does have data, or a long period such as a minute has expired. The client does not send a new request until it has received a response. This gives the illusion to the end user of real time feedback, and is how sites like Facebook et al have done this for years.

Since a few months it's also possible to employ a new HTML5 technology that now has stable implementations on all major browsers: Websockets. This technology allows a server to upgrade a common pull request to a full bidirectional connection, allowing realtime communication between browser and server. Regrettably, the 'regular' webservers such as Apache are not really built for this kind of logic, although it is possible to emulate it with frameworks like Ratchet. For the realtime part of the system the current platform of choice for most sites, including Stack Overflow here, is node.js - serverside asynchronous Javascript.

What I would recommend in your situation:

  • Set up a separate node.js server as an event dispatcher (you can get a cheap micro sized EC2 instance at Amazon for like $15 per month which will probably suffice, and is very scalable)
  • Keep all the other code in the regular environment where it is now, just add logic to communicate with the event dispatcher
  • Deploy Socket.io as your websocket handling service. It simplifies all the Javascript logic on both server and client side, and wraps a realtime connection in such a way that it's even compatible with IE5.5, by gracefully degrading towards technologies that are supported by both server and client - websockets on recent browsers, long polls or other technologies on legacy systems.

With this solution you can easily implement, with relatively little code, a system with full realtime responsiveness across multiple platforms as you described.

As for the controlling app itself, just use HTML5, with Phonegap if you intend to distribute to app stores.

Upvotes: 6

Related Questions