前端怎么判断当前连接的网络是内网还是外网?

2019-03-08 16:30:29 +08:00
 ASpiral

外包项目,前后端分离,前端纯 H5,打包后放到指定的 app 里,类似微信小程序;
后台部署在对方内部服务器,前端通过内网地址向后台发起请求,手机需要连接内网 wifi 才能使用该小程序。

对方要求手机连外网时也能使用,于是找对方申请外网访问权限,通过端口映射访问内网;
前端改成 公网 ip+端口 请求后台,结果手机连外网可以使用,内网就用不了了…
项目经理在群里 @我(前端)让我解决问题:判断当前手机连的网络是内网还是外网,内网用内网地址,外网用外网地址。
我一下子就懵了,这前端能做得到吗?

一开始想到的是通过 ajax 请求超时来判断,但这样子从进入首页到请求超时这段时间页面就没数据显示了;
目前的解决方法是进入首页后先同时向内外网地址发起请求,哪个先响应后续的所有请求就用该地址;
总感觉这样不妥,后续业务扩展这问题可能还会暴露出来;
我觉得这问题不该由前端来解决,但跟项目经理解释不清,所以想请教下,纯前端要怎么判断当前网络是内网还是外网?

6308 次点击
所在节点    问与答
26 条回复
leo108
2019-03-08 16:52:53 +08:00
调用 API 的思路没有问题,只要同时发起两个 API 请求即可,哪个先返回正确的数据就知道是哪个网咯。
nfroot
2019-03-08 17:27:23 +08:00
内网是啥?外网是啥?你分得清么?

估计你也分不清,其实哪来的内网,哪来的外网……

你这个需求明明是“我在 XXX 企业内网”和“我不在 XXX 企业内网”,一般人连内网外网都分不清,哪来的区分啊,还得判断是不是在指定的内网。

简单来说 2 种解决办法吧:
1.这个东西应该在对方企业的路由或三层交换机上指定策略路由、路由,没走错接口,内网外网都应该是可以访问到该企业的外网 IP。程序上不需要区分什么内网外网。不应该存在不能访问的情况。存在不能访问的情况,就是路由、策略路由设置错啦。把那个搞 IT 的抓起来打屁股。

2.在你的 WEB 目录下放一个极小的图片,我用 PS 做了个 1 像素的图片,才 49 字节!!!开启程序的时候同时加载 2 个地址的这个图片,谁先加载成功,就走哪个,这个不难吧?而且延迟也会很小!还搞什么 ajax,太麻烦了!直接搞 2 个 img,谁先 onload 就走谁。简单吧?

PS:这个工作说起来不是你前端做,但是后端更是做不了的。。。。其实根本的原因就是它是网络设置错了才会这样
nfroot
2019-03-08 17:32:17 +08:00
作为一个主职管 ERP 的,二三层交换懂一点,桌面运维懂一点,数据库懂一点,前端懂一点,后端也懂一点,工厂怎么运作的懂一点,财务也懂一点。。。

也是个蛋疼
zenxds
2019-03-08 17:36:45 +08:00
用 we'brtc 采集到当前的 IP,然后根据格式判断是内网还是外网
maichael
2019-03-08 17:54:29 +08:00
@zenxds #4 client 在内网又不表示和 server 在同一个内网。
maichael
2019-03-08 17:56:06 +08:00
你这种方法我觉得没有问题,你可以把判断内外网封装成一个方法,然后写成用 promise.all 之类的并且写成阻塞的方式,在页面刚进入的时候做这操作就好了,不影响扩展性。
kisara
2019-03-08 17:57:47 +08:00
很简单 在公网架设一个服务器 从本机获取一下 ip 在从服务器上查询一下本机 ip 看看一致不一致就行了
Yourshell
2019-03-08 17:59:46 +08:00
改下内网 DNS 不就好了么
maichael
2019-03-08 18:00:51 +08:00
@maichael #6 promise.race
ASpiral
2019-03-08 18:22:21 +08:00
@nfroot 就是分不清所以来发问啊…我找对方管理网络的人求助,他跟你一样说一堆我不了解的专业名词,最后怪我水平不行让我找其他前端解决…
gamexg
2019-03-08 18:59:33 +08:00
两个都试试,哪个能用用哪个。
另外内网无法用外网地址,应该是对方路由未设好。
yhxx
2019-03-08 19:11:01 +08:00
改域名解析不能解决吗?
580a388da131
2019-03-08 20:23:25 +08:00
既然是放在 app 里面,要求 app 传递一下网络情况不就好了?
cpdyj0
2019-03-08 21:27:55 +08:00
这叫啥需求,应当甩锅给网管……
Jex
2019-03-08 21:30:05 +08:00
nfroot
2019-03-08 21:51:16 +08:00
@ASpiral
1.正常来说,既然公网 IP 映射了端口,那就必然能在所有联了互联网的机器访问,包括任何公司、家联网的设备。你说的对方内网访问不了,这是不合理的,除非是被内部限制了网络,不准上网的机器(这种就只能靠你去解决了,就比如你主题中的方法,再优化也差不多,就是这样了,别想了,再想也无用,后端也没办法解决,只有你解决)
2.无限制的情况下,只能是路由 /策略路由指错了接口,否则根本就不存在访问不了的情况。这个就要对方管网络的去解决。但是你的主题里没有提到这部分。
3.上面有一些错误的回复。或者说通过更复杂的技术,但反而很难准确判断,原因我前面的回复也说了。
ThirdFlame
2019-03-08 22:36:20 +08:00
显然是出口设备(简称路由器) ,对于内网设备访问路由器 wan 口映射地址时出错导致的。 此问题 已知华为部分防火墙就有,而且无法解决。
总的来说 属于网络问题,非前端 /后端问题。
ASpiral
2019-03-08 23:04:25 +08:00
@maichael 我一开始直接在原来的代码里改,看起来好糟,怕影响后续业务扩展,看来得把这部分代码单独封装起来…
ASpiral
2019-03-08 23:06:24 +08:00
@yhxx 内网可以访问域名,但加了端口就不行,我跟后台都不懂,对方网管对我们爱理不理,感觉作为外包不是很受待见…
ASpiral
2019-03-08 23:16:19 +08:00
@ThirdFlame 前端显示不出数据,项目经理就认为是前端的问题,我对网络这块不了解没办法跟经理解释清楚,感觉做外包沟通好麻烦= =

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/542547

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX