статические файлы с express.js

213

Я хочу служить index.htmlи /mediaподкаталогом как статические файлы. Индексный файл должен обслуживаться как по адресу, так /index.htmlи по /URL.

у меня есть

web_server.use("/media", express.static(__dirname + '/media'));
web_server.use("/", express.static(__dirname));

но вторая строка, очевидно, обслуживает все __dirname, включая все файлы в нем (не только index.htmlи media), что я не хочу.

Я тоже пробовал

web_server.use("/", express.static(__dirname + '/index.html'));

но доступ к базовому URL /затем приводит к запросу web_server/index.html/index.html(двойной index.htmlкомпонент), который, конечно же, не выполняется.

Любые идеи?


Кстати, я не смог найти абсолютно никакой документации в Express по этой теме ( static()+ ее параметры) ... разочарование. Ссылка на документ также приветствуется.

user124114
источник
2
Начиная с Express 4.x, express.static()он обрабатывается serve-staticпромежуточным ПО пакета. вы можете найти его документы на npmjs.com/package/serve-static или github.com/expressjs/serve-static .
Anm
Может кто-нибудь объяснить, что означает "сервер как статические файлы"?
Абхи
@iLiveInAPineappleUnderTheSea В динамическом веб-приложении, например при использовании Express, содержимое страницы создается или генерируется приложением. С другой стороны, статические файлы обслуживаются (в основном) неизмененными из статической иерархии каталогов. Например, хотя страницы могут изменяться, файлы изображений, файлы CSS и файлы Javascript не изменяются.
Филипп Каллендер
проверьте ниже ссылку только 4ututorials.blogspot.com/2017/05/…
Декстер

Ответы:

100

express.static()ожидает, что первым параметром будет путь к каталогу, а не имя файла. Я бы предложил создать еще один подкаталог, содержащий ваш index.htmlи использовать его.

Обслуживание статических файлов в документации Express или более подробной serve-staticдокументации , включая поведение по умолчаниюindex.html :

По умолчанию этот модуль отправляет файлы «index.html» в ответ на запрос к каталогу. Чтобы отключить этот набор false или предоставить новый индекс, передайте строку или массив в предпочтительном порядке.

Абэ
источник
6
И просто для информации, он по умолчанию будет обслуживать index.html в этом другом каталоге
TheSteve0
Если есть только ОДИН параметр - тогда express.staticожидается, что один параметр будет path ....
Seti
188

Если у вас есть эта настройка

/app
   /public/index.html
   /media

Тогда это должно получить то, что вы хотели

var express = require('express');
//var server = express.createServer();
// express.createServer()  is deprecated. 
var server = express(); // better instead
server.configure(function(){
  server.use('/media', express.static(__dirname + '/media'));
  server.use(express.static(__dirname + '/public'));
});

server.listen(3000);

Трюк покидает эту линию как последний запасной вариант

  server.use(express.static(__dirname + '/public'));

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

Например, эта строка показывает, что index.html поддерживается https://github.com/senchalabs/connect/blob/2.3.3/lib/middleware/static.js#L140

250R
источник
15
Application.configure()был задокументирован как устаревший в 3.x и удален в 4.x. Смотрите ответ ChrisCantrell для обновленного примера.
Anm
Спасибо, это очень помогло
mdegges
что это __dirname? Какова его ценность?
Абхи
1
устаревший для последнего экспресса.
Джон Хитер
133

В новейшей версии Express «createServer» устарел. Этот пример работает для меня:

var express = require('express');
var app = express();
var path = require('path');

//app.use(express.static(__dirname)); // Current directory is root
app.use(express.static(path.join(__dirname, 'public'))); //  "public" off of current is root

app.listen(80);
console.log('Listening on port 80');
ChrisCantrell
источник
__dirname является ключевым словом?
Мохаммад Файзан хан
6
Это глобально в вашем модуле nodejs. nodejs.org/docs/latest/api/globals.html#globals_dirname
ChrisCantrell,
7
__dirname на самом деле не глобальный, а локальный для каждого модуля.
Мухаммед Файзан хан
2
это эквивалент в Python, __file__который вы используете сos.path.dirname(os.path.realpath(__file__))
Abdelouahab
@ChrisCantrell Как я могу добавить в статическую папку, если у меня есть файл в public/teams/logo.png?
Михал
37

res.sendFileи express.staticоба будут работать для этого

var express = require('express');
var app = express();
var path = require('path');
var public = path.join(__dirname, 'public');

// viewed at http://localhost:8080
app.get('/', function(req, res) {
    res.sendFile(path.join(public, 'index.html'));
});

app.use('/', express.static(public));

app.listen(8080);

Где publicнаходится папка, в которой находится код на стороне клиента

Как предложено на @ATOzTOA и осветляют @Vozzie , path.joinпринимает пути присоединиться в качестве аргументов, то +передает один аргумент в пути.

Мохаммед Замир
источник
2
path.joinпринимает пути для объединения в качестве аргументов, +передает единственный аргумент пути.
ATOzTOA
@ATOzTOA Можете ли вы объяснить больше, пожалуйста
Мохаммед Замир
Что @ATOzTOA говорит это , вы должны изменить path.join(public + 'index.html')в path.join(public, 'index.html')и в то время как у него, изменение __dirname + "/public/"вpath.join(__dirname, 'public')
Vozzie
Это помогло мне объединить статический сайт с API-интерфейсом все в одном
Джефф Бигли,
5
const path = require('path');

const express = require('express');

const app = new express();
app.use(express.static('/media'));

app.get('/', (req, res) => {
    res.sendFile(path.resolve(__dirname, 'media/page/', 'index.html'));
});

app.listen(4000, () => {
    console.log('App listening on port 4000')
})
rajmobiapp
источник
2

NPM установить служить индекс

var express    = require('express')
var serveIndex = require('serve-index')
var path = require('path')
var serveStatic = require('serve-static')
var app = express()
var port = process.env.PORT || 3000;
/**for files */
app.use(serveStatic(path.join(__dirname, 'public')));
/**for directory */
app.use('/', express.static('public'), serveIndex('public', {'icons': true}))

// Listen
app.listen(port,  function () {
  console.log('listening on port:',+ port );
})
Rejayi CS
источник
2

используйте ниже внутри вашего app.js

app.use(express.static('folderName'));

(имя_папки - это папка, в которой есть файлы) - помните, что доступ к этим ресурсам осуществляется напрямую через путь к серверу (то есть http: // localhost: 3000 / abc.png (где abc.png находится внутри папки имя_папки)

Pravin
источник