Как можно посмотреть локальный сайт на моем компе через телефон?

Question

[Дмитрий Аствафьев]

Создаю сайт, требуется посмотреть как выглядит сайт на телефоне, можно ли как то это реализовать, без использования хостинга ?
Через Wi-Fi роутер или еще как то...

Answer 1

[Alexander]

UPD: в 2023 году я бы всё же использовал ngrok.

Ставим npm и browser-sync: https://www.browsersync.io/

Запускаем локальный сервер (у меня Openserver), открываем консоль в локальной папке, где лежит ваш сайт и запускаем в ней browser-sync с опцией --proxy

browser-sync start --proxy mylocal.dev

browser-sync выдаст в консоль что-то такое:

[BS] Proxying: http://local.dev.domain
[BS] Access URLs:
 ------------------------------------
 Local: http://localhost:3002
 External: http://192.168.1.6:3002
 ------------------------------------
 UI: http://localhost:3003
 UI External: http://192.168.1.6:3003
 ------------------------------------

Вам нужен тот что External - http://192.168.1.6:3002, вбиваете его на телефоне и смотрите (естественно телефон должен быть подключен к той же сети, куда подключен и ПК).
Вот только что проверил с сайтом на Wordpress - работает.

Answer 2

[Stalker_RED]

Поднимаете вебсервер на компьютере, настраиваете чтобы он слушал запросы из локальной сети, с телефона подключаетесь к нему.

Comments

[Дмитрий Аствафьев]

это типа через openserver или denver и настроить как то нужно ?

[Stalker_RED]

Дмитрий Аствафьев, типа того. Честно говоря никогда не пользовался openserver'ом, и denwer лет 10 не запускал. Вполне вероятно, что ваш сервер по умолчанию слушает только запросы с localhost, нужно будет поменять что там в listen прописано и дать соответствующие разрешения в фаерволле, если он есть.

[Дмитрий Аствафьев]

Stalker_RED, все равно ничего не понял =(

[Stalker_RED]

Дмитрий Аствафьев, начнем с основ. У вас вообще есть вебсервер?

[Дмитрий Аствафьев]

Stalker_RED, denver

[ProTreo]

Зайди в настройки роутера и узнай ip мобилы и локального компа

Если ОС - винда и работает денвер на 127.0.0.1:80 я бы попробовал вот что:

Узнал ip компа, выданные dhcp сервером, в данном случае роутером.
К примеру ip компа 192.168.0.100

Мобиле выдается ip из той же сетки, к примеру 192.168.0.101 - это не принципиально.

На винде открываешь консоль от админа и вводишь туда вот это:
netsh interface portproxy add v4tov4 listenaddress=192.168.0.100 listenport=80 connectaddress=127.0.0.1 connectport=80

После этого на мобиле в браузере вводишь 192.168.0.100 и должен открыться сайт.

По крайней мере тут ничего лишнего качать не нужно

[DivoTech]

ProTreo, спасибо за инструкцию.
В моём случае ещё потребовалось дополнительно создать правило для входящего подключения (тип -- для порта) в Мониторе брандмауэра Защитника Windows

Answer 3

[Alexandr Alexandrov]

Можете воспользоваться сервисами:

• https://localtunnel.github.io/www/
  
• https://mobile1st.com/local-testing/
  
• https://ngrok.com/download
  

Можете настроить через вифи:

• www.mobitechie.com/android-2/how-to-access-localho...
  

Можете поднять виртуальную машину:

• https://www.genymotion.com/fun-zone/
  
• https://developer.android.com/studio/run/emulator-...
  

Comments

[Дмитрий Аствафьев]

А на ios нет, не пойдет это: ?

Можете настроить через вифи:
www.mobitechie.com/android-2/how-to-access-localho...

[Alexandr Alexandrov]

• https://stackoverflow.com/a/3132120/7124221
  
• https://stackoverflow.com/questions/12657651/conne...
  

По аналогии, в поиске, можно найти и на ios.

Answer 4

[Владимир Скибин]

Если у Вас организована сеть дома/в офисе через wifi-роутер, то телефон и компьютер находятся в одной подсети. Соответственно, чтобы "зайти" с телефона на разрабатываемый сайт и его проверить нужно понять как у Вас он поднят на компьютере.
Если у Вас сайт поднимается по адресу 192.168.1.2:8000 - т.е. по IP+порт, то можете этот же адрес спокойно вбивать в смарт и открыть желанный сайт. 192.168.1.2 - в данном случае это IP адрес компьютера, который выдал роутер для него.
Если у Вас Denwer/OpenServer и сайт поднимается по доменному имени (mysite.local, site.localdomain, etc), то телефону нужно сказать, что при открытии такого URL он стучался куда надо. Для этого, если у Вас на роутере есть возможность вбить статические IP адреса для DNS - то вбиваете туда домен и указываете адрес локальной машины. Если такой возможности нет, то можно для Вашего мобильного устройства скачать приложение локального DNS сервиса (android) и в нем уже указать тотде домен и IP, что и для метода с роутером.

Comments

[Дмитрий Аствафьев]

сайт доступен через localhost

[Владимир Скибин]

Дмитрий Аствафьев, а по IP ?

[Дмитрий Аствафьев]

Владимир Скибин, 127.0.0.1 в denwer"е так.

[Владимир Скибин]

Дмитрий Аствафьев, С локальной машины если открыть 127.0.0.1 - открывается то что нужно? Также, если в адресную строку вставить IP адрес, который выдается Вам роутером - открывается то что нужно?

[Дмитрий Аствафьев]

Владимир Скибин, через ip не работает. то есть не открывается.

Answer 5

[Дмитрий]

Можно использовать функционал браузера "Адаптивный дизайн". В случае если идет авто определение устройства, просто жестко поставить выводить только мобильную версию