firefox gives XMLHttpRequest "null" error accessing Vimeo API but no error from Youtube or other browsers

Question

I tried looking this up on google, and other similar questions here, but I still cannot figure this out. I moved away from a proxy request model (AJAX request to a script on my server which then makes a request from an external server) to a fully browser-based solution to pull the video data from the Youtube and Vimeo APIs. This works perfect with Youtube, but Vimeo seems to trigger an exception in firefox (but works fine in konqueror - webkit). Firefox is 17.0.1. Here is the relevant code snippet:

function getAsync(url2)
    {
    console.log('async url: ' + url2);
    if (window.XMLHttpRequest) {
        req = new XMLHttpRequest();
        } else if (window.ActiveXObject) {
        req = new ActiveXObject("Microsoft.XMLHTTP");
        }

    if (req != undefined) {
        req.onreadystatechange = function() {console.log("statechanged ");};            
        console.log('3a');
        try {
           console.log(" try... ");
           req.open("GET", url2, false); // 3rd param is whether "async"
        } catch (err) {
           console.log('err name=['+err.name + ']: err.message=[' + err.message + '] (line ' + err.lineNumber + ')');
        }
        console.log('3b');
        try {
           console.log(' about to send... ');
           req.send("");
        } catch (err) {
           console.log('err name=['+err.name + ']: err.message=[' + err.message + '] (line ' + err.lineNumber + ')');
        }

        console.log('4');
        if (req.readyState == 4) { // only if req is "loaded"
            console.log('5');
            if (req.status == 200) 
                { // only if "OK"
                console.log('6a');
                return req.responseText ;
                }
            else
                {
                console.log('6b');
                return "xml error: " + req.status +" "+req.statusText;
                }
            }
        }
    }  

This logs the following for vimeo:

async url: http://vimeo.com/api/v2/video/56945114.json
3a
try...
http://vimeo.com/api/v2/video/56945114.json
err name=[null]: err.message=[] (line 204)
3b
about to send...
err name=[NS_ERROR_NOT_INITIALIZED]: err.message=[Component not initialized] (line 211)
4

(Line 204 corresponds to req.open("GET", url2, false); and line 211 to req.send("");)

And the following for youtube:

async url: http://gdata.youtube.com/feeds/api/videos/rkbzZakcVrg?v=2&alt=json
3a
try...
http://gdata.youtube.com/feeds/api/videos/rkbzZakcVrg?v=2&alt=json
statechanged
3b
about to send...
statechanged
4
5
6a

What am I doing wrong? Or, how do I fix this?

Answer 1

I just serendipitously found the problem causing this, which my debugging didn't seem to reveal. In case anyone runs into this problem as well, here is what solved it:

It seems my JavaScript blocker (NoScript) was blocking the vimeo.com domain which for some reason was necessary to perform the XMLHttpRequest successfully. Once I noticed it said there were blocked domains (since my own server is not blocked, and it makes no use of external scripts, it was strange that it would say so) I enabled vimeo.com, tried again, and it worked perfectly. So I guess this stems from how XMLHttpRequest is implemented, probably trying to run the http request on the other domain as a javascript call or something like that (perhaps one of you more knowledgeable folk can clarify this for us). But in any case, my issue was solved in this way. Hope that helps any other frustrated googlers out there.