How to Request a Password Protected Page in Javascript

Question

I'm working on a very simple Sidebar Gadget to analyze my router's monthly bandwidth usage and determine how far ahead or behind I am for that month. The data is located in a router-hosted, password protected webpage (I'm using DD-WRT, if it matters). I'd like to pass a page request to the router with Javascript, along with all the authentication information, to retrieve the page all in one go, but I can't seem to find the proper syntax for that. Any ideas?

Here's my code so far:

var ua = navigator.userAgent.toLowerCase();
        if (!window.ActiveXObject){
          req = new XMLHttpRequest();
        }else if (ua.indexOf('msie 5') == -1){
          req = new ActiveXObject("Msxml2.XMLHTTP");
        }else{
          req = new ActiveXObject("Microsoft.XMLHTTP");
        }

        req.open('GET', 'http://192.168.1.1/Status_Internet.asp', false, "username", "password");   
        req.send(null);  
        if(req.status == 200){
           dump(req.responseText);
        } else{
            document.write("Error");
        }

        document.write("Second Error");

Firebug indicates that it throws an error on req.send(null) - specifically, Access to restricted URI denied" code: "1012.

It may be because of the same-origin policy, but in that case what can I use instead of an xmlhttpRequest?

Martin Jespersen · Accepted Answer · 2011-03-11T21:20:05.260

1

It is because of the same-origin policy, the alternative is an iframe but that will not really give you what you wish for.

If it is http-auth you used to be able to request the page with http://username:pass@site but i must admit i haven't tried to use that for a long time, so i don't know if it is still supported.

EDIT:

If this doesn't work, maybe you can use basic http auth as described here: http://en.wikipedia.org/wiki/Basic_access_authentication but this would require you to sue a serverside proxy, since you can't manipulate the request headers from javascript when xhr is not an option.

edited Mar 11 '11 at 21:20

answered Mar 11 '11 at 16:47

Martin Jespersen

25,743
8
56
68

I gave the http://username:pass@site syntax a go-ahead before posting the question, but it failed as well. – Brian Bauman Mar 11 '11 at 18:03
@DeathMagus: Look at my updated answer, maybe basic auth is something for you- – Martin Jespersen Mar 11 '11 at 21:20
I don't know a way of hosting my own pages on the router. If I did, I would do all the processing on that end, and just retrieve the data from a public page. – Brian Bauman Mar 12 '11 at 21:35

score 0 · Answer 2 · answered Mar 11 '11 at 16:49

You need to add a Authorization header to the request. I'm not an AJAX expert, so I'm not sure if you can modify header fields in AJAX requests. If you can't, then you're doomed.

If you can, then this Wikipedia article contains an example what it must look like.

adardesign · Answer 3 · 2011-03-11T17:02:50.290

0

If the same-origin policy is not the issue, then load jQuery on your page.

and use jQuery's $.ajax method.

$.ajax({
  url: "path/to/your/page.html", // self-explanatory
  password:"your password", // a string with your password.
  success: function(data){ // on sucsess:
  $("someDiv").html(data); // load in the retrived page
 }
});

See the jQuery ajax API for details.

edited Mar 11 '11 at 17:02

answered Mar 11 '11 at 16:52

adardesign

33,973
15
62
84

score 0 · Answer 4 · answered Mar 11 '11 at 16:59

That's a security feature: you see, there are malicious scripts that used a similar technique to hack the routers (who changes their router password anyway? Apparently not Joe X. Schmoe).

Under the Same Origin Policy, AJAX requests are limited to the domain (and port) whence they originated: therefore, from a local page, you can't make a request to 192.168.1.1:80 .

There is a possible workaround - a server-side proxy (e.g. a PHP script that fetches the router pages for you) inside your network.

How to Request a Password Protected Page in Javascript

4 Answers4