如何使用javascript检查连接是否是本地主机？

Question

我想检查我的 javascript 是否加载的页面位于我的本地计算机上。

我想这样做的原因是，当我开发时，我想确保我的服务器端（C#）验证正常工作。所以我喜欢看到客户端和服务器端错误都出现。

因此，当我测试时，我的 jquery 验证内容中有一个标志，它总是让无效数据通过。这样我就能一次性看到客户端和服务器错误。

但是现在从开发到生产我必须手动来回更改。

Answer 1

location.hostname

变量为您提供当前主机。这应该足以让您确定您所处的环境。

if (location.hostname === "localhost" || location.hostname === "127.0.0.1")
    alert("It's a local server!");

Answer 2

如果在浏览器中启动静态 html，例如从

file:///C:/Documents and Settings/Administrator/Desktop/

等位置检测“localhost”将不起作用。

location.hostname

将返回空字符串。所以

if (location.hostname === "localhost" || location.hostname === "127.0.0.1" || location.hostname === "")
    alert("It's a local server!");

Answer 3

这就是它在 React 中的检查方式，注册 Service Worker，这是通过检查主机名（包括 localhost 和 IPv6）来检查您是否在本地主机上的好方法，并匹配以 127:

开头

const isLocalhost = Boolean(
    window.location.hostname === 'localhost' ||
    // [::1] is the IPv6 localhost address.
    window.location.hostname === '[::1]' ||
    // 127.0.0.1/8 is considered localhost for IPv4.
    window.location.hostname.match(
        /^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
    )
);

Answer 4

仍然不是包罗万象，但可能会有一点改进。您现在可以创建域数组并使用 .includes

const LOCAL_DOMAINS = ["localhost", "127.0.0.1", ...];

if (LOCAL_DOMAINS.includes(window.location.hostname))
  alert("It's a local server!");

Answer 5

使用与其他脚本相同的机制的最短形式：

if ( ["localhost", "127.0.0.1", ""].includes(window.location.hostname) ) {
     console.log("It's local host !");
}

Answer 6

以下代码检查地址是否为

localhost

，即它是否指向发出此请求的同一设备。

export function isLocalHost(hostname = window.location.hostname) {
  return ['localhost', '127.0.0.1', '', '::1'].includes(hostname)
}

以下代码还检查请求是否进入本地网络。本地网络 IP 以

10.0.

或

192.168.

开头或 mDNS / Bonjour 之类以

.local

结尾的常见情况：

export function isLocalNetwork(hostname = window.location.hostname) {
  return (
    (['localhost', '127.0.0.1', '', '::1'].includes(hostname))
    || (hostname.startsWith('192.168.'))
    || (hostname.startsWith('10.'))
    || (hostname.endsWith('.local'))
  )
}

Answer 7

const LOCAL_DOMAINS = [ "localhost", "127.0.0.1" ];

/* offline || development */
if ( LOCAL_DOMAINS.includes(location.hostname) )
{
    BASE_URL_PUBLIC = location.hostname + "/folder/website/"; // your project folder
}

/* online || production */
else
{
    BASE_URL_PUBLIC = location.hostname;
}

Answer 8

执行此操作的一个简单方法是仅根据 localhost 检查主机名，或根据子字符串检查自定义域名，在本例中为“.local”url，例如 http://testsite.local

var myUrlPattern = '.local';
if (window.location.hostname === "localhost" || location.hostname === "127.0.0.1" || window.location.hostname.indexOf(myUrlPattern) >= 0) {
    alert("It's a local server!");
}

Answer 9

您可以使用 C# 检测页面背后的代码之一，如下所示：

if ((Request.Url.Host.ToLower() == "localhost"))
{
    // ..., maybe set an asp:Literal value that's in the js
}

或者，如果您想从客户端脚本执行此操作，您可以检查 window.location.host 的值。

if (window.location.host == "localhost")
{
    // Do whatever
}

希望这有帮助。

Answer 10

以上答案大部分解决了问题，但是...

如果 localhost 不一定是“localhost/”怎么办？
如果你想在开发过程中进行FE验证怎么办？
如果您希望在开发期间有不同的行为怎么办
（有验证、是验证、无验证）

一种解决方案是设置位置哈希并检查它。

http://myname.foo.com/form.html#devValidation

您可以通过开关添加无限选项

switch(location.hash) {}
    case '#devValidation':
        // log the results and post the form
        break;
    case '#beValidation':
        // skip front end validation entirely
        break;
    case '#noValidation':
        // skip all validation $('[name=validationType']).val('novalidation');
        break;
    case '#feValidation':
    default:
        // do fe validation
        break;
}

Answer 11

正则表达式速度较慢*，但简短而整洁。另外，这里没有人检查 IPv6 本地主机 (::1)

/localhost|127\.0\.0\.1|::1|\.local|^$/i.test(location.hostname)

它检查常规本地主机、.local 域和文件：（空主机名）。

*) 在 Chrome 中，

[].includes(...)

的性能最好（42 毫秒），其次是带有数组项检查的简单循环（for、while）（119 毫秒），然后是

[].indexOf(...) > -1

（289 毫秒），最后是正则表达式 ( 566 毫秒）。但这些测量结果在某种程度上是相对的，因为不同的浏览器的优化方式不同。在 FF 52 ESR

includes

和

indexOf

中具有相似的结果，正则表达式慢 2 倍，循环慢 6 倍。

Answer 12

根据上述评论，以下正则表达式帮助我验证如果 url 是“localhost”，则任何 IP 地址 IPv4 或 IPv6。

window.location.hostname.match(/localhost|[0-9]{2,3}\.[0-9]{2,3}\.[0-9]{2,3}\.[0-9]{2,3}|::1|\.local|^$/gi)

Answer 13

这里的许多答案都忽略了一些边缘情况。例如，根据 DNS/主机/等，您可能会拥有

something.localhost

。

所以这是一个稍微更全面的 ES6 答案：

const localHost = ['localhost', '127.0.0.1', '::1', ''].includes(window.location.hostname) || window.location.hostname.endsWith('.localhost')

Answer 14

现在可以在设置 window.isSecureContext

时

推断页面已从本地计算机加载，但 URL 方案不是

https://

或

wss://

:

if (isSecureContext && !['https:', 'wss:'].includes(location.protocol)) {
    // locally-delivered context (eg: http://localhost/ or file://...)
}

对于大多数“本地开发”用例来说，这是一种比现代浏览器的现有答案（自 2018 年 4 月以来的所有内容）更可靠的技术：

检测主机名何时解析为
```
127.0.0.0/8
```
或
```
::1/128
```
地址范围内的 IP。
还
检测
```
file:
```
和
```
blob:
```
URL
，而不仅仅是
```
http:
```
URL。
使用
```
https://localhost/
```
或类似工具时会出现误报，但您可以对此进行解释。
通过
```
<iframe>
```
从不安全的上下文加载时，可能会出现误报。如果您确实想解释这一点，可以检查
```
location.ancestorOrigins
```
。

如何使用javascript检查连接是否是本地主机？

问题描述投票：0回答：14

14个回答

最新问题

如何使用javascript检查连接是否是本地主机？

问题描述 投票：0回答：14

14个回答

最新问题

问题描述投票：0回答：14