< Заур Магомедов />

профессиональный верстальщик и блоггер

Мое хобби - разработка сайтов, но со временем это переросло в постоянный и стабильный источник дохода.

Заур Магомедов
Главная » Полезные советы » Как открыть сайт в локальной сети с локального компьютера?

Как открыть сайт в локальной сети с локального компьютера?

Как открыть сайт в локальной сети с локального компьютера?

Пост был обновлен: Мар 26, 2016

Всем привет! На связи Заур Магомедов с очередной порцией материала для веб-мастеров. Не успел начаться год, как мы уже приблизились к концу февраля. Пишу этот пост в праздничный день 23 февраля и пока не забыл — поздравляю всех мужчин с Днем защитников отечества! Ну что можно пожелать еще, как не мирного неба над головой и здоровья всем нам. А теперь собственно перейдем к теме поста.

Когда разрабатываешь сайт по ходу дела могут появляться какие-либо вопросы к заказчику. Так вот эти вопросы удобнее, а в некоторых случаях просто обязательно обсуждать, когда заказчик видит сам сайт. Как мы можем показать сайт заказчику если он разрабатывается на локальном сервере? Можно, конечно, выгрузить на хостинг, это как вариант. Но для меня лично это неудобно, т.к. придется делать обновление на хостинге периодически по мере поступления вопросов. Можно также работая на локалке, при каждом сохранении файлов выгружать их на хостинг, причем делается это автоматически, например, в редакторе Sublime Text 3 + плагин Sftp есть такая возможность.

Не смотря на вышеперечисленные способы, есть вариант дать доступ к локальному сайту из интернета для просмотра. Тогда заказчик может наблюдать за всем ходом работы. Единственный минус — когда вы выключаете компьютер просмотр станет невозможным. Можно в принципе компьютер и не выключать, пусть работает, ничего страшного в этом нет. Давайте теперь рассмотрим, как показать сайт по локальной сети и дать доступ из интернет.

В качестве веб-сервера я буду использовать мой любимый Open Server.

Доступ к сайту по локальной сети

Сразу скажу, что в данной статье я не буду показывать как нужно настраивать саму локальную сеть. Благо по этой теме в интернете есть масса материалов, в том числе и видео. Чтобы показать сайт по локалке нам необходимо сделать некоторые настройки в Open Server. Для этого щелкаем правой кнопкой мыши по флажку Open Server в трее и переходим к настройкам. Выбираем вкладку «Сервер» и там находим такой пункт, как «IP-адрес сервера», выставляем опцию «Все доступные IP».

Настройки Open Server вкладка Сервер

Далее переходим во вкладку «Алиасы». Обратите внимание на поля: исходный домен, конечный домен. В поле «Исходный домен» мы вбиваем IP-адрес нашего компьютера в локальной сети. Узнать его можно следующим образом: щелкаем на комбинацию клавиш Win+R и в появившимся окошке вбиваем команду «cmd» для запуска окна командной строки.

Запуск командной строки в Windows

Далее в окне командной строки вводим команду «ipconfig» и получаем вот такой результат.

Командная строка Windows

Здесь нас интересует срока «IPv4-адрес». Это и есть ваш локальный IP-адрес компьютера. У меня он — 192.168.1.205, вот как раз его я и вбиваю в поле «Исходный домен» в настройках локального сервера. В поле «Конечный домен» мы выбираем домен нашего сайта. Я выбрал домен по умолчанию — Localhost для примера. После выбора жмем по кнопке «Добавить» и у нас в списке внизу появится запись, которая говорит о том, какой домен должен открываться при обращении к компьютеру с данным IP-адресом из локальной сети.

Читайте также:  Как перейти с http на https?

Исходный и конечный домены во вкладке Алиасы Open Server

Все, сохраняемся. После этого сервер перезапустится и можно уже открывать наш сайт по локальной сети. Для этого просто необходимо вбить ваш локальный IP-адрес на другом компьютере в адресную строку браузера. Вот и все, все довольно просто.

Доступ к локальному сайту из интернета

Можно дать возможность пользователям смотреть на сайт из интернета. В данном случае локальный сервер будет выступать в роли виртуального хостинга. Но здесь есть некоторый нюанс — у вас должен быть выделенный (статичный) внешний IP-адрес. Ваш интернет-провайдер должен назначить вашему компьютеру в своей сети IP-адрес, который останется неизменным. Обычно такую услугу провайдеры предоставляют за отдельную дополнительную плату. Имея выделенный IP-адрес, доступ к локальному сайту можно решить на раз, два…

Безопасность компьютера!

Следует иметь ввиду, что доступ к компьютеру из вне нарушает гарантию безопасности. Некоторые дыры в скриптах, запущенные с правами администратора могут открыть хакерам доступ к вашему компьютеру. Перед настройкой удаленного доступа обязательно почитайте рекомендации разработчика в документации к требованиям безопасности.

Открываем настройки Open Server -> Алиасы. Добавляем новую строку в паре Исходный домен -> Конечный домен. В поле исходного домена вбиваем наш выделенный IP-адрес. В поле конечного домена выбираем наш домен. Не забываем нажать на кнопку «Добавить». Если вы не знаете свой IP-адрес, то узнать его можно на сайте 2ip.ru.

Узнать свой IP-адрес на сайте 2ip.ru

Следующее, что нам необходимо будет сделать это создать переадресацию портов в маршрутизаторе. Для чего это нужно? Когда обращаются к нашему IP-адресу из сети компьютер должен знать куда перенаправлять эти запросы. Так вот, с помощью переадресации мы как-бы говорим открой такой то сайт. Я покажу на примере своего роутера Asus RT-N12, но суть у всех роутеров будет та же самая, поэтому тут проблем не должно возникнуть. Если у вас английская прошивка, то ищите что-то типа Port Forwarding. На крайний случай почитайте в интернете, как создать переадресацию портов в вашем роутере.

Входим в панель управления роутера и переходим в раздел «Интернет» -> «Переадресация портов». Здесь сразу ставим переключатель «Включить переадресацию портов» в положение «Да». Далее, в поле «Имя службы» можно ввести произвольное название на латинице. В поле «Диапазон портов» можно указать диапазон портов с которыми вы будете работать. По умолчанию для http-соединения используется 80-й порт, поэтому в данном поле я ввожу — 80. В поле «Локальный IP-адрес» выбираем свой локальный компьютер. «Локальный порт» — вводим номер порта, с которым работает ваш локальный сайт. Его можно узнать в настройках Open Server. Смотрите выше скрин настроек Open Server, вкладки «Алиасы», ниже указаны настройки портов. Порт по умолчанию «80» можно переопределить, например. — 8080. Это нужно, если в вашей локальной сети уже кто-то занял 80-й порт. Тогда соответственно в поле «Локальный порт» вы указываете — 8080. После всего жмем на кнопочку «Add/Delete» и у нас в списке появляется новая запись.

Переадресация портов в роутере Asus RT-N12

После всех настроек применяем настройки — «Применить», при этом роутер будет перезагружен. Теперь в адресной строке браузера на удаленном компьютере вводим наш внешний IP-адрес и открываем сайт.

Читайте также:  Как создать почту со своим доменом

Что делать, если у вас нет выделенного IP-адреса?

Вариант с выделенным IP-адресом может подойти не всем. Не каждый захочет переплачивать провайдеру за выделенный IP и я их понимаю. Как раз для таких случаев предусмотрен вариант с динамическим IP-адресом — технология DDNS (Dynamic Domain Name System). Суть ее состоит в том, что клиенты могут подключится к роутеру даже с динамическим внешним IP-адресом через зарегистрированное доменное имя. В большинстве современных роутерах служба DDNS уже встроена. В качестве DNS-сервера выступают сервисы, которые предлагают услуги DDNS. Один из таких сервисов — noip.com. Вообще, таких сервисов может быть много, по крайней мере я знаю уже несколько. Итак, давайте все по порядку.

Регистрируемся на сайте noip.com. При регистрации можно отметить чек-бокс «Create my hostname later», т.е. создать имя хоста позже. Обратите внимание, на странице регистрации указано, что доступно бесплатным пользователям. Нас интересует именно «Hostnames», т.е. количество создаваемых хостов. Для бесплатного аккаунта это количество равно — 3. Думаю этой цифры будет более, чем достаточно.

Выбор тарифного плана на сайте no-ip.com

После регистрации обязательно активируйте свой аккаунт, переходом по ссылке в письме. После авторизации мы попадаем в свой личный кабинет, выбираем в меню «Dynamic DNS (Free)» -> «Hostnames» и создаем имя хоста, кликнув по кнопочке «Add Hostname». В поле «hostname» вводим любое имя латинскими буквами, например, my-site. Имейте ввиду, что выбранное вами имя может быть занято на определенном домене (поле Domain). Можете ввести другое имя или выбрать домен, на котором это имя будет свободно. В поле «IPv4 Address» подставлен ваш внешний IP-адрес, система определила его автоматически. Здесь ничего не трогаем. Если хотите убедиться, что это именно ваш IP, то можете сравнить его на сайте 2ip.ru. Добавляем хост — «Add Hostname».

Создание хоста на сайте no-ip.com

Все, хост у нас создан. Теперь копируем адрес хоста в буфер обмена и идем в панель управления роутера: «Интернет» -> «DDNS» и вводим свои данные, как на скрине ниже. Единственное прокомментирую то, что вам надо будет ввести свой логин и пароль, который вы указывали при регистрации на сайте no-ip.com.

Настройка DDNS в роутере Asus RT-N12

Жмем «Применить» и ждем пока перезагрузится роутер. Последнее, что нам необходимо будет сделать это указать наш хост в Open Server. Для этого идем в настройки, вкладка «Алиасы» и добавляем в список новый хост в ключе Исходный домен -> Конечный домен.

Добавление нового алиаса хоста в Open Server

Все, вбиваем в адресной строке браузера наш хост, в моем случае это — my-site.ddns.net и ура наш локальный сайт открывается. Проверять лучше на телефоне или на другом устройстве, которое не подключено к вашей локальной сети, т.к. данный хост может открыться и по локалке. Можно в телефоне отключить Wi-Fi и через мобильный интернет проверить. Вот, что у меня получилось.

Доступ к локальному сайту из интернет

На этом все. Надеюсь вам данная статья пригодится. Если возникнут вопросы, то задавайте в комментариях, постараемся решить ваши проблемы. Всем пока и встретимся в других постах.

Пост был обновлен: Мар 26, 2016

Заур Магомедов
Заур Магомедов

Верстальщик с большим опытом работы. Занимаюсь созданием сайтов с 2009 года. Постоянно обучаюсь и совершенствую свои навыки. Веду свои проекты, в том числе и данный блог.

У меня вы можете:

Оцените пост:

1 балл2 балла3 балла4 балла5 баллов (9 оценок, среднее: 4,56 из 5)
Загрузка...

Проверка орфографии

Система Orphus

46 комментариев к статье "Как открыть сайт в локальной сети с локального компьютера?"

  • borka Июл 25, 2017 в 21:34

    Привет. Не подскажете ответ на такую проблему: сделал всё по инструкции, когда выбираю localhost всё отображает, но когда выбираю свой домен, то белая страница.

    • Заур Магомедов
      Заур Магомедов Июл 26, 2017 в 7:55

      Включите​ отображение ошибок и посмотрите что выдаёт

  • Armadanium Июл 24, 2017 в 12:19

    Заур, добрый день. Помогите настроить доступ к сайту через роутер. Есть белый айпи, но как не настраиваю OpenServer не могу открыть сайт в интернете. Порт 80 у роутера свободен. Проверка ip у компьютера через cmd 127.0.0.1 предположим, а проверка ip в интернете на сайте 2ip 123.456.789.0 такой предположим. Сайт не открывается ни по 1 ip ни по 2 ip. Скажите что делать?

    • Заур Магомедов
      Заур Магомедов Июл 24, 2017 в 19:32

      А вы проброс 80 порта делали на роутере?

  • Евгений Июл 20, 2017 в 4:19

    Если ваш роутер работает под NAT, то провайдером будет выдан для Вас внутренний приватный WAN IP адрес и служба DDNS работать не будет, то есть, даже настроив все по выше опубликованной инструкции, доступ к вашему вебсерверу из вне работать не будет 🙁
    Во многом провайдеры это делают с целью предотвращения большого количества возможного паразитного трафика в Ваш адрес, который нагружает их сетевое оборудование.
    Для работы во внешку Вам нужен внешний IP-адрес, не защищенный межсетевым экраном.

  • Александр Июн 17, 2017 в 10:14

    Так возможно у Вас скайп запущен. Он по умолчанию использует 80 порт. Нужно в дополнительных настройках отключить.

    • Заур Магомедов
      Заур Магомедов Июн 17, 2017 в 11:16

      Да, все верно. Тоже хотел сказать про Скайп.

  • Сергей Светлов Июн 16, 2017 в 3:06

    А если нет роутера и нет белого IT ? Реально ли настройть доступ к сайту извне? Использую OpenServer

    • Заур Магомедов
      Заур Магомедов Июн 16, 2017 в 11:49

      Без роутера тоже можно. Порт пробрасывать не нужно. Остальное все тоже самое.

    • Александр Июн 16, 2017 в 11:54

      Если нет статического АйПишника, то интересно как Вы достучитесь?

      • Заур Магомедов
        Заур Магомедов Июн 16, 2017 в 11:59

        Для этого я и предлагаю использовать сервис Noip.com

        • Александр Июн 16, 2017 в 12:39

          С этим сервисом не знаком.

        • Сергей Светлов Июн 16, 2017 в 13:15

          Я там уже зарегистрировался и всё сделал. Не понимаю как дальше настроить OpenServer и что делать если нет роутера. Можете подсказать?

          • Заур Магомедов
            Заур Магомедов Июн 16, 2017 в 13:23

            Вы статью почитайте внимательно, я там все расписал. Без роутера не делаете проброс и все.

            • Сергей Светлов Июн 17, 2017 в 3:00

              Я стаью всю прочитал, сделал как всё написано, без действий на роутере, но сайт в телефоне не открывается

              • Заур Магомедов
                Заур Магомедов Июн 17, 2017 в 3:09

                Алиас прописали в настройках опен сервер? Выбрали все доступные IP? Посмотрите в noip.com в настройках хоста правильно ли указан ваш внешний IP. Узнать внешний Ip можно на сайте 2ip.ru

                • Сергей Светлов Июн 17, 2017 в 3:19

                  Алиса прописан. Внешний IP указан правильно. В настройках My No-IP в настройках Device Configuration Assistant просит указать Router brand: и Software/device:, по идее роутера у меня нет. После этого шага в настройках Device Configuration Assistant проверяет не занят ли порт 80 и пишет, что чем-то занят, просит освободить его

Добавить комментарий

Войти с помощью: 

Ваш e-mail не будет опубликован. Обязательные поля помечены *

Если вы хотите вставить в текст комментария код HTML, CSS, PHP, JavaScript, то обрамите код в соответствии необходимыми тегами:

  • Код HTML - тегами [html] ваш код... [/html]
  • Код CSS - тегами [css] ваш код... [/css]
  • Код PHP - тегами [php] ваш код... [/php]
  • Код JavaScript - тегами [code lang="js"] ваш код... [/code]