js获取当前请求地址。只获取ip和端口

可以使用 `window.location` 对象获取当前请求的完整 URL 地址，然后从中截取出 IP 地址和端口号部分，示例如下：

const url = new URL(window.location.href);
const ip = url.hostname;
const port = url.port;
console.log(ip + ':' + port);

其中，`new URL()` 方法用于解析 URL 字符串，返回一个包含 URL 各个部分信息的 URL 对象。一般情况下，URL 中的端口号可以通过 `url.port` 直接获取，但如果 URL 中没有指定端口号，则 `url.port` 返回空字符串，此时可以根据协议类型来判断默认端口号，如：

const url = new URL(window.location.href);
const protocol = url.protocol;
const ip = url.hostname;
let port = url.port;
if (!port) {
  port = protocol === 'https:' ? '443' : '80';
}
console.log(ip + ':' + port);

上述代码中，如果 `url.port` 返回空字符串，则根据 `protocol` 来判断默认的端口号，HTTPS 协议默认端口号为 443，HTTP 协议默认端口号为 80。

相关问题

在js代码中如何指定ip和端口去请求接口

在JavaScript中可以使用XMLHttpRequest对象来发送HTTP请求。要指定IP地址和端口号，可以在URL中指定。

例如，如果要向IP地址为192.168.0.1，端口为8080的服务器发送GET请求，可以这样写：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'http://192.168.0.1:8080/api/data', true);
xhr.send();

其中，第二个参数就是URL，包含了IP地址和端口号。注意要使用完整的URL，包括协议（http或https）。如果是POST请求，可以在send方法中传递请求体数据，如下所示：

var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://192.168.0.1:8080/api/data', true);
xhr.setRequestHeader('Content-type', 'application/json'); // 设置请求头
var data = { name: 'John', age: 30 };
xhr.send(JSON.stringify(data)); // 发送JSON格式的请求体数据

在发送请求之前，还可以使用setRequestHeader方法设置请求头，如上面的例子中设置了Content-type为application/json。

vue3实现独立IP端口请求接口

在Vue3中，实现独立IP端口的请求接口通常需要借助于HttpClient或者 Axios 这样的客户端库。以下是一个简单的步骤说明：

1. 安装依赖：首先安装 `axios` 或者 `vue-resource`（对于 Vue2 可能使用后者），如果还没有安装可以使用 npm 或 yarn 进行安装：

   npm install axios

2. 导入并配置：在你的组件或者全局文件中引入 Axios 并配置基础URL，比如你的服务地址加上端口号：

   import axios from 'axios';
   
   const service = axios.create({
     baseURL: 'http://your-ip:your-port', // 根据实际IP和端口替换
     timeout: 5000, // 请求超时时间
     headers: { 'Content-Type': 'application/json' } // 设置默认头信息
   });

3. 发送请求：现在你可以使用 `service` 对象来发起HTTP请求了，例如获取数据：

   async getData() {
     try {
       const response = await service.get('/api/data');
       console.log(response.data);
     } catch (error) {
       console.error(error);
     }
   }
   
   // 调用这个方法来触发请求
   getData();

4. 非同步请求：如果你的请求是非同步的，记得把函数返回一个 Promise。