Как открыть localhost в браузере

Настройка локального сервера

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

Локальный сервер на Windows

Включаем Internet Information Service(IIS)

1. Щелкните [Программы] в [Панель управления].

Добавляем файлы в локальный сервер.

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

В [Мой компьютер] откройте [Локальный диск C:].

Заходим на локальный сервер через браузер

1. Откройте ваш браузер.
2. Введите в адрессной строке:
   http:///Папка проекта/
   или
   http:///Папка проекта/
   или
   http://localhost/Папка проекта/

Узнаём имя компьютера

1. Щелкните правой кнопкой мыши по [Мой компьютер], выберите [Свойства].

Узнаём ваш IP адресс

1. Щелкните [View network status and tasks] in the [Control Panel].

Настраиваем localhost

*Как правило, уже настроено.

Для доступа к серверу по http://localhost/ в браузере, вам нужно настройть «hosts» файл.

Откройте [Пуск], Выберите [Все программы], [Стандартные]. Щелкните правой кнопкой мыши по [Блокнот] и выберите [Запустить от Администратора].

# 127.0.0.1 localhost

127.0.0.1 localhost

Настройка локального сервера на Mac OSX

Для создания локального сервера в Mac используется Apache(Апач), который как правило, уже установлен в системе.

Базовые команды Apache

Команды водятся в Терминале.

Запускаем Apache

$ sudo apachectl start

Останавливаем Apache

$ sudo apachectl stop

Устанавливайем файлы на сервер

Скопируйте папку проекта в папку по следующему пути:

/Library/WebServer/Documents П.п: проверить на русской локали.

Играем через браузер

1. Откройте ваш браузер.
2. Введите в адресную строку и подтвердите:
   http://localhost/ИмяПапкиПроекта/

Начало работы с помощью кнопки Запустить проект

Используйте это руководство, чтобы узнать, как открыть и закрыть средства разработки, нажав кнопку Запустить проект , чтобы запустить демонстрацию на веб-сервере localhost и сохранить URL-адрес веб-страницы в launch.json .

Мы будем использовать демонстрационное приложение для демонстрации кнопки Запустить проект после указания этой кнопки на URL-адрес localhost, например http://localhost:8080 . Кнопка Запустить проект запускает средства разработки в режиме отладки. Это main способ открыть средства разработки, когда веб-страница должна работать на веб-сервере. В качестве предварительного шага мы создадим launch.json файл и изменим URL-адрес в нем, чтобы он указывал на localhost, обслуживающий пример приложения demo-to-do .

Вам не всегда нужно использовать этот подход, так как во многих случаях щелчок ПРАВОй кнопкой мыши HTML-файла работает. Однако многие веб-страницы используют API, для которых веб-страница должна выполняться на веб-сервере, поэтому ниже приведены конкретные действия, которые можно выполнить.

Шаг 1. Установка средств разработки и необходимых компонентов

1. Если вы еще этого не сделали, выполните действия, описанные в разделе Установка расширения DevTools для Visual Studio Code, а затем выполните следующие действия.

Шаг 2. Запуск веб-сервера

В этом разделе поддерживается нажатие кнопки Запустить проект .

В этих шагах объясняется, как запустить HTTP-сервер с помощью кроссплатформенной оболочки Git Bash, которая является частью Git. Хотя для запуска сервера можно использовать Visual Studio Code >View>Terminal, лучше запустить сервер из командной строки, которая находится за пределами Visual Studio Code, чтобы сервер оставался запущенным даже при закрытии и повторном открытии Visual Studio Code или папки.

1. Если вы еще этого не сделали, настройте и запустите веб-сервер в первый раз, обслуживая приложение demo-to-do из репозитория Demos. Для этого см. шаг 6. Настройка сервера localhostстатьи Установка расширения DevTools для Visual Studio Code.
2. Откройте git bash. Например, в Windows нажмите кнопку Пуск и введите git bash.
3. cd в определенную папку, которую вы хотите обслужить через http, Demos\demo-to-do\ : В git bash используйте косую черту для путей к файлам. Например:

cd C:/Users/username/Documents/GitHub/Demos/demo-to-do 

npx http-server 

Отображаются сведения о сервере и URL-адресе localhost, например:

Starting up http-server, serving ./ Available on: http://10.0.1.8:8080 http://127.0.0.1:8080 Hit CTRL-C to stop the server 

Шаг 3. Настройка launch.json

В этом разделе поддерживается нажатие кнопки Запустить проект .

1. В Visual Studio Code выберите Файл>Открыть папку. Выберите каталог проекта, содержащий index.html клонируемый пример демонстрации в репозитории Демонстрации, например C:\Users\username\Documents\GitHub\Demos\demo-to-do\ . Как и в папке demo-to-do репозитория, изначально в ней нет .vscode ни папки, ни launch.json файла.
2. На панели действий щелкните Инструменты Microsoft Edge (). Откроется панель Средства Microsoft Edge .
3. Нажмите кнопку Создать launch.json : Откроется новый launch.json файл.
4. В нескольких местах файла launch.json на каждой из «url» строк прокрутите вправо и обратите внимание на комментарий «Укажите URL-адрес проекта»:

"url": "c:\\Users\\username\\.vscode\\extensions\\ms-edgedevtools.vscode-edge-devtools-2.1.1\\out\\startpage\\index.html", // Provide your project's url to finish configuring 

"url": "http://localhost:8080", // Provide your project's url to finish configuring 

Шаг 4. Нажмите кнопку Запустить проект

1. В Visual Studio Code на панели действий нажмите кнопку Средства Microsoft Edge (). Откроется панель Средства Microsoft Edge , содержащая кнопку Запустить проект , но не кнопку Создать файл launch.json :
2. Нажмите кнопку Запустить проект . Вкладки Edge DevTools и Edge DevTools: Browser открываются в отдельных панелях, где отображается веб-приложение demo-to-do :

На этом этапе можно работать с изменениями CSS или пошагово выполнять код в отладчике. Ознакомьтесь с разделами учебника Начало работы, щелкнув правой кнопкой мыши HTML-файл:

• Шаг 4. Изменение CSS в средствах разработки, автоматическое обновление CSS-файла
• Шаг 5. Пошаговое выполнение кода JavaScript в отладчике

Шаг 5. Закрытие средств разработки

Чтобы завершить отладку и закрыть вкладки Edge DevTools :

1. На панели инструментов Отладка нажмите кнопку Остановить (SHIFT+F5): Или в меню Выполнить выберите Остановить отладку. Или закройте две вкладки Средства разработки. Закрывается панель инструментов Отладка.

• Закрытие средств разработки в открывании средств разработки и в браузере DevTools.

Вы завершили работу с руководством «Начало работы с помощью кнопки Запустить проект». Рекомендуется также выполнить другие руководства. См. статью Начало работы с расширением DevTools для Visual Studio Code.

См. также

• Открытие средств разработки и браузера DevTools
• Расширение Средств разработки Microsoft Edge для Visual Studio Code

Github:

• demo-to-do — демонстрационного веб-приложения, работающего на сервере github.io .
• Исходный код для демонстрации
• Репозиторий MicrosoftEdge/Demos

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

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

Требования:	Сначала вам необходимо изучить как работает интернет, а также что такое веб-сервер (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

Если вы хотите перейти на http://localhost, то воспользуйтесь быстрыми ссылками для входа:

• http://localhost
• http://localhost:8080
• http://localhost:8081
• http://localhost/phpmyadmin
• http://localhost/WordPress
• http://localhost:3000
• http://localhost/php
• http://localhost/index
• http://localhost/index.php
• http://localhost/server
• http://localhost/bonfire

Что такое localhost

localhost — это универсальное имя хоста, которое всегда указывает на этот же самый компьютер. Точнее говоря, это имя указывает на IP адрес 127.0.0.1, а данный IP уже является специальным адресом, всегда принадлежащий локальному компьютеру.

Если открыть адрес http://localhost в веб-браузере, то будет выполнено подключение к локальному веб-серверу. По этой причине localhost обычно ассоциируется с веб-сервером, но на самом деле localhost можно использоваться самыми разными сетевыми службами: программами для обмены данными между собой, MySQL, SSH, FTP и пр.

Вы можете даже пинговать localhost:

ping localhost

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

Про loopback будет чуть ниже — на случай, если вам интересна теория, а сейчас рассмотрим, почему не работает localhost.

Как включить localhost

Возможно вы и так знали, что localhost это локальный веб-сервер, но при попытке открыть

http://localhost у вас возникает ошибка, например такая:

Не удается получить доступ к сайту

Сайт localhost не позволяет установить соединение.

Попробуйте сделать следующее:

Проверьте подключение к Интернету.

Проверьте настройки прокси-сервера и брандмауэра.

ERR_CONNECTION_REFUSED

Причин может быть несколько, самая популярная — вы просто не установили веб-сервер. Если это действительно так, то переходите к инструкции «Как установить веб-сервер Apache c PHP, MySQL и phpMyAdmin на Windows».

После завершения указанной инструкции localhost заработает!

Веб-сервер установлен, но localhost не открывается

В этом случае причины могут быть следующие:

• веб-сервер установлен, но его служба не запущена (особенно если раньше работало, а после перезагрузки перестало работать) — вернитесь к инструкции по установке, запустите службу веб-сервера и добавьте её в автозагрузку;
• неправильно настроены права доступа в веб-сервере, либо ошибка в конфигурации — вернитесь к настройке веб-сервера или переустановите его.

127.0.0.1

127.0.0.1 — это специальный IP адрес, который имеет loopback интерфейс. В любой операционной системе имеется поддержка 127.0.0.1, поскольку этот специальный IP описан в протоколе.

Суть работы 127.0.0.1 (а следовательно и localhost, который является именем для указания на этот IP) состоит в том, что пакет, отправленный на адрес 127.0.0.1 на самом деле никуда не отправляется, но при этом система начинает считать, что этот пакет пришёл из сети. То есть образно можно представить так: пакет отправляется на сетевую карту компьютера, там разворачивается и возвращается с сетевой карты обратно в компьютер.

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

http://localhost:8080

Чтобы подключиться к localhost на 8080 порту перейдите по ссылке http://localhost:8080

localhost php

Чтобы использовать PHP на своём компьютере нужно установить веб-сервер. Пошаговую инструкцию смотрите в статье «Как установить веб-сервер Apache c PHP, MySQL и phpMyAdmin на Windows».

localhost phpmyadmin

Аналогично, для получения phpMyAdmin установите веб-сервер.

localhost error

Ошибки могут возникнуть в случае неправильной установки веб-сервера или приложений. Смотрите «Ошибки при настройке и установке Apache, PHP, MySQL/MariaDB, phpMyAdmin».

Связанные статьи:

• Apache для Windows (100%)
• Как запустить Apache на Windows (100%)
• Документация по Apache на русском языке (100%)
• Как подключить PHP к Apache на Windows (100%)
• Как подключить MySQL к Apache на Windows (100%)
• Как запустить два экземпляра Apache (RANDOM — 100%)