Firefox plugin - sockets - firefox

I've always wanted a way to make a socket connection to a server and allow the server to manipulate the page DOM. For example, this could be used in a stock quotes page, so the server can push new quotes as they become available.
I know this is a classic limitation (feature?) of HTTP's request/response protocol, but I think this could be implemented as a Firefox plugin (cross-browser compatibility is not important for my application). Java/Flash solutions are not acceptable, because (as far as i know) they live in a box and can't interact with the DOM.
Can anyone confirm whether this is within the ability of a Firefox plugin? Has someone already created this or something similar?

You may want to look at Comet which is a fancy name for a long running HTTP connection where the server can push updates to the page.

It should be possible. I have developed a xulrunner application that connects to a TCP server using sockets. Extension development would likely have the same capabilities. I used a library from mozdev - JSLib. Specifically check out the networking code. The fact that there is a Firefox add-on for JSlib add-on for Firefox makes more more confident.
Essentially, as I understand it, sockets are not part of JavaScript, but through XPCOM, you can get raw socket access like you would in any c/c++ application.
Warning: JSLib doesn't seem to receive a lot of attention and the mailing list is pretty sparse.

Java/Flash solutions are not acceptable, because (as far as i know)
they live in a box and can't interact with the DOM.
That's not actually true of Java. You can interact with Java via JavaScript and make DOM changes.
http://stephengware.com/proj/javasocketbridge/
In this example there are two JavaScript methods for interaction
Send:
socket_send("This was sent via the socket\n\n");
Receive:
on_socket_get(message){ more_code(message); }

You may want to look at Comet
a.k.a. server push. This does not let the server "update" the client page directly, but all the new data is sent to the page through a single connection.
Of course, a Firefox extension (as well as plugins, which are binary libraries that can do whatever any other application can do) can work with sockets too. See 1, 2.

Related

Interact with local methods from a Chrome Extension

I'm not sure which technology I should be using, or even what exactly I'm trying to do is called, so I was hoping to just get some guidance on the issue.
We have a client/server architecture, and from the client side you should be able to send a command to the server side either by going from Browser -> Client -> Server, or just directly from Browser -> Server
My question is, what should I be looking in to to help me accomplish this task? I believe if I were to use a Chrome Extension, it would have to use NPAPI to interact locally with my PC, which is less than recommended ;)
The solution only needs to work on Windows, and will not be accessing any of the local users files.
Thanks for your help!
Within Chrome Extensions, you are allowed to access external resources if and only if you explicitly define the permissions (url pattern) in the manifest file.
Depending on the need of your application, you could use RESTful server approach or WebSockets server approach. Once you finish developing your server, your extension can communicate through it using existing web technologies (XmlHTTPRequest, WebSocket).
Assuming your going to use RESTful, what I would do is create a JavaScript service class/library that communicates to your backend (Server) using XHR, and include that in your background page within the extension. Then you can use Extension Message Passing to communicate to your service class.
Think of it as this, the scripts defined in the background context within your extension lives in between your extension and your server, acting like a facade. Search on GitHub/StackOverflow if you need questions regarding how, there are many useful posts/projects.

How do comments appear instantly on Facebook?

I was just wondering, How do comments appear instantly on Facebook? For example, when I'm on my profile and my friend comments something on my post, I can instantly see it. Is it AJAX? Or Queuing system? If I want to do the same thing, what do I do?
Thanks
I'm not exactly sure how facebook has implemented their system.
but it will either work with websockets, AJAX or a comet server.
If you want to have the same effect there are a lot of different techniques you could use,
but I would recommend looking into node.js and maybe even the now.js plugging, which allows for realtime updates via websockets. It even has support for older browsers, so if the browser does not support websockets, it will do a fall over to either a comet server implementation, AJAX or an iframe.
Basically websockets allow for better control over when data should be sent or received from and to the server since it constantly listening to the socket, so you only send data when required and same for receiving data as well, where with an AJAX approach you had to make a call every X seconds.
It's extremely easy to setup on a linux environment, and there's ample documentation to get you started.
It works with javascript and is build on the Google V8 engine, so if you've ever worked with OOP Javascript, you should be able to pick it up relatively easy.
LINKS:
http://nodejs.org/
http://nowjs.com/
You'll want to look into PHP sockets
Actually, its long polling according to this answer (which also explains how to verify or see if its changed since the answer):
How does Facebook fetch live updates

Active-X vs Ajax Internet client-server communication

I have to use scanner on Internet site web page. As far as I know not Flash nor Silverlight is capable to communicate with such hardware nowadays. It looks like there is no alternative to Active-X at present for such operation (correct me if I'm wrong).
After image is scanned I have to send it to server via HTTPS and wait for processing result.
I have some alternatives here:
Start ajax polling with regular interval
Put polling functionality straight into active-x component
What approach would you personally preffer?
Is it possible to establish event mechanism for Active-X approach (when server pushes result back to a web-page?). Will events work for javascript/ajax approach?
Thank you in advance!
Have the client scan and upload a file. That's how it's done these days. Scanning software is a part of OS - at least, in Windows and MacOS it is.
With an ActiveX object, it will become a support nightmare. Also, think of all the Firefox/Chrome/Opera/Non-Windows users out there.
Also, I vaguely recall scanner support will be added in HTML5.

Handling XMLHttpRequest to call external application

I need a simple way to use XMLHttpRequest as a way for a web client to access applications in an embedded device. I'm getting confused trying to figure out how to make something thin and light that handles the XMLHttpRequests coming to the web server and can translate those to application calls.
The situation:
The web client using Ajax (ExtJS specifically) needs to send and receive asynchronously to an existing embedded application. This isn't just to have a thick client/thin server, the client needs to run background checking on the application status.
The application can expose a socket interface, with a known set of commands, events, and configuration values. Configuration could probably be transmitted as XML since it comes from a SQLite database.
In between the client and app is a lighttpd web server running something that somehow handles the translation. This something is the problem.
What I think I want:
Lighttpd can use FastCGI to route all XMLHttpRequest to an external process. This process will understand HTML/XML, and translate between that and the application's language. It will have custom logic to simulate pushing notifications to the client (receive XMLHttpRequest, don't respond until the next notification is available).
C/C++. I'd really like to avoid installing Java/PHP/Perl on an embedded device. So I'll need more low level understanding.
How do I do this?
Are there good C++ libraries for interpreting the CGI headers and HTML so that I don't have to do any syntax processing, I can just deal with the request/response contents?
Are there any good references to exactly what goes on, server side, when handling the XMLHttpRequest and CGI interfaces?
Is there any package that does most of this job already, or will I have to build the non-HTTP/CGI stuff from scratch?
If I understand correctly, the way I approach this problem would be a 3-tier (Don't get hang up so much on the 3-tier buzz words that we all have heard about):
JavaScript (ExtJs) on browsers talks HTTP, Ajax using XmlHttpRequest, raw (naked) or wrapper doesn't really matter, to the web server (Lighttpd, Apache, ...).
Since the app on the embedded device can talk by socket, the web server would use socket to talk to the embedded device.
You can decide to put more business logic on the JavaScript, and keep the Apache/Lighttpd code really thin so it wont timeout.
In this way, you can leverage all technologies that you're already familiar with. Ajax between tier 1 and 2 is nothing new, and use socket between 2 and 3.
I did not mean that you did not know socket. I just proposed a way to take a desc of a problem where I hear a lots of words: XML/HTML/Ajax/XmlHttpRequest/Java/PHP/Perl/C++/CGI and more and offer a way to simplify into smaller, better understood problem. Let me clarify:
If you want to ultimately retrieve data from the embedded devices and render on the browsers, then have the browsers making a request to the web server, the web server uses socket to talk to the embedded device. How the data is passed between browser and server, that's normal HTTP, no more, no less. Same thing between web server and embedded device, except socket instead of HTTP.
So if just you take a simple problem, like doing an addition of 2 numbers. Except these 2 input numbers would get passed to the web server, and then the web server passes to the embedded device, where the addition is carried out. The result gets passed back to the web server, back to the browser for rendering. If you can do that much, you can already make the data flow everywhere you want to.
How to parse the data depends on how you design the structure of the data that might include container which wraps around a payload.
"... whatever HTTP is coming to the server into usable bits of information, and generate the proper HTTP response"
...but that's not any different than how you handle the HTTP request on the server using your server-side language.
...how to implement a backend process in C/C++, instead of installing a package like PHP
If the embedded device is programmed in C/C++, you are required to know how to do socket programming in C/C++. On your web server, you also have to know how to socket programming, except that will be in that server-side language.
Hope this helps.

Is there some way to PUSH data from web server to browser?

Of course I am aware of Ajax, but the problem with Ajax is that the browser should poll the server frequently to find whether there is new data. This increases server load.
Is there any better method (even using Ajax) other than polling the server frequently?
Yes, what you're looking for is COMET http://en.wikipedia.org/wiki/Comet_(programming). Other good Google terms to search for are AJAX-push and reverse-ajax.
Yes, it's called Reverse Ajax or Comet. Comet is basically an umbrella term for different ways of opening long-lived HTTP requests in order to push data in real-time to a web browser. I'd recommend StreamHub Push Server, they have some cool demos and it's much easier to get started with than any of the other servers. Check out the Getting Started with Comet and StreamHub Tutorial for a quick intro. You can use the Community Edition which is available to download for free but is limited to 20 concurrent users. The commercial version is well worth it for the support alone plus you get SSL and Desktop .NET & Java client adapters. Help is available via the Google Group, there's a good bunch of tutorials on the net and there's a GWT Comet adapter too.
Nowadays you should use WebSockets.
This is 2011 standard that allows to initiate connections with HTTP and then upgrade them to two-directional client-server message-based communication.
You can easily initiate the connection from javascript:
var ws = new WebSocket("ws://your.domain.com/somePathIfYouNeed?args=any");
ws.onmessage = function (evt)
{
var message = evt.data;
//decode message (with JSON or something) and do the needed
};
The sever-side handling depend on your tenchnology stack.
Look into Comet (a spoof on the fact that Ajax is a cleaning agent and so is Comet) which is basically "reverse Ajax." Be aware that this requires a long-lived server connection for each user to receive notifications so be aware of the performance implications when writing your app.
http://en.wikipedia.org/wiki/Comet_(programming)
Comet is definitely what you want. Depending on your language/framework requirements, there are different server libraries available. For example, WebSync is an IIS-integrated comet server for ASP.NET/C#/IIS developers, and there are a bunch of other standalone servers as well if you need tighter integration with other languages.
I would strongly suggest to invest some time on Comet, but I dont know an actual implementation or library you could use.
For an sort of "callcenter control panel" of a web app that involved updating agent and call-queue status for a live Callcenter we developed an in-house solution that works, but is far away from a library you could use.
What we did was to implement a small service on the server that talks to the phone-system, waits for new events and maintains a photograph of the situation. This service provides a small webserver.
Our web-clients connects over HTTP to this webserver and ask for the last photo (coded in XML), displays it and then goes again, asking for the new photo. The webserver at this point can:
Return the new photo, if there is one
Block the client for some seconds (30 in our setup) waiting for some event to ocurr and change the photograph. If no event was generated at that point, it returns the same photo, only to allow the connection to stay alive and not timeout the client.
This way, when clients polls, it get a response in 0 to 30 seconds max. If a new event was already generated it gets it immediately), otherwise it blocks until new event is generated.
It's basically polling, but it somewhat smart polling to not overheat the webserver. If Comet is not your answer, I'm sure this could be implemented using the same idea but using more extensively AJAX or coding in JSON for better results. This was designed pre-AJAX era, so there are lots of room for improvement.
If someone can provide a actual lightweight implementation of this, great!
An interesting alternative to Comet is to use sockets in Flash.
Yet another, standard, way is SSE (Server-Sent Events, also known as EventSource, after the JavaScript object).
Comet was actually coined by Alex Russell from Dojo Toolkit ( http://www.dojotoolkit.org ). Here is a link to more infomration http://cometdproject.dojotoolkit.org/
There are other methods. Not sure if they are "better" in your situation. You could have a Java applet that connects to the server on page load and waits for stuff to be sent by the server. It would be a quite a bit slower on start-up, but would allow the browser to receive data from the server on an infrequent basis, without polling.
You can use a Flash/Flex application on the client with BlazeDS or LiveCycle on the server side. Data can be pushed to the client using an RTMP connection. Be aware that RTMP uses a non standard port. But you can easily fall back to polling if the port is blocked.
It's possible to achive what you're aiming at through the use of persistent http connections.
Check out the Comet article over at wikipedia, that's a good place to start.
You're not providing much info but if you're looking at building some kind of event-driven site (a'la digg spy) or something along the lines of that you'll probably be looking at implementing a hidden IFRAME that connects to a url where the connection never closes and then you'll push script-tags from the server to the client in order to perform the updates.
Might be worth checking out Meteor Server which is a web server designed for COMET. Nice demo and it also is used by twitterfall.
Once a connection is opened to the server it can be kept open and the server can Push content a long while ago I did with using multipart/x-mixed-replace but this didn't work in IE.
I think you can do clever stuff with polling that makes it work more like push by not sending content unchanged headers but leaving the connection open but I've never done this.
You could try out our Comet Component - though it's extremely experimental...!
please check this library https://github.com/SignalR/SignalR to know how to push data to clients dynamically as it becomes available
You can also look into Java Pushlets if you are using jsp pages.
Might want to look at ReverseHTTP also.

Resources