Использование node.js в качестве простого веб-сервера - PullRequest
Новая
       21

Использование node.js в качестве простого веб-сервера

1041 голосов
/ 22 мая 2011

Я хочу запустить очень простой HTTP-сервер.Каждый запрос GET к example.com должен обслуживаться index.html, но как обычная HTML-страница (то есть, как при чтении обычных веб-страниц).

Используя приведенный ниже код, я могу прочитатьсодержание index.html.Как мне обслуживать index.html как обычную веб-страницу? 

var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');

http.createServer(function (req, res) {
  res.writeHead(200, {'Content-Type': 'text/plain'});
  res.end(index);
}).listen(9615);

Одно из предложений, приведенных ниже, является сложным и требует от меня написать строку get для каждого ресурса (CSS, JavaScript, изображения)файл, который я хочу использовать.

Как я могу обслуживать одну HTML-страницу с некоторыми изображениями, CSS и JavaScript?

Ответы [ 30 ]

12 голосов
/ 23 февраля 2017

если на вашем компьютере установлен узел, возможно, у вас есть NPM, если вам не нужны NodeJS, вы можете использовать пакет serve для этого:

1 - Установите пакет на свой ПК: 

npm install -g serve

2 - обслуживать вашу статическую папку: 

serve <path> 
d:> serve d:\StaticSite

Он покажет вам, какой порт обслуживает ваша статическая папка, просто перейдите к хосту, как: 

http://localhost:3000
9 голосов
/ 08 июня 2014

Я нашел интересную библиотеку на npm, которая может быть вам полезна. Он называется MIME (npm install mime или https://github.com/broofa/node-mime)) и может определять тип MIME для файла. Вот пример веб-сервера, который я написал, используя его: 

var mime = require("mime"),http = require("http"),fs = require("fs");
http.createServer(function (req, resp) {
path  = unescape(__dirname + req.url)
var code = 200
 if(fs.existsSync(path)) {
    if(fs.lstatSync(path).isDirectory()) {
        if(fs.existsSync(path+"index.html")) {
        path += "index.html"
        } else {
            code = 403
            resp.writeHead(code, {"Content-Type": "text/plain"});
            resp.end(code+" "+http.STATUS_CODES[code]+" "+req.url);
        }
    }
    resp.writeHead(code, {"Content-Type": mime.lookup(path)})
    fs.readFile(path, function (e, r) {
    resp.end(r);

})
} else {
    code = 404
    resp.writeHead(code, {"Content-Type":"text/plain"});
    resp.end(code+" "+http.STATUS_CODES[code]+" "+req.url);
}
console.log("GET "+code+" "+http.STATUS_CODES[code]+" "+req.url)
}).listen(9000,"localhost");
console.log("Listening at http://localhost:9000")

Это будет служить для любого обычного текстового или графического файла (.html, .css, .js, .pdf, .jpg, .png, .m4a и .mp3 - это расширения, которые я тестировал, но теоретически он должен работать за все)

Примечания разработчика

Вот пример вывода, который я получил с ним: 

Listening at http://localhost:9000
GET 200 OK /cloud
GET 404 Not Found /cloud/favicon.ico
GET 200 OK /cloud/icon.png
GET 200 OK /
GET 200 OK /501.png
GET 200 OK /cloud/manifest.json
GET 200 OK /config.log
GET 200 OK /export1.png
GET 200 OK /Chrome3DGlasses.pdf
GET 200 OK /cloud
GET 200 OK /-1
GET 200 OK /Delta-Vs_for_inner_Solar_System.svg

Обратите внимание на функцию unescape в построении пути. Это позволяет использовать имена файлов с пробелами и закодированными символами.

8 голосов
/ 03 февраля 2016

Для этого я в первую очередь должен установить статический сервер узла глобально через 

npm install node-static -g

затем перейдите в каталог, содержащий ваши html-файлы, и запустите статический сервер с static.

Перейдите в браузер и введите localhost:8080/"yourHtmlFile".

8 голосов
/ 22 мая 2011

Редактировать:

Пример приложения Node.js Узловый чат обладает нужной вам функциональностью.
В нем README.textfile
3. Шагэто то, что вы ищете.

step1

  • Создайте сервер, который отвечает с приветом на порт 8002

step2

  • создайте index.html и обслужите его

step3

  • представьте util.js
  • измените логику так, чтобы любая статическаяфайл обслуживается
  • показать 404, если файл не найден

step4

  • добавить jquery-1.4.2.js
  • добавьте client.js
  • , измените index.html, чтобы запросить у пользователя псевдоним

Вот server.js

Здесь util.js

7 голосов
/ 30 декабря 2014 
var http = require('http');
var fs = require('fs');
var index = fs.readFileSync('index.html');

http.createServer(function (req, res) {
    res.writeHead(200, {'Content-Type': 'text/html'});
    // change the to 'text/plain' to 'text/html' it will work as your index page
    res.end(index);
}).listen(9615);

Я думаю, вы искали это.В вашем index.html просто заполните его обычным HTML-кодом - что бы вы ни хотели сделать, например: 

<html>
    <h1>Hello world</h1>
</html>
7 голосов
/ 17 июня 2014

В основном копирует принятый ответ, но избегает создания файла js. 

$ node
> var connect = require('connect'); connect().use(static('.')).listen(8000);

Нашли это очень удобно.

Обновление

Начиная с последней версии Express, serve-static стал отдельным промежуточным программным обеспечением. Используйте это, чтобы служить: 

require('http').createServer(require('serve-static')('.')).listen(3000)

Сначала установите serve-static.

5 голосов
/ 30 августа 2015

Я не уверен, что это именно то, что вы хотели, однако, вы можете попробовать изменить: 

{'Content-Type': 'text/plain'}

к этому: 

{'Content-Type': 'text/html'}

Это позволит клиенту браузера отображать файл в формате html вместо простого текста.

5 голосов
/ 24 марта 2014

Я использую приведенный ниже код для запуска простого веб-сервера, который отображает html-файл по умолчанию, если в URL не указан ни один файл. 

var http = require('http'),
fs = require('fs'),
url = require('url'),
rootFolder = '/views/',
defaultFileName = '/views/5 Tips on improving Programming Logic   Geek Files.htm';


http.createServer(function(req, res){

    var fileName = url.parse(req.url).pathname;
    // If no file name in Url, use default file name
    fileName = (fileName == "/") ? defaultFileName : rootFolder + fileName;

    fs.readFile(__dirname + decodeURIComponent(fileName), 'binary',function(err, content){
        if (content != null && content != '' ){
            res.writeHead(200,{'Content-Length':content.length});
            res.write(content);
        }
        res.end();
    });

}).listen(8800);

Он будет отображать все файлы js, css и изображения вместе со всем html-содержимым.

Согласен с утверждением " Нет типа контента лучше, чем неправильный "

4 голосов
/ 03 августа 2015

Сумасшедшее количество сложных ответов здесь. Если вы не собираетесь обрабатывать файлы / базы данных nodeJS, а просто хотите использовать статические html / css / js / images в соответствии с вашим вопросом, просто установите модуль pushstate-server или аналогичный;

Вот «один вкладыш», который создаст и запустит мини-сайт. Просто вставьте весь этот блок в свой терминал в соответствующую директорию. 

mkdir mysite; \
cd mysite; \
npm install pushstate-server --save; \
mkdir app; \
touch app/index.html; \
echo '<h1>Hello World</h1>' > app/index.html; \
touch server.js; \
echo "var server = require('pushstate-server');server.start({ port: 3000, directory: './app' });" > server.js; \
node server.js

Откройте браузер и перейдите к http://localhost:3000. Готово.

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

4 голосов
/ 06 мая 2019

Вы можете просто ввести их в свою оболочку 

npx serve

Репо: https://github.com/zeit/serve.

Страница:
...