How do you set a Javascript attachEvent to listen for data from the server?

Question

I have a page that uses Javascript in which I need to have a function that listens for data to be received from the server. Basically, anytime it hits the server, I need the function to fire.

This seems like it would be pretty straightforward - but so far nothing I've tried works.

I know I have the basic set-up correct - because I can get it to listen for mouse up, mouse down, and load - but nothing for when it sends or receives data from the server.

For example, this works...

document.attachEvent('onmouseup', function(event) {
   alert("mouse released!");        
});

So does this...

window.attachEvent('onload', function(event) {
   alert("page loaded!");       
});

However, none of these do...

document.attachEvent('onreceive', function(event) {
   alert("data received!");         
});

window.attachEvent('onreceive', function(event) {
   alert("data received!");         
});

document.attachEvent('onpost', function(event) {
   alert("data posted!");       
});

window.attachEvent('onpost', function(event) {
   alert("data posted!");       
});

document.attachEvent('onmessage', function(event) {
   alert("data posted!");       
});

window.attachEvent('onmessage', function(event) {
   alert("data posted!");       
});

Any suggestions?

Thanks in advance!

You're probably waiting for data after requesting it. Then you need to use http://en.wikipedia.org/wiki/XMLHttpRequest or jQuery, for example, to simplify things. — Francis Ducharme, Apr 09 '15 at 19:14
You want an event to fire anytime the client "sends or receives data from the server". What qualifies as data being send or received between the server and the browser environment? Do you want to know the value of each bit in real time as it hits your network interface and goes to your TCP driver? If not, what should trigger such a listener? In other words, what are you *really interested in doing*? — apsillers, Apr 09 '15 at 19:15
And if you are looking to deal with data transmission initiated by the server, you need to look into SignalR, for example. (which requires you have control over both the front and back end) — Francis Ducharme, Apr 09 '15 at 19:19
I don't think addEventListener is the answer. I think that's basically the same as attachEvent - only addEventListener doesn't work in this particular environment. — Tim Mitchell, Apr 10 '15 at 00:21
For XMLHttpRequest might work, but I'm not sure it really has to be that complicated. What I need to do is have a function that fires every time a request - any request - is sent to the server; and also when a response - any response - is received. I don't need to know anything about the data itself - I just need to know when a request has been sent or a response has been received. — Tim Mitchell, Apr 10 '15 at 00:30
The events you've subscribed to: `onreceive` and `onpost` do not exist and `onmessage` is used for [communicating between iframes](http://help.dottoro.com/ljjqtjsj.php). Are these events you would like to create manually? If you're looking to tap into AJAX events you can do so if they are made via [jQuery](http://stackoverflow.com/a/2912076/402706), otherwise I don't think you can globally tap into every XMLHttpRequest being made by the page. — Brandon Boone, Apr 10 '15 at 01:48
@TimMitchell I don't think `` or `window` has the events you are looking to hook into. The ones you are looking for are held in `XMLHttpRequest`. jQuery is the simplest option to leverage `XMLHttpRequest`. — Francis Ducharme, Apr 10 '15 at 14:11

score 2 · Answer 1 · answered Apr 10 '15 at 13:45

I think there are no way, as per addEventListener specification:

The EventTarget.addEventListener() method registers the specified listener on the EventTarget it's called on. The event target may be an Element in a document, the Document itself, a Window, or any other object that supports events (such as XMLHttpRequest).

And indeed, you can check it by searching on the event reference list here.

Apparently, you'll need to:

(a.) call the handler functions manually before and after every ajax call you make; or
(b.) use a javascript framework to make ajax calls (so it does the manual work for you)

In case you choose (b.):

There are a lot of frameworks around there, but I'm suggesting here jQuery or AngularJs.
- You can find interesting free courses here¹ if you need some introduction to them
If you choose jQuery:
- use ajaxSuccess for handling all responses
- set a global beforeSend on ajaxSetup for handling all requests
If you choose AngularJS:
- use Interceptors when globally handling responses and requests
- there's another nice angular interceptor tutorial

_{¹ I do not work for the linked course site. I posted it here as a personal suggestion.}

How do you set a Javascript attachEvent to listen for data from the server?

1 Answers1