Express-js non può OTTENERE i miei file statici, perché?

Ho ridotto il mio codice alla semplice app express-js che potevo realizzare:

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

La mia directory è simile a questa:

static_file.js
/styles
  default.css

Tuttavia quando accedo http://localhost:3001/styles/default.cssottengo il seguente errore:

Cannot GET / styles /
default.css

Sto usando express 2.3.3e node 0.4.7. Che cosa sto facendo di sbagliato?

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

Per avere /stylesnell'URL della richiesta, utilizzare:

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

Guarda gli esempi in questa pagina :

//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'));

Ho lo stesso problema. Ho risolto il problema con il seguente codice:

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')));

Esempio di richiesta statica:

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

Ho bisogno di una soluzione più semplice. Esiste?

default.css dovrebbe essere disponibile all'indirizzo http://localhost:3001/default.css

In stylesin app.use(express.static(__dirname + '/styles'));dice a express di cercare nella stylesdirectory un file statico da servire. Non confonde, quindi, fa parte del percorso su cui è disponibile.

Questo lavoro per me:

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

Nel tuo server.js:

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

Hai dichiarato express e app separatamente, hai creato una cartella denominata "pubblica" o come preferisci, eppure puoi accedere a queste cartelle. Nel tuo template src, hai aggiunto il percorso relativo da / public (o il nome del destino della tua cartella ai file statici). Fai attenzione alle barre sui percorsi.

Ciò che ha funzionato per me è:

Invece di scrivere app.use(express.static(__dirname + 'public/images'));nel tuo app.js

Basta scrivere app.use(express.static('public/images'));

vale a dire rimuovere il nome della directory principale nel percorso. E quindi puoi utilizzare efficacemente il percorso statico in altri file js, ad esempio:

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

Spero che questo ti aiuti :)

Sto usando Bootstrap CSS, JS e Fonts nella mia applicazione. Ho creato una cartella chiamata assetnella directory principale dell'app e ho inserito tutte queste cartelle al suo interno. Quindi nel file del server è stata aggiunta la seguente riga:

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

Questa linea mi permette di caricare i file che si trovano nella assetdirectory dal /assetprefisso del percorso come: http://localhost:3000/asset/css/bootstrap.min.css.

Ora nelle viste posso semplicemente includere CSS e JS come di seguito:

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

per servire file statici (css, immagini, file js) solo due passaggi:

1. passa la directory dei file css al middleware express.static integrato

   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. per accedere ai file CSS o alle immagini basta digitare l'URL http: // localhost: port / filename.css ex: http: // localhost: 8081 / bootstrap.css

nota: per collegare i file CSS a HTML basta digitare<link href="file_name.css" rel="stylesheet">

se scrivo questo codice

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

per accedere ai file statici basta digitare url: localhost: port / css / nomefile ex: http: // localhost: 8081 / css / bootstrap.css

nota per collegare i file CSS con HTML basta aggiungere la seguente riga

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

questo ha funzionato per me

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')));

Prova ad accedervi con http: // localhost: 3001 / default.css .

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

In realtà gli stai dando il nome della cartella, cioè gli stili non il tuo suburl.

Trovo il mio file CSS e aggiungo un percorso ad esso:

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

Quindi sembra funzionare.

Oltre a quanto sopra, assicurati che il percorso del file statico inizi con / (ex ... / assets / css) ... per servire i file statici in qualsiasi directory sopra la directory principale (/ main)

se la tua configurazione

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

quindi,
inserisci app.js

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

e fai riferimento a style.css: (in alcuni file .pug):

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

1. Creare una cartella con nome "pubblico" nella
   cartella del progetto Nodejs .
2. Inserisci il file index.html nella cartella del progetto Nodejs.
3. Metti tutti i file script e css nella cartella pubblica.

4. Uso app.use( express.static('public'));

5. e nel index.html percorso corretto degli script a<script type="text/javascript" src="/javasrc/example.js"></script>

E ora tutto funziona bene.

directory statica

controlla l'immagine sopra (directory statica) per la struttura dir

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'))