深入解析，JavaScript 如何获取域名端口号

在Web开发的世界里,有时候我们需要获取当前页面所在的域名以及端口号，这在很多场景下都非常有用，比如动态生成请求链接、进行跨域资源共享配置等，在JavaScript中如何获取域名端口号呢？让我们一起来深入探讨。

通过

对象获取

对象获取

对象提供了当前页面的URL相关信息，我们可以从中提取出域名和端口号。

对象提供了当前页面的URL相关信息，我们可以从中提取出域名和端口号。

// 获取完整的URLconst fullUrl = window.location.href;// 解析URLconst urlObj = new URL(fullUrl);// 获取域名const domain = urlObj.hostname;// 获取端口号const port = urlObj.port;console.log(`域名: ${domain}`);console.log(`端口号: ${port}`);

在上述代码中,首先通过

获取完整的URL，然后使用

构造函数将其解析成一个对象，通过这个对象的

属性可以获取域名，

属性可以获取端口号，如果URL中没有明确指定端口号，

属性将返回空字符串。

属性将返回空字符串。

使用

本质上就是

的一个引用，所以也可以用类似的方式来获取域名和端口号。

的一个引用，所以也可以用类似的方式来获取域名和端口号。

const fullUrl = document.location.href;const urlObj = new URL(fullUrl);const domain = urlObj.hostname;const port = urlObj.port;console.log(`域名: ${domain}`);console.log(`端口号: ${port}`);

这种方式和使用

是等效的，只是从代码的可读性角度来看，使用

更为常见。

更为常见。

在服务器端获取

在服务器端（比如Node.js），我们可以通过

对象来获取客户端请求的相关信息，其中包括域名和端口号。

对象来获取客户端请求的相关信息，其中包括域名和端口号。

const http = require('http');http.createServer((req, res) => {    const domain = req.headers.host.split(':')[0];    const port = req.headers.host.split(':')[1];    console.log(`服务器端获取的域名: ${domain}`);    console.log(`服务器端获取的端口号: ${port}`);    res.end('Hello World!');}).listen(3000, '127.0.0.1');

在这段代码中,通过

获取客户端发送请求的主机信息，然后通过字符串分割的方式分别获取域名和端口号。

获取客户端发送请求的主机信息，然后通过字符串分割的方式分别获取域名和端口号。

注意事项

属性将是一个空字符串，对于

，

会返回 。

还是

，都能正确获取。

通过以上几种方式,我们可以方便地在JavaScript中获取域名和端口号，无论是在浏览器端还是服务器端，这些方法都能满足我们在不同场景下的需求😃，希望本文能帮助你更好地理解和运用这一重要的Web开发知识，无论是进行页面间的交互通信，还是与后端服务器进行对接，准确获取域名和端口号都是迈向成功开发的关键一步💪。