Как открыть localhost на телефоне
Перейти к содержимому

Как открыть localhost на телефоне

  • автор:

Как открыть в мобильном браузере сайт на localhost?

Есть проект на node.js, запущен он у меня на localhost:3000 , можно ли как-то открыть его через мобильный браузер? Нужно отдебажить, в эмуляторах отлично всё работает, а на реальном устройстве — нет.

  • Вопрос задан более трёх лет назад
  • 15451 просмотр

Комментировать
Решения вопроса 0
Ответы на вопрос 4
вероятно, повесив свою поделку на реальный адрес в сети, а не на локалхост
Ответ написан более трёх лет назад
Нравится 3 1 комментарий
TypicalBully @TypicalBully

Как разжечь костер без зажигалки, вероятно, найти зажигалку. Как открыть дверь без ключа, вероятно, найти ключ. это и многое другое вы найдете в фонде гениальных советов.

Поиск Гугл помог мне, впусти и ты его в свой дом
Ответ написан более трёх лет назад
Комментировать
Нравится Комментировать

sim3x

Если у тебя на ноуте / пк поднята точка, через которую заходит твой телефон
То берешь ип своего вайфай и открываешь его на мобильнике
Запускать свой проект на ноде, нужно будет не на локалхосте, а на ип своего вайфая stackoverflow.com/questions/31572332/run-local-ser.
ну или 0.0.0.0 (но тогда его будет видно и в сети провайдера)

Ответ написан более трёх лет назад
Комментировать
Нравится Комментировать
Программист на «си с крестами» и не только

Если мобильное устройство не использует прокси-браузер (Opera Mini и прочие) и висит на той же радиоточке, что и стационарник — 1) настраиваем радиоточку так, чтобы с WiFi-клиентов был доступ в локальную сеть; 2) поднимаем на стационарном компьютере веб-сервер. Доступ — http://192.168.1.2:3000/site , внутренний IP-адрес компьютера можно узнать программой ipconfig; порт (3000) определяется настройками веб-сервера.

Если либо используется прокси-браузер, либо смартфон в интернете через ОпСоСа, надо поднять веб-сервер и сделать, чтобы он был виден из интернета. Либо залить на хостинг, либо пробросить порт на маршрутизаторе. Доступ — http://12.34.56.78:3000/site , внешний IP-адрес можно узнать через 2ip.ru. Порт (3000) зависит от настройки перенаправления портов, и для безопасности его крайне нежелательно делать стандартными 80, 3128 и 8080.

Как пробросить порт на маршрутизаторе — гуглите уж сами; состоит из двух вещей: как зафиксировать IP и как вбить в NAT новое правило перенаправления.

Create a local server configuration

In the local server configuration, you do your development, then copy the sources to the server.

A local server is a server that is running in a local or a mounted folder and whose document root is NOT the parent of the project root.

To configure access to the server in this set-up, you need to specify the following:

  1. The server configuration root folder and the URL address to access it.
  2. Correspondence between the project root folder , the folder on the server to copy the data from the project root folder to, and the URL address to access the copied data on the server. This correspondence is called mapping .

Before you start, make sure the web server is configured and running. For more information, refer to the web server official documentation.

  1. Press Control+Alt+S to open the IDE settings and then select Build, Execution, Deployment | Deployment . Alternatively, go to Tools | Deployment | Configuration. .
  2. The left-hand pane of the Connection tab, that opens, lists all the existing server configurations. Click and select Local or mounted folder from the list. In the Create new server dialog that opens, type the name of the new server and click OK to return to the Connection tab.
  3. Specify the server configuration root and the URL address to access it.
    1. In the Folder field, specify the server configuration root . The server configuration root is the highest folder in the file tree on the server that can be accessed through the server configuration. The easiest way is to use the document root of your server as defined in the server configuration file. However, you can appoint any other existing folder under the document root .
    2. In the Web server URL field, specify the URL address of the server configuration root . This URL address will be the starting point for building the URL address of your application. Depending on your choice of the server configuration root , do one of the following:
      • Type the URL address associated with the document root of your server as defined in the server configuration file.
      • Type the URL address in the following format: /

    Both the HTTP and the HTTPS protocols are supported.

Specify the server configuration root and the URL address to access it

  • Map project folders to folders on the server and the URL addresses to access them. In the Mappings tab, set correspondence between the project folders, the folders on the server to copy project files to, and the URL addresses to access the copied data on the server.
    1. In the Local Path field, specify the full path to the desired local folder. In the simplest case it is the project root.
    2. In the Deployment Path field, specify the folder on the server where WebStorm will upload the data from the folder specified in the Local Path field. Type the path to the folder relative to the server configuration root . If the folder with the specified name does not exist yet, WebStorm will create it, provided that you have selected the Create Empty directories checkbox in the Options dialog. For more information, refer to Customize upload and download.
    3. In the Web Path field, type the path to the folder on the server relative to the server configuration root . Actually, type the relative path you typed in the Deployment Path field.

    Map project folders to folders on the server and the URL addresses to access them

  • Optionally

    In the Connection tab, mark the server configuration as default and configure its visibility.

    1. Click on the toolbar to have WebStorm silently apply the current configuration in the following cases:
      • Automatic upload of changed files.
      • Manual upload and download of files without choosing the target host.
      • Comparing local files and folders with their remote versions.
      • Editing individual files on remote hosts.

    You can also click the Default Deployment Server widget in the WebStorm status bar and select the desired server or server group from the popup menu.

    Selecting a default deployment server in WebStorm status bar

  • Use the Visible only for this project checkbox to configure the visibility of the server access configuration.
    • Select the checkbox to restrict the use of the configuration to the current project. Such configuration cannot be reused outside the current project. It does not appear in the list of available configurations in other projects. The server records are stored in the .idea directory together with the project, which allows sharing them between team members through a VCS. In the server access configurations list in the left-hand pane, the configurations visible only in the current project are marked with the icon.
    • When the checkbox is cleared, the configuration is visible in all WebStorm projects. Its settings can be reused across several projects.
  • Example of specifying a server configuration root

    For example, the server’s default document root is the htdocs folder, and the default URL address to access the data is http://localhost . Let’s suppose that you are using the XAMPP package and it is installed in the root of the C:/ drive.

    If you decide to copy your project files directly under the server document root , your server configuration root will be C:\xampp\htdocs and its URL will be http://localhost: .

    You can establish a more complicated folder structure on the server, for example, to have MySite1 and MySite2 folders under the server document root . In this case, you will have to decide which of these folders you will use in the current configuration, let it be MySite2 . Accordingly, the server configuration root will be C:\xampp\htdocs\MySite2 and its URL address will be http://localhost:\MySite2 .

    Example of mapping project folders with folders on the server

    For example, if your project is located under C:\My_Projects\Mapping_project , the server document root is C:\xampp\htdocs , the server configuration root is C:\xampp\htdocs\MySite2 , and its URL address is http://localhost:\MySite2 , fill in the fields as follows:

    1. In the Local Path field, type C:\My_Projects\Mapping_project .
    2. In the Deployment Path field, type MySite2 .
    3. In the Web Path field, type MySite2 .

    Как настроить локальный сервер для тестирования?

    Эта статья объясняет как установить простой локальный тестовый сервер на вашем компьютере, а так же основы его использования.

    Требования: Сначала вам необходимо изучить как работает интернет, а также что такое веб-сервер (en-US) .
    Цель: Вы научитесь как устанавливать локальный тестовый сервер.

    Локальные и удалённые файлы

    На протяжении всего обучения, вы будете открывать примеры непосредственно в браузере — двойным кликом по HTML файлу, перетаскиванием файла в окно браузера, или через меню File > Open. и указывая необходимый HTML файл. Существует множество способов как это сделать.

    Если веб-адрес начинается с file:// в котором далее прописан путь к файлу на вашем локальном жёстком диске, значит используется локальный файл. В противоположность этому, если вы откроете на просмотр один из наших примеров, расположенных на GitHub (или пример расположенный на любом другом удалённом сервере), веб-адрес будет начинаться с http:// или https:// , что означает что файл был получен через HTTP.

    Проблемы тестирования локальных файлов

    Некоторые примеры могут не запуститься, если вы попробуете открыть их как локальные файлы. Это может произойти по нескольким причинам, самые распространённые из которых:

    • Они содержат асинхронные запросы. Некоторые браузеры (включая Chrome) не будут запускать асинхронные запросы (см. Fetching data from the server), если вы просто запускаете пример из локального файла. Это связано с ограничениями безопасности (для получения дополнительной информации о безопасности в Интернете, ознакомьтесь с Website security).
    • Они имеют серверный язык. Серверные языки (например, PHP или Python) требуют специального сервера для интерпретации кода и предоставления результатов.

    Запуск простого локального HTTP сервера

    Чтобы обойти проблему асинхронных запросов, нам нужно протестировать такие примеры, запустив их через локальный веб-сервер. Один из самых простых способов сделать это для наших целей — использовать модуль SimpleHTTPServer Python.

    Для этого нужно:

    1. Установить Python. Если вы пользуетесь Linux или Mac OS X, всё уже готово в вашей системе. Если вы пользователь Windows, вы можете скачать установочный файл с домашней страницы Python:
      • Зайдите на python.org
      • В секции загрузок, выберите линк для Python «3.xxx».
      • Внизу страницы выберите Windows x86 executable installer и скачайте его.
      • После загрузки файла запустите его.
      • На первой странице инсталлятора выберите чекбокс «Add Python 3.xxx to PATH».
      • Нажмите Install, затем нажмите Close когда установка закончится.
    2. Откройте командную строку (Windows)/ (OS X/Linux). Для проверки установки Python введите следующую команду:

    # include the directory name to enter it, for example cd Desktop # use two dots to jump up one directory level if you need to cd .. 
    # If Python version returned above is 3.X python -m http.server # If Python version returned above is 2.X python -m SimpleHTTPServer 

    Примечание: . Если у вас уже есть что-то на порту 8000, вы можете выбрать другой порт, запустив команду сервера, за которой следует альтернативный номер порта, например: python -m http.server 7800 (Python 3.x) или python -m SimpleHTTPServer 7800 (Python 2.x). Затем вы можете получить доступ к своему контенту на localhost: 7800 .

    Запуск серверных языков локально

    Модуль Python SimpleHTTPServer (python 2.0) http.server (python 3.0) полезен, но он не знает, как запускать код, написанный на таких языках, как Python, PHP или JavaScript. Чтобы справиться с этим, вам понадобится нечто большее — именно то, что вам нужно, зависит от языка сервера, который вы пытаетесь запустить. Вот несколько примеров:

    • Для запуска кода на стороне сервера Python вам необходимо использовать веб-инфраструктуру Python. Вы можете узнать, как использовать структуру Django, прочитав Django Web Framework (Python). Flask также является хорошей (чуть менее тяжёлой) альтернативой Django. Чтобы запустить это, ознакомьтесь с install Python/PIP, а затем установите Flask с помощью pip3 install flask . На этом этапе вы сможете запустить примеры Python Flask, используя, например, python3 python-example.py , затем перейдя на localhost: 5000 в свой браузер.
    • Чтобы запустить серверный код Node.js (JavaScript), вам нужно использовать Node.js или фреймворк, построенный поверх него. Express — хороший выбор — см. Express Web Framework (Node.js/JavaScript).
    • Чтобы запустить PHP-серверный код, вам понадобится настройка сервера, которая может интерпретировать PHP. Хорошими вариантами для локального тестирования PHP являются MAMP (Mac и Windows), AMPPS (Mac, Windows, Linux) и LAMP (Linux, Apache, MySQL и PHP / Python / Perl). Это полные пакеты, которые создают локальные настройки, позволяющие запускать базы данных Apache, PHP и MySQL.

    Found a content problem with this page?

    • Edit the page on GitHub.
    • Report the content issue.
    • View the source on GitHub.

    This page was last modified on 3 авг. 2023 г. by MDN contributors.

    Статья Делаем локальный сайт (на localhost) доступным для других компьютеров

    Эта статья для тех, у кого есть сайт на локальном сервере и кто хочет сделать его доступным с других компьютеров. Кстати, если у вас ещё нет локального сервера, то вы с лёгкостью его поставите по этой инструкции. Подразумевается, что ваш сервер установлен по указанной инструкции, если это не так, то файлы могут находится в других директориях.

    • внутри квартиры (всегда);
    • внутри локальной домашней сети (почти всегда);
    • для всех пользователей Интернета (не всегда).

    Разница в вероятностях (всегда-иногда) заключается в вашем IP. Если он статический, то всё делается довольно легко. Как делать локальный сервер при динамическом IP в этой статье не описывается.

    Внутри своей квартиры вы сами задаёте политику присвоения адресов — например, Wi-Fi роутер может раздавать устройствам произвольные, динамические IP адреса; и можно настроить роутер и устройства так, что всем им будут присвоены определённые статические адреса.

    Домашние локальные сети, как правило, организовываются региональными провайдерами. Внутри этих сетей все пользователи, обычно, имеют два IP: один — локальный (статический, который пользователь вписывает при настройки комьпютера или сетевого оборудования) второй — динамический который присваивается при доступе в Интернет.

    Локальные адреса, в основном, имеют такой вид (вместо нулей должны быть другие цифры):

    172.16.0.0 192.168.0.0

    Открываем файл C:ServerbinApache24confhttpd.conf и ищем там строчку

    Listen 127.0.0.1:80

    Нам нужно заменить IP адрес на свой, например, мой локальный IP адрес 192.168.43.90, следовательно, я пишу:

    Listen 192.168.43.90:80

    Как вариант, можно сделать вот так:

    Listen *:80

    Сохраняем файл и перезапускаем сервер. На самом деле — всё!

    Пробуем доступ к серверу набрав в строке браузера свой IP (я набираю http://192.168.43.90/ ), как и следовало ожидать — доступа нет, но причина очевидна: файервол. Его нужно настроить должным образом, но для нашего тестирования я его просто отключаю.

    28467

    Теперь всё впорядке и ваш сайт доступен по адресу http://192.168.43.90/ с любого устройства, находящегося в вашей домашней или городской сети. На следующем скриншоте, я зашёл на локальный сервер с телефона:

    28468

    24 часа в сутки

    Если у вас статичный IP для интернет соединений (у некоторых Интернет провайдеров можно подключить эту услугу за отдельные деньги), то вы можете сделать из своего компьютера самый настоящий хостинг-сервер! Понятное дело, что компьютер должен быть включен 24 часа в сутки, иначе на ваш сайт невозможно будет попасть.

    Внутри локальной (домашней) сети вы можете придумать имя своему сайту и попросить ваших друзей и всех тех, кто будет заходить на него внести изменения в файл
    C:WindowsSystem32Driversetchosts
    Каждому из них нужно будет добавить туда строчку:
    ваш_IP ваш_сайт
    например
    192.168.43.90 alexblog.local
    После этого набирая в адресной строке браузера http://alexblog.local они будут попадать на ваш сайт.

    Зачем все эти сложности?

    Открытие доступа к локальному серверу может быть полезным по ряду причин, правда, обычно они довольно специфические. Те, кто этим занимаются, знают для чего они это делают. Сейчас, когда не нужно платить за трафик (но нужно платить за электричество), гораздо разумнее разместить свой сайт (доступ к которому вы хотите открыть для всех) на хостинге.

    Ссылка скрыта от гостей

    Более того, открывая доступ к своему localhost нужно подумать о безопасности. В данной статье я этот вопрос не затрагиваю, но могу вас заверить, что Apache, запущенный от имени администратора (а именно так он у большинства на локахосте и запущен), через скрипты PHP (или уязвимости в них), может «путешествовать» по каталогам дисков. Т.е., по крайне мере теоретически, злоумышленник через уязвимости в вашем сайте может скачать файлы с вашего компьютера или удалить файлы, например, в директории Windows. Если заботиться о безопасности локального сервера является слишком сложным занятием для вас, то ответ очевиден — хостинг.

    Ссылка скрыта от гостей

    , которые бывают на хостингах и самая низкая цена!

    Хотите узнать, как заполучить короткий и красивый адрес электронной почты (e-mail)? или как выбрать качественный хостинг? Всё это и многое другое на сайте codeby.net. Подписывайтесь на нашу e-mail рассылку (внизу страницы) или на ленту новостей и вы узнаете первым о новых статьях! Также вступайте в нашу официальную группу вконтакте — там вам очень рады!

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

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