Как с помощью javascript проверить, является ли соединение локальным хостом?

108

Я хочу проверить свой javascript, если страница загружается на моем локальном компьютере.

Причина, по которой я хочу это сделать, заключается в том, что при разработке я хотел бы убедиться, что проверка на стороне сервера (C #) работает правильно. Поэтому мне нравится видеть ошибки как на стороне клиента, так и на стороне сервера.

Итак, пока я тестирую, у меня есть флаг в моем материале проверки jquery, который всегда пропускает недопустимые данные. Таким образом, я сразу вижу ошибки на стороне клиента и сервера.

Однако прямо сейчас мне приходится вручную переходить и менять туда и обратно при переходе от разработки к производству.

chobo2
источник
3
Я бы просто предупредил любого, кто использует любой из этих методов в любом из этих ответов, чтобы «добавить» функциональность в систему, особенно если указанная функциональность может использоваться для раскрытия в вашей системе защищенной в противном случае информации или данных. Однако использование этой техники для «удаления» функциональности имеет смысл. Например, если вы хотите подавить запуск отслеживания аналитики в своей среде разработки, даже если вы делаете это в производственной среде. Просто хорошо подумайте о том, что вы открываете с помощью условного оператора или переключателя на стороне браузера, и как это может стать уязвимостью безопасности.
Джавид Джамае

Ответы:

217

location.hostnameПеременная дает текущий хост. Этого должно быть достаточно, чтобы определить, в какой среде вы находитесь.

if (location.hostname === "localhost" || location.hostname === "127.0.0.1")
    alert("It's a local server!");
Юникрон
источник
14
Нет ли более общего / всеобъемлющего решения, которое также охватывало бы случаи использования 127.0.0.1 и т. Д.?
jacobq
8
Это просто неправильно. многие люди редактируют свой файл хоста так, чтобы слово «localhost» не было найдено
vsync 01
4
согласен. Это не правильно. Также не будет работать при доступе к «локальному» файлу через сетевой диск.
ProblemsOfSumit
1
@Sumit через файловый интерфейс вы можете проверить, что имя хоста пусто
chacham15
1
Не знаю, почему все говорят, что это неправильно. Этот простой фрагмент идеально подходит для меня как на localhost, так и на продакшене. Мое программное обеспечение знает погоду для показа рекламы - или нет, с помощью одной простой строки кода. Спасибо OP.
Энди
32

при запуске статического 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!");
Томаш Буйновски
источник
Я столкнулся с этой точной проблемой, и хотя я сам придумал решение, этот ответ все равно должен быть выше.
domsson
7

Это все еще не уловка, но это может быть небольшое улучшение. Теперь вы можете создать массив доменов и использовать .includes

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

if (LOCAL_DOMAINS.includes(window.location.hostname))
  alert("It's a local server!");
Даниэле Бертелла
источник
5

Вот как это проверяется в React, регистрируется сервисный работник , хороший способ проверить, находитесь ли вы на localhost, проверив имя хоста, включая 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}$/
    )
);
Алиреза
источник
3

Кратчайшая форма с использованием той же механики, что и другие скрипты:

if ( ["localhost", "127.0.0.1", ""].includes(window.location.hostname) ) {
     console.log("It's local host !");
}
TarmoPikaro
источник
3

Это также касается некоторых распространенных случаев, когда IP-адреса локальной сети начинаются с 10.0.или 192.168.или 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.0.'))
    || (hostname.endsWith('.local'))
  )
}
Холтвик
источник
2

Самый простой способ сделать это - просто проверить имя хоста на соответствие localhost или проверить свое собственное доменное имя на подстроку, в данном случае URL-адреса ".local", например 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!");
}
Саммит
источник
1

Вы можете обнаружить в одном из своих кодов страниц с С #, например:

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
}

Надеюсь это поможет.

Сэмюэл Мичем
источник
3
location.host включает имя хоста И порт. Вместо этого используйте location.hostname.
pmont
1
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;
}
антилова
источник
0

Приведенные выше ответы в основном решают проблему, но ...

  • Что, если 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;
}
Shanimal
источник
Это решение все еще требует ручной работы, и его можно изменить.
A1rPun
Я думаю, что «ручная работа» несущественна и также является вмешательством, поскольку мы можем отправлять все, что захотим, без одобрения javascript, а в большинстве фреймворков есть фильтры, которые смягчают атаки, прежде чем запрос когда-либо достигнет приложения. Возможно, разрешение OP пропускать проверку на стороне сервера является риском, но оно было добавлено только для демонстрации полезности использования ключа в хэше.
Shanimal
Я никогда не использую localhost или loopback, потому что занесение в белый список десятков интернационализированных клиентов (ClinetA.com, clientA.de, clientB.com, clientB.au и т. Д.) Быстро превратилось бы в кошмар. Я решил предложить это решение, потому что оно не заботится о домене и может быть проверено на реальном сайте без патча.
Shanimal
0

Регулярное выражение медленнее *, но коротко и аккуратно. Кроме того, здесь никто не проверяет наличие IPv6 localhost (:: 1)

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

Он проверяет общий localhost, домен .local и файл: (пустое имя хоста).

*) В Chrome производительность [].includes(...)самая лучшая (42 мс), затем следует простой цикл (for, while) с проверкой элементов массива (119 мс), затем [].indexOf(...) > -1(289 мс) и, наконец, регулярное выражение (566 мс). Но эти измерения в какой-то степени относительны, потому что разные браузеры по-разному оптимизированы. В FF 52 ESR includesи indexOfс аналогичными результатами регулярное выражение в 2 раза медленнее, а цикл в 6 раз медленнее.

mikiqex
источник
0

Основываясь на приведенных выше комментариях, следующее регулярное выражение помогло мне проверить, является ли 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)
грустный
источник