When doing AJAX request in JavaScript, is there any case where it could be necessary to write
window.location.protocol + '//' + window.location.host
instead of simply
/
After all, files like images, scripts, and css are always specified relative so it should be the same when making ajax requests.
The reason I'm asking this is because I can't find any official suggestion (e.g. from w3c) on how to do it.
When doing AJAX request in JavaScript, is there any case where it could be necessary to write
window.location.protocol + '//' + window.location.host
instead of simply
/
After all, files like images, scripts, and css are always specified relative so it should be the same when making ajax requests.
The reason I'm asking this is because I can't find any official suggestion (e.g. from w3c) on how to do it.
Share Improve this question edited Oct 2, 2012 at 11:42 Shawn Chin 87k20 gold badges167 silver badges193 bronze badges asked Oct 2, 2012 at 11:05 StefanStefan 14.9k17 gold badges92 silver badges153 bronze badges 3- If they mean the same thing, I wouldn't expect to see any official suggestions of one over the other, at least nothing regarding correctness. – user743382 Commented Oct 2, 2012 at 11:10
- where does it say the mean the same thing. My question is based on assumptions, and they worked so far :P – Stefan Commented Oct 2, 2012 at 11:16
- As you know, window.location.protocol is the protocol currently in use, window.location.host is the host currently in use, finally / will take you back to the root of your web container, which should already start with the current protocol and host. It's context paths you want to be aware of. – ndtreviv Commented Oct 2, 2012 at 11:27
3 Answers
Reset to default 5They're not strictly the same, as window.location.protocol + '//' + window.location.host is missing the trailing slash to indicate the root directory. But for all intents and purposes, they can be used interchangeably.
In practical usage, assuming you're not using <base>, all of the following will point to the same place:
window.location.protocol + '//' + window.location.host + '/'
window.location.href
'//' + window.location.host + '/' //useful if you don't know the scheme and don't want to check
'/'
window.location.host contains the port number if it's anything other than 80, so you shouldn't have to worry about including that. It's simpler and clearer to write '/', as it always means "the root directory of whichever server this page came from." Things could get hairy if the URI contains something like username:password@ -- I don't know of a way to get that data using JS. Trying to reassemble a URI from individual ponents could cause problems if the code is migrated to an unusual environment like that.
The formal definition for all of this is in RFC3986, which is not exactly light reading.
I can only e up with one difference: If you have a <base /> Tag in your HTML document, AJAX (at least jQuery does) seems to consider this tag and change your URL.
In any other case, the two should behave the same. And you should avoid <base> anyway.
<head>
<title>untitled</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<base href="http://example./foo/" />
<script src="http://code.jquery./jquery-1.8.2.min.js"></script>
<script>$.get("/bar");</script>
</head>
<body>
<a href="#">Base test</a>
</body>
</html>
I'm pretty sure they mean exactly the same, but to be honest, I'd suggest just using /. Simply because it's a raw string instead of Object->Object->string + string + Object->Object->script if that makes sense.