JQuery ajax will not make HTTPS requests

I do some simple basic jQuery ajax things on my website and I have problems with the boat.

Here is the relevant code:

$(document).ready( function() { $("#getdatabutton").click( function() { $.ajax({ url: "/jsontest/randomdata", type: "get", data: [{name:"ymax", value:$("#randomgraph").height()}, {name:"count", value:$("#countinput").val()}, {name:"t", value:Math.random()}], success: function(response, textStatus, jqXHR) { data = JSON.parse(response); updateGraph(data); $("#result").html(response); if(data["error"] == "") { $("#errorbox").html("None"); } else { $("#errorbox").html(data["error"]); } }, error: function(jqXHR, textStatus, errorThrown) { $("#errorbox").html(textStatus + " " + errorThrown); } }); }); }); 

The page loads via HTTPS, but XMLHttpRequests seems to exit via HTTP.

I even tried changing the URL to an absolute URL ( https://larsendt.com/jsontest/randomdata ) and it still sends a request for the HTTP version of my site.

Naturally, since the request goes through a different protocol, the ajax call fails (cross-domain and all that).

As reported in Chrome:

 The page at https://larsendt.com/jsontest/ displayed insecure content from http://larsendt.com/jsontest/randomdata/?ymax=500&count=32&t=0.08111811126582325. 

The only other important information I can think of is that I have nginx redirect 301 from http://larsendt.com to https://larsendt.com , but I don’t see how this will break anything (I think this is pretty standard practice).

If you need a live demo, the broken version is still at https://larsendt.com/jsontest .

Anyway, thanks in advance.

+8
jquery ajax nginx
source share
2 answers

Try to fix the url so your server doesn't redirect

 url: "/jsontest/randomdata/" // there was a missing trailing / // ie https://larsendt.com/jsontest/randomdata?ymax=500&count=32&t=0.9604179110508643 // was going to https://larsendt.com/jsontest/randomdata/?ymax=500&count=32&t=0.9604179110508643 
+14
source

301 Permanent redirection may occur. To check the start of Fiddler and see the results column. Usually 200 codes, but I noticed code 301.

https jquery ajax call redirected to http , causing a mixed content error.

+1
source

All Articles