Express-js statik dosyalarımı GET edemiyor, neden?

Kodumu yapabileceğim en basit express-js uygulamasına indirdim:

var express = require("express"),
    app = express.createServer();
app.use(express.static(__dirname + '/styles'));
app.listen(3001);

Dizim şöyle:

static_file.js
/styles
  default.css

Yine de eriştiğimde http://localhost:3001/styles/default.cssşu hatayı alıyorum:

Cannot GET / styles /
default.css

Ben kullanıyorum express 2.3.3ve node 0.4.7. Neyi yanlış yapıyorum?

Deneyin http://localhost:3001/default.css.

Sahip olmak /stylesisteğiniz URL kullanımda:

app.use("/styles", express.static(__dirname + '/styles'));

Bu sayfadaki örneklere bakın :

//Serve static content for the app from the "public" directory in the application directory.

    // GET /style.css etc
    app.use(express.static(__dirname + '/public'));

// Mount the middleware at "/static" to serve static content only when their request path is prefixed with "/static".

    // GET /static/style.css etc.
    app.use('/static', express.static(__dirname + '/public'));

Aynı problemim var. Aşağıdaki kod ile sorunu çözdüm:

app.use('/img',express.static(path.join(__dirname, 'public/images')));
app.use('/js',express.static(path.join(__dirname, 'public/javascripts')));
app.use('/css',express.static(path.join(__dirname, 'public/stylesheets')));

Statik istek örneği:

http://pruebaexpress.lite.c9.io/js/socket.io.js

Daha basit bir çözüme ihtiyacım var. Var mı?

default.css müsait olmalı http://localhost:3001/default.css

stylesİçinde app.use(express.static(__dirname + '/styles'));sadece bakmak ifade söyler styleshizmet etmek statik dosya için dizine. Kullanılabilir olan yolun bir kısmını (kafa karıştırıcı bir şekilde) oluşturmaz.

Bu iş benim için:

app.use('*/css',express.static('public/css'));
app.use('*/js',express.static('public/js'));
app.use('*/images',express.static('public/images'));

Server.js dosyasında:

var express   =     require("express");
var app       =     express();
app.use(express.static(__dirname + '/public'));

Ekspres ve uygulamayı ayrı ayrı beyan ettiniz, 'genel' adında veya istediğiniz gibi bir klasör oluşturdunuz ve yine de bu klasöre erişebilirsiniz. Şablon src'nizde, / public'den (veya klasör kaderinizin adını statik dosyalara) göreli yolu eklediniz. Güzergahlardaki çubuklara dikkat edin.

Benim için işe yarayan:

app.use(express.static(__dirname + 'public/images'));App.js dosyanızda yazmak yerine

Basitçe yazın app.use(express.static('public/images'));

yani yoldaki kök dizin adını kaldırın. Ve sonra statik yolu diğer js dosyalarında etkili bir şekilde kullanabilirsiniz, Örneğin:

<img src="/images/misc/background.jpg">

Bu yardımcı olur umarım :)

Uygulamamda Bootstrap CSS, JS ve Fonts kullanıyorum. assetUygulamanın kök dizininde adlandırılan bir klasör oluşturdum ve tüm bu klasörleri içine yerleştirdim. Sonra sunucu dosyasına aşağıdaki satırı ekledi:

app.use("/asset",express.static("asset"));

Bu satır, assetdizindeki dosyaları aşağıdaki /assetgibi yol önekinden yüklememi sağlar http://localhost:3000/asset/css/bootstrap.min.css.

Şimdi görünümlerde ben sadece aşağıdaki gibi CSS ve JS dahil edebilirsiniz:

<link href="/asset/css/bootstrap.min.css" rel="stylesheet">

statik dosyaları (css, resimler, js dosyaları) sunmak için yalnızca iki adım yeterlidir:

1. css dosyalarının dizinini yerleşik middleware express.static'e geçirin

   var express = require('express');
   var app = express();
   /*public is folder in my project directory contains three folders
   css,image,js
   */
   //css  =>folder contains css file
   //image=>folder contains images
   //js   =>folder contains javascript files
   app.use(express.static( 'public/css'));

2. css dosyalarına veya görüntülerine erişmek için URL : http: // localhost: port / dosyaadı.css yazın : ex: http: // localhost: 8081 / bootstrap.css

not: css dosyalarını html'ye bağlamak için sadece yazın<link href="file_name.css" rel="stylesheet">

bu kodu yazarsam

var express = require('express');
var app = express();
app.use('/css',express.static( 'public/css'));

statik dosyalara erişmek için sadece url: localhost: port / css / dosyaadı.css yazın: http: // localhost: 8081 / css / bootstrap.css

css dosyalarını html ile bağlamak için not aşağıdaki satırı ekleyin

<link href="css/file_name.css" rel="stylesheet">    

bu benim için çalıştı

app.use(express.static(path.join(__dirname, 'public')));

app.use('/img',express.static(path.join(__dirname, 'public/images')));

app.use('/shopping-cart/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

app.use('/shopping-cart/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/stylesheets',express.static(path.join(__dirname, 'public/stylesheets')));

app.use('/user/javascripts',express.static(path.join(__dirname, 'public/javascripts')));

Http: // localhost: 3001 / default.css ile erişmeyi deneyin .

   app.use(express.static(__dirname + '/styles'));

Aslında ona klasör adını veriyorsunuz yani stilleri sizin suburl değil.

Css dosyamı bulup bir rota ekliyorum:

app.get('/css/MyCSS.css', function(req, res){
  res.sendFile(__dirname + '/public/css/MyCSS.css');
});

Sonra işe yarıyor gibi görünüyor.

Yukarıdakilere ek olarak, ana dizinin (/ main) üzerindeki herhangi bir dizinde statik dosyalar sunmak için statik dosya yolunun / (ex ... / asset / css) ... ile başladığından emin olun.

eğer kurulumun

myApp
  |
  |__ public
  |     |
  |     |__  stylesheets
  |     |     |
  |     |     |__ style.css
  |     |
  |     |___ img
  |           |
  |           |__ logo.png
  |
  |__ app.js

sonra
app.js yazın

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

ve style.css dosyasına bakın: (bazı .pug dosyalarında):

link(rel='stylesheet', href='/static/stylesheets/style.css')

1. Nodejs proje
   klasöründe 'genel' adlı bir klasör oluşturun .
2. İndex.html dosyasını Nodejs proje klasörüne yerleştirin.
3. Tüm komut dosyasını ve css dosyasını ortak klasöre koyun.

4. kullanım app.use( express.static('public'));

5. ve index.html komut dosyalarının doğru yolunda<script type="text/javascript" src="/javasrc/example.js"></script>

Ve şimdi her şey yolunda gidiyor.

statik dizin

dir yapısı için yukarıdaki görüntüyü (statik dizin) kontrol edin

const publicDirectoryPath = path.join(__dirname,'../public')
app.use(express.static(publicDirectoryPath))


//  or

app.use("/", express.static(publicDirectoryPath))
app.use((req, res, next) => {
res.sendFile(path.join(publicDirectoryPath,'index.html'))