如何用js获取当前网页的服务器IP地址

一个很奇怪的需求:

我在手机上建立一个导航web页面,部署在80端口,可供局域网内任意设备访问。
然后页面内的一个图标的代码如下:

<div class="box">
<a href="http://192.168.1.100:3001"></a>
<p><img class="icon" src="img/rrshareweb.png" ></p>
<p class="url">RRshareweb</p>
</div>

其中 192.168.1.100是我手机在局域网的IP,这个图标指向我部署在手机上3001端口的另一个服务。
但我如果手机接入另一个wifi,路由器分配给我的ip就变了,而我又不想每次都手动设置固定ip,更不想一直改导航页,有啥偷懒的办法可以用于跳转??

ddns,或者扫二维码

内网ip 怎么ddns =。=?

你的局域网完全访问不到互联网?只要能访问到,ddns记录更新内网ip就可以了

用主机名

1 个赞

不会 :joy:
有没有办法用JS来实现=。=?
最好能简单点 直接写在页面里

location.host 可以获取当前网页的地址。
所以可以使用js手动的去设置你那个3001端口的链接IP地址或域名
例如:

<a href="#" id="a3001">内部服务</a>
<script>
window.onload = function() {
document.getElementById('a3001').href='http://' + location.host + ':3001/';
}
</script>

帮忙提炼了下标题,这回有没有变得更加明了

这个其实类似一个服务,可以通过多个地址访问,即域名、IP,localhost等,使用location.host即可获取当前网页的实际(即地址栏)的名称

试了下。。不行啊= =

是这样子的。。。首先设备A 是我的服务器
设备A 跟 手机 都安装了 类似zerotier的远程组网工具。。。打开后两台设备XXX连接
手机随身带。。。然后加入wifi 和 设备B 同一局域网
手机上nginx做反向代理。。。。设备B 通过 手机 访问设备A,手机上部署了一个导航页,这样就不用记端口号
设备B也不需要安装zerotier。。。。任意设备只要跟手机在同一局域网都可以访问设备A
设备C D E F同理。。。
但是 C D E F 又在另外的局域网,手机连接入网后会被分配新的IP,那我导航页里指向的地址就不能是固定的地址。。。

更新ddns不难搞,有些服务商通过发送一个带参数的http请求就更新记录了. ls有人建议用主机名也算个办法,但是我感觉兼容会有问题.

如果是虚拟组网的话,可以试试下面的
如果zerotier的虚拟局域网,能使用静态IP话,那就在手机上的nginx用不同的端口,分别对应不同的设备

如果设备A对路径没什么要求,还可以直接在手机nginx上使用子目录反向代理对应的设备+端口

最后设备B如果访问设备A,只用访问手机的地址就可以

我看到了另外一个问题,家里为什么要两个 Wi-Fi 呢…不干扰么

我觉得这是一个好方法,大概很多普通用户没有注意到过这种用法

我现在就是这么做的呀。。。但这不就得记住 手机上 反向代理的每个服务对应的端口号么。。。。

所以。。我做了个导航页。。
但是不知道怎么写地址。。用来跳转到另一个端口上。。。因为自身ip地址不是固定的

这样啊,那直接获取设备B浏览器地址栏上所显示的主机名window.location.hostname就可以了吧,不管IP还是域名都可以处理

或者也可以试试直接修改window.location.port,像这样

window.location是最适合的,,如果不固定ip话B设备访问手机需要先知道手机的ip然后浏览器输入,输入啥window.location就是啥。。

这个其实不是获取服务器的IP地址,而是访问当前网站下另一个端口的服务,具体方法如下几种,但肯定都是基于Javascript的

Javascript

click 的时候调用 toRRShare 函数

function toRRShare() {
  const href =  `${window.location.protocol}//${window.location.hostname}:3001`;
  window.location.href = href;
}

HTML

直接在html中执行

<a href="#" onclick="location.href = `${location.protocol}//${location.hostname}:3001`"></a>

或者

<a href="javascript:location.href = `${location.protocol}//${location.hostname}:3001`"></a>

没有用过这么复杂的组网技术,假如网页有互联网的主机域名的话,我说个可能的方案吧:
1、从 location.host 得到当前页面的主机域名
2、用 ajax 发出DnsOverHttps请求,比如 cloudflare-dns.com/dns-query?name=xxxxx
3、返回的json里就有真实IP地址了