如何使用 JavaScript 从 URL 获取协议、域和端口？

在开发 Web 应用程序时，我们经常需要从 URL 中获取协议、域和端口等信息，以便程序能够根据这些信息向服务器发起请求或执行其他操作。在本篇文章中，我们将向程序员介绍如何使用 JavaScript 从 URL 中获取协议、域和端口信息。

1. 获取协议

获取 URL 中的协议通常很简单，可以使用 JavaScript 中的 location.protocol 属性来获取，该属性返回当前页面的协议。

const protocol = location.protocol;
console.log(protocol); // 输出当前页面的协议，例如：http:// 或 https://

2. 获取域名

获取 URL 中的域名也很简单，可以使用 JavaScript 中的 location.hostname 属性来获取，该属性返回当前页面的域名。

const hostname = location.hostname;
console.log(hostname); // 输出当前页面的域名，例如：www.example.com

但是需要注意的是，如果你的网站使用了 CDN 或者负载均衡等技术，那么 location.hostname 返回的可能不是实际的域名，而是 CDN 或负载均衡服务器的域名。在这种情况下，可以使用 location.origin 属性来获取实际的域名。

const origin = location.origin;
const hostname = new URL(origin).hostname;
console.log(hostname); // 输出实际的域名

3. 获取端口

获取 URL 中的端口也很简单，可以使用 JavaScript 中的 location.port 属性来获取，该属性返回当前页面的端口号。

const port = location.port;
console.log(port); // 输出当前页面的端口号，例如：8080 或 443

需要注意的是，如果当前页面的端口是默认的端口号（HTTP 的默认端口是 80，HTTPS 的默认端口是 443），那么 location.port 返回的是空字符串，而不是端口号。

结论

在本篇文章中，我们向程序员介绍了如何使用 JavaScript 从 URL 中获取协议、域和端口信息。这些信息对于开发 Web 应用程序非常重要，能够帮助程序员更好地控制和管理自己的应用程序。如果您有任何其他问题或建议，请随时联系我们。