在 JavaScript 中确定 URL 是否属于当前域的最佳方法是什么？

Question

I have a URL. It might be relative (eg not start with https://, etc.), or it might not be (starts with https://, etc.).

How can I determine if this URL refers to the same domain as window.location?

(I'm creating a XMLHttpRequest and adding a cookie to it. Can only add the cookie if the URL I'm requesting is the same as the one I'm at. It's a secret cookie.)

Answer 1

The simplest way is actually to leverage the DOM: when you insert a URL into an <a> tag, the browser will actually resolve the URL immediately—ie when you retrieve the element's href attribute using JS, it will return an absolute path.

Then, you can simply check if the resolved path contains window.location.origin :

 function doesUrlBelongsToCurrentDomain(url) { const link = document.createElement('a'); link.href = url; return link.href.includes(window.location.origin); } console.log(doesUrlBelongsToCurrentDomain('https://google.com')); // false console.log(doesUrlBelongsToCurrentDomain('./relative-link')); // true console.log(doesUrlBelongsToCurrentDomain('/relative-link')); // true

For a ES5-compliant version, swap String.prototype.includes with String.prototype.indexOf :

return link.href.indexOf(window.location.origin) !== -1;

Also, if your browser does not support window.location.origin , you will need to construct it manually:

var origin = window.location.protocol + '//' + window.location.hostname + (window.location.port ? ':' + window.location.port : '');

...therefore, the IE11-compatible version (if IE11 support is absolutely needed), will be as follow:

function doesUrlBelongsToCurrentDomain(url) {
  var link = document.createElement('a');
  link.href = url;

  var origin = window.location.protocol + '//' + window.location.hostname + (window.location.port ? ':' + window.location.port : '');

  return link.href.indexOf(origin) !== -1;
}

Answer 2

您可以从要测试的 url 创建一个URL 对象，并将其与当前位置来源进行比较：

const sameOrigin = new URL('URL_TO_TEST').origin === window.location.origin;