Npm http server как запустить

Node.JS, NPM Package — Как запустить локальный сервер коммандой npm start?

Есть веб-страница, лежащая в папке «webdir».
Папка «webdir» находится в папке «server». В папке «server» через консоль был создан package.json файл (командой npm init ).
В ту же папку «server» был установлен http сервер (командой npm install http-server ). Теперь я могу зайти в консоле в папку «webdir» и командой npm node [директория к файлу bin, в моем случае: (. )/node_modules/http-server/bin] запустить локальный сервер и открыть мою веб-страницу в браузере по адресу localhost:8080 Вопрос: Как сделать так, чтобы, скачав NPM package с веб страницей и сервером, можно было запустить сервер (и увидеть сайт) одной командой — npm start ? Должен ли я создать в папке «server» JS файл с именем start.js, который будет вводить в консоль команду node (. )/node_modules/http-server/bin и открывать после этого страницу по адресу localhost:8080 ? Или это следует делать иначе? Только осваиваю NodeJS и NPM, буду благодарен за разъяснение.

Отслеживать
задан 12 авг 2016 в 14:21
1,075 2 2 золотых знака 17 17 серебряных знаков 33 33 бронзовых знака
12 авг 2016 в 14:24

@Grundy, спасибо, то есть я должен сначала установить http сервер, а потом прописать ту же комманду «node /node_modules/http-server/bin» при создании package.json файла, верно?

12 авг 2016 в 14:27

вообще, как именно должна выглядеть команда не могу сказать, но прописать ее надо в какое-то свойство scripts

Сервер

Для работы с сервером и протоколом http в Node.js используется модуль http.

Чтобы создать сервер, следует вызвать метод http.createServer() :

const http = require("http"); const server = http.createServer();

Метод createServer() возвращает объект http.Server . Для обработки подключений в метод createServer передается функция-обработчик:

const http = require("http"); const server = http.createServer(function(request, response)< response.end("Hello METANIT.COM!"); >);

Эта функция принимает два параметра:

• request : хранит информацию о запросе
• response : управляет отправкой ответа

В примере выше с помощью метода response.end() в ответ клиенту посылается строка «Hello METANIT.COM!».

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

const http = require("http"); const server = http.createServer(function(request, response)< response.end("Hello METANIT.COM!"); >); server.listen(3000);

В данном случае сервер запускается по адресу 3000. Также дополнительно можно передать в метод listen функцию, которая будет срабатывать при запуске сервера:

const http = require("http"); const server = http.createServer(function(request, response)< response.end("Hello METANIT.COM!"); >); server.listen(3000, function()< console.log("Сервер запущен по адресу http://localhost:3000")>);

Например, запустим приложение, и после успешного запуска мы увидим на консоли соответствующее сообщение:

c:\app> node app.js Сервер запущен по адресу http://localhost:3000

Поскольку сервер запущен на порту 3000, то мы можем обратиться к нашему приложению в браузере по адресу http://localhost: 3000

Request

Параметр request позволяет получить информацию о запросе и представляет объект http.IncomingMessage . Отметим некоторые основные свойства этого объекта:

• headers : возвращает заголовки запроса
• method : тип запроса (GET, POST, DELETE, PUT)
• url : представляет запрошенный адрес

Например, определим следующий файл app.js:

const http = require("http"); http.createServer(function(request, response)< console.log("Url:", request.url); console.log("Тип запроса:", request.method); console.log("User-Agent:", request.headers["user-agent"]); console.log("Все заголовки"); console.log(request.headers); response.end(); >).listen(3000, function()< console.log("Сервер запущен по адресу http://localhost:3000")>);

Запустим его и обратимся в браузере по адресу http://localhost:3000/ , и консоль выведет нам информацию о запросе:

c:\app> Сервер запущен по адресу http://localhost:3000 Url: / Тип запроса: GET User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36 Все заголовки < host: 'localhost:3000', connection: 'keep-alive', 'sec-ch-ua': '"Google Chrome";v="119", "Chromium";v="119", "Not?A_Brand";v="24"', 'sec-ch-ua-mobile': '?0', 'sec-ch-ua-platform': '"macOS"', 'upgrade-insecure-requests': '1', 'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/119.0.0.0 Safari/537.36', 'sec-purpose': 'prefetch;prerender', purpose: 'prefetch', accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/avif,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3;q=0.7', 'sec-fetch-site': 'none', 'sec-fetch-mode': 'navigate', 'sec-fetch-user': '?1', 'sec-fetch-dest': 'document', 'accept-encoding': 'gzip, deflate, br', 'accept-language': 'ru-RU,ru;q=0.9,en-US;q=0.8,en;q=0.7,fr;q=0.6,de;q=0.5,tr;q=0.4,zh-CN;q=0.3,zh;q=0.2,bg;q=0.1' >

Response

Параметр response управляет отправкой ответа и представляет объект http.ServerResponse . Среди его функциональности можно выделить следующие методы:

• statusCode : устанавливает статусный код ответа
• statusMessage : устанавливает сообщение, отправляемое вместе со статусным кодом
• setHeader(name, value) : добавляет в ответ один заголовок
• write : пишет в поток ответа некоторое содержимое
• writeHead : добавляет в ответ статусный код и набор заголовков
• end : сигнализирует серверу, что заголовки и тело ответа установлены, в итоге ответ отсылается клиента. Данный метод должен вызываться в каждом запросе.

В общем случае для отправки ответа достаточно вызвать метод end() , в который передаются отправляемые данные:

response.end("Hello METANIT.COM!");

С помощью метода write() можно кусками добавить данные в ответ. Например, изменим файл app.js следующим образом:

const http = require("http"); http.createServer(function(request, response)< response.write("Text 1\n"); response.write("Text 2\n"); response.end("End"); >).listen(3000, function()< console.log("Сервер запущен по адресу http://localhost:3000")>);

Запустим файл и обратимся в браузере к приложению:

Можно через end() ничего не добавлять в ответ, но в любом случае этот метод следует вызывать при отправке ответа:

const http = require("http"); http.createServer(function(_, response)< response.write("Text 1\n"); response.write("Text 2\n"); response.end(); >).listen(3000, function()< console.log("Сервер запущен по адресу http://localhost:3000")>);

Отправка заголовков

Метод setHeader() позволяет установить заголовки ответа:

const http = require("http"); http.createServer(function(_, response)< response.setHeader("UserId", 12); // установка кастомного заголовка response.setHeader("Content-Type", "text/html; charset=utf-8;"); response.write("
Привет мир
"); response.end(); >).listen(3000, function()< console.log("Сервер запущен по адресу http://localhost:3000")>);

В данном случае для теста устанавливаем кастомный заголовок «UserId», пусть он равен 12. А чтобы отправляемый ответ интерпретировался браузером как код html, для заголовка «Content-Type» устанавливаем значение «text/html; charset=utf-8;». Результат работы:

Маршрутизация

По умолчанию Node.js не имеет встроенной системы маршрутизации. Обычно она реализуется с помощью специальных фреймворков типа Express, о котором речь пойдет в следующей главе. Однако если необходимо разграничить простейшую обработку пары-тройки маршрутов, то вполне можно использовать для этого свойство url объекта Request. Например:

const http = require("http"); http.createServer(function(request, response)< response.setHeader("Content-Type", "text/html; charset=utf-8;"); if(request.url === "/home" || request.url === "/")< response.write("
Home
"); > else if(request.url == "/about")< response.write("
About
"); > else if(request.url == "/contact")< response.write("
Contacts
"); > else< response.write("
Not found
"); > response.end(); >).listen(3000);

В данном случае обрабатываются три маршрута. Если идет обрашение к корню сайта или по адресу localhost:3000/home , то пользователю выводится строка «Home». Ели обращение идет по адресу localhost:3000/about , то пользователю в браузере отображается строка About и так далее. Если запрошенный адрес не соответствует ни одному маршруту, то выводится заговлок «Not Found».

Однако опять же отмечу, что рамках специальных фреймворков, которые работают поверх Node.js, например, Express, есть более удобные способы для обработки маршрутов, которые нередко и используются.

Переадресация

Переадресация предполагает отправку статусного кода 301 (постоянная переадресация) или 302 (временная переадресация) и заголовка Location , который указывает на новый адрес. Например, выполним переадресацию с адреса localhost:3000/ на адрес localhost:3000/newpage

const http = require("http"); http.createServer(function(request, response) < response.setHeader("Content-Type", "text/html; charset=utf-8;"); if(request.url === "/")< response.statusCode = 302; // временная переадресация // на адрес localhost:3000/newpage response.setHeader("Location", "/newpage"); >else if(request.url == "/newpage") < response.write("New address"); >else < response.statusCode = 404; // адрес не найден response.write("Not Found"); >response.end(); >).listen(3000);

Npm http server как запустить

Этот сервер вы сможете установить после установки Node.js Http-server можно установить менеджером пакетов npm из пакета Node.js, а можно протестировать без установки с помощью утилиты npx.

Создайте папку для сервера, например www в своём рабочем каталоге, поместите туда файл favicon.ico и index.html. Http-server (веб-сервер) поддерживает структуру каталогов. Можно создать подпапки. Перейдите в папку www и запускайте сервер:

dior@debian:~/www$ npx http-server npx: установлен 27 в 6.113s Starting up http-server, serving ./ Available on: http://127.0.0.1:8080 http://192.168.1.12:8080 Hit CTRL-C to stop the server [2020-03-06T14:07:12.101Z] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" (node:457) [DEP0066] DeprecationWarning: OutgoingMessage.prototype._headers is deprecated [2020-03-06T14:07:12.173Z] "GET /css/main.css" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" [2020-03-06T14:07:12.183Z] "GET /js/flame.js" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" [2020-03-06T14:07:12.211Z] "GET /favicon.ico" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36"

Для экспериментов предлагаем наши файлы (пути указаны относительно папки www в которой запущен сервер):

   charset="utf-8" />  href="/css/main.css" rel="stylesheet" />   id="body"> Привет мир!  src="/js/flame.js" type="text/javascript">  

Важно: для этого сервера все относительные пути к файлам, указанным в html файле считаются относительными корня сервера (в нашем случае папка www).

body  font-size: 1000%;  text-align: center;  background-color: midnightblue;  color: moccasin;  text-shadow: red -6px 6px 8px; > 

i=0; style="color: #0664d5;">1; j=0; jd=1; k=0; kd=1; setInterval("animate()", 80); function animate()< body.style.textShadow = i+'px '+j+'px '+k+'px red' i=i+id; j=j+jd; k=k+kd; if (i>23) style="color: #0664d5;">1; if (i27) style="color: #0664d5;">1; if (j>19) jd=-1; if (j17) jd=1; if (k>31) kd=-1; if (k13) kd=1; >

И, вы в праве получить результат:

Установка сервера http-server:

sudo npm install -g http-server /usr/local/lib/nodejs/node-v12.16.1-linux-x64/bin/http-server -> /usr/local/lib/nodejs/node-v12.16.1-linux-x64/lib/node_modules/http-server/bin/http-server /usr/local/lib/nodejs/node-v12.16.1-linux-x64/bin/hs -> /usr/local/lib/nodejs/node-v12.16.1-linux-x64/lib/node_modules/http-server/bin/http-server + Адрес электронной почты защищен от спам-ботов. Для просмотра адреса в вашем браузере должен быть включен Javascript..1 added 27 packages from 35 contributors in 8.349s

Посмотрим параметры запуска этого веб-сервера:

http-server --help usage: http-server [path] [options] options: -p --port Port to use [8080] -a Address to use [0.0.0.0] -d Show directory listings [true] -i Display autoIndex [true] -g --gzip Serve gzip files when possible [false] -b --brotli Serve brotli files when possible [false] If both brotli and gzip are enabled, brotli takes precedence -e --ext Default file extension if none supplied [none] -s --silent Suppress log messages from output --cors[=headers] Enable CORS via the "Access-Control-Allow-Origin" header Optionally provide CORS headers list separated by commas -o [path] Open browser window after starting the server. Optionally provide a URL path to open the browser window to. -c Cache time (max-age) in seconds [3600], e.g. -c10 for 10 seconds. To disable caching, use -c-1. -t Connections timeout in seconds [120], e.g. -t60 for 1 minute. To disable timeout, use -t0 -U --utc Use UTC time format in log messages. --log-ip Enable logging of the client's IP address -P --proxy Fallback proxy if the request cannot be resolved. e.g.: http://someurl.com --username Username for basic authentication [none] Can also be specified with the env variable NODE_HTTP_SERVER_USERNAME --password Password for basic authentication [none] Can also be specified with the env variable NODE_HTTP_SERVER_PASSWORD -S --ssl Enable https. -C --cert Path to ssl cert file (default: cert.pem). -K --key Path to ssl key file (default: key.pem). -r --robots Respond to /robots.txt [User-agent: *\nDisallow: /] --no-dotfiles Do not show dotfiles -h --help Print this list and exit. -v --version Print the version and exit.

Запуск веб-сервера http-server из корневой папки сайта:

dior@debian:~/www$ http-server Starting up http-server, serving ./ Available on: http://127.0.0.1:8080 http://192.168.1.12:8080 Hit CTRL-C to stop the server [2020-03-06T14:20:07.027Z] "GET /" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" [2020-03-06T14:20:07.052Z] "GET /css/main.css" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" [2020-03-06T14:20:07.055Z] "GET /js/flame.js" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36" [2020-03-06T14:20:07.100Z] "GET /favicon.ico" "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/78.0.3904.108 YaBrowser/19.12.3.332 (beta) Yowser/2.5 Safari/537.36"

• Вы здесь:
• Главная
• Web
• Node.js http-server

• Фигуры Лиссажу
• Path2D на canvas
• Контуры на canvas
• Прямоугольники на canvas
• Canvas и context
• 2048 на JavaScript
• Mines v2 на JavaScript
• Игра flip-flop на JavaScript
• Игровое поле на JavaScript
• Игра Memory на JsavaScript
• Игра Где ест уж на JavaScript
• Mines на JavaScript
• Игра Быки и коровы на JavaScript
• Как установить пароль доступа к папке сайта
• Виртуальный хостинг в Apache
• SSL сертификат от freessl.org
• SSL сертификат от freessl.space
• Подсветка кода AVR Ассемблера
• Вставить в Joomla видео или код
• Цикл for.. in
• Лучше чем МЭШ
• JavaScript код
• JavaScript Объектная модель
• Язык JavaScript
• Метки в CMS Joomla
• Цветная подсветка примеров кода на сайте
• Php web-сервер
• Python http.server
• Node.js http-server
• Node.js статический web-сервер
• Busybox httpd web-сервер
• Установка Node.JS
• Joomla всплывающие картинки
• Лог файлы сервера Apache2
• Установка LAMP сервера на Armbian
• Apache установка модуля SSL
• Создаём самодельный SSL сертификат
• Установка SSL сертификата на сервер Apache 2
• SSL сертификат для HTTPS бесплатно
• Мой новый WEB server

• Author Login
• Карта сайта

© 2024 Системный интегратор

Запуск HTTP-сервера и выдача HTML-файла

Node не только содержит возможность обрабатывать JS-файлы, как мы только что сделали, он также может создать HTTP-сервер. Мы собираемся рассмотреть создание HTTP-сервера с Node-фреймворком Express для обработки HTML-файла.

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

Давайте придерживаться того же приложения, добавив фреймворк Express с выдачей HTML-файла. Нам понадобятся те же файлы (package.json, server.js) и к ним мы добавим новый файл index.html.

Express: Node-фреймворк

Одним из самых больших преимуществ Node является то, что он содержит поддержку множества пакетов. Сообщество отправляет много пакетов в npm и на момент написания в нём хранится 129257 пакетов, которые загрузили свыше 17694831 раз за последний день. Это большое достижение!

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

Вы, возможно, слышали о Grunt, Gulp или даже препроцессорах CSS вроде Less — всё это может быть пакетом.

Express — лёгкая платформа для создания веб-приложений с использованием Node.js. Express помогает организовать веб-приложение на стороне сервера. Сайт ExpressJS описывает его как «минимальной и гибкий Node-фреймворк для веб-приложений».

Express скрывает много внутренней работы Node, которая позволяет вам погрузиться в код приложения, получать всякие штуки и работать намного быстрее. Он прост для изучения и ещё даёт вам немного гибкости с его структурой.

Существует причина, почему в настоящее время это самый популярный фреймворк для Node. Вот несколько больших имён использующих Express:

Для просмотра полного списка зайдите на эту страницу.

Express поставляется с несколькими замечательными возможностями, которые добавят лёгкости в вашу разработку:

• маршрутизация;
• обработка запросов;
• настройки приложения;
• связующее программное обеспечение.

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

Установка Express

Пакеты для конкретного приложения Node определяются в package.json. Для получения установленных пакетов вы можете использовать один из двух методов:

• Метод 1: Написать пакет в package.json.
• Метод 2: В командной строке использовать npm install.

Мы собираемся использовать второй метод. Перейдите в командную строку и наберите:

$ npm install express --save

Модификатор —save сообщает npm, что он должен записать этот пакет в ваш файл package.json. Если вы выполните эту команду и посмотрите файл package.json, то заметите, что пакет появился в разделе dependencies. Вы также заметите, что была создана новая папка с именем node_modules. В ней Node хранит пакеты для конкретного проекта.

Меняться проектами между разработчиками и сотрудниками очень легко. Просто отправьте другим пользователям ваш проект и они запустят npm install чтобы установить всё из раздела dependencies.

Поскольку у нас уже есть Node и готов Express, используем их для создания HTTP-сервера и выдачи HTML-файла нашим пользователям.

Создание HTTP-сервера и отправка HTML-файла

Начнём с лёгкой части на нашем пути — с HTML-файла. В проекте создайте новый файл index.html и поместите внутрь следующее:

       body Моё приложение! 

// берём Express var express = require('express'); // создаём Express-приложение var app = express(); // создаём маршрут для главной страницы // http://localhost:8080/ app.get('/', function(req, res) < res.sendfile('index.html'); >); // запускаем сервер на порту 8080 app.listen(8080); // отправляем сообщение console.log('Сервер стартовал!');

$ nodemon server.js