2013-08-10 14 views
10

Chcę użyć pliku statycznego służyć bez żadnego silnika renderującego. Próbowałem użyć:res.sendfile() nie obsługuje dobrze javascripts

res.sendfile('public/index.html'); 

na trasie '/' Get, i wyrazić middleware dla statycznych plików na moim szlaku:

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

ALE wydaje się, że wszystkie JavaSkrypty o które prosi klient, są pobierane z informacjami o pliku index.html.

Jak mogę skutecznie pobrać pliki statyczne CSS/JS?

UPDATE:

Oto droga do "res.sendfile ...":

app.get('/*', index); 

chcę wszystkie żądania do serwera, na każdej trasie i dostanie index.html wszystkie jego JS & CSS przypisane z.

+0

Jeśli chcesz służyć tylko pliki statyczne, nie używasz oprogramowania pośredniczącego routera, to proste :) W rzeczywistości nie ma nawet potrzeby korzystania z Expressu w tym celu. – gustavohenke

+0

, więc jak mogę to zrobić, jeśli chcę renderować plik index.html, który zawiera js? – ohadinho

+0

https://npmjs.org/package/http-server – gustavohenke

Odpowiedz

-1

Zrobiłem tu założenie, że trasy są zadeklarowane w tej kolejności:

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

Jeśli tak jest w istocie, to posiada następujące sugestie:

Tutaj problemem jest to aplikacja .get ('/ *', ...) przechwyci wszystkie zapytania, które pasują, czyli w zasadzie wszystko. Twoje statyczne oprogramowanie pośrednie nie będzie miało szans na dostarczenie plików.

Jeśli usuniesz tę trasę, rzeczy powinny działać, ponieważ index.html jest już w katalogu public i może być obsługiwane przez statyczne oprogramowanie pośredniczące.

Dla dobrego wyjaśnienia, jak to działa, zobacz odpowiedź na to pytanie: node.js/express.js - How does app.router work?

Aktualizacja oparta na dodatkach do powyższego pytania:

pan stwierdził to jako bieżącego zachowania Twój serwer:

Wygląda na to, że wszystkie javascripts, o które prosi klient, są pobierane z informacjami o pliku index.html.

pan zadał pytanie:

Jak mogę zrobić udane pobieranie CSS/JS plików statycznych?

tego wymogu

chcę wszystkie żądania do serwera, na dowolnej trasie dostanie index.html i wszystkich jego JS & CSS assosiciated z.

Twoje pytanie i wymóg są ze sobą przeciwstawne. Serwer odeśle klientowi dokładnie to, co powiesz/skonfigurujesz. Zawsze albo odeśle index.html, co jest dokładnie tym, o czym mówi twoje wymaganie, albo z powodzeniem obsłuży zarówno index.html, jak i dowolny odnośnik CSS/Javascript, do którego odnosi się, co było oryginalnym stwierdzeniem problemu.

W jednym z komentarzy poniżej pan stwierdził:

powodem chcę to zrobić, dlatego używam szablonów, a index.html zawija każdy szablon. Używam kątowego na kliencie i zaczynam rozumieć, że będę musiał użyć silnika renderującego, aby to osiągnąć. Ponownie, mój kanciasty klient określa częściowy adres URL, a kiedy wysyła żądanie do: „/ częściowy/próbka” Muszę index.html zawinąć „sample.html” na przykład

Moje założenia oparte na to oświadczenie (popraw jeśli źle)

  • używasz stronie klienta szablony
  • pliki pobierasz z serwera są statyczne (czyli muszą być serwowane jak z serwer)
  • Twoje trasy są obecnie zadeklarowane w tej kolejności
    1. app.use (app.router);
    2. app.use (express.static (path.join (__ dirname, "public")));
  • nie robią żadnej stronie serwera templating (czyli wszystko znajduje się pod public gdzieś)

Jeśli te założenia są prawidłowe, poprawka jest robić to, co pierwotnie sugerowano i usunąć tę trasę:

app.get('/*', index); 

Jeśli zrobisz to (zakładając, że zasoby są prawidłowo odwoływać):

  • Twoja index.html zostanie pobrana z serwera za pośrednictwem statycznego oprogramowania pośredniego.
  • Każdy css/js plik już wymieniony w index.html zostaną zwrócone z serwera za pomocą statycznego middleware
  • Wszelkie prośby, aby załadować pliki szablonów (takie jak sample.html) będą obsługiwane przez statyczną middeware i wrócił do klient bez modyfikacji
+0

Cóż, to zależy od tego, w którym miejscu skryptu znajduje się 'app.use (app.router);'. – deitch

+0

Chociaż się zgadzam; Nie jestem pewien, dlaczego chciałbyś zrobić 'res.sendfile (" public/index.html ")' ponieważ jest * już * w publicznej ścieżce. – deitch

+0

@Dodaj dobry punkt. Założyłem przypuszczenie, że może nie być tutaj ważne. Więcej opublikowanych kodów zdecydowanie pomoże zdiagnozować problem. – dc5

17

myślę, że to może pomóc ...

w app.js pliku ...

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

app.use("/styles", express.static(__dirname + '/public/stylesheets')); 
app.use("/scripts", express.static(__dirname + '/public/javascripts')); 
app.use("/images", express.static(__dirname + '/public/images')); 


// development only 
if ('development' == app.get('env')) { 
    app.use(express.errorHandler()); 
} 

app.get('/', function (req, res) { 
     res.sendfile(__dirname + '/public/home.html'); 
}); 

zapisz home.html w folderze /public i pliki JavaScript w /public/javascripts, obrazy w /public/images, pliki css w folderze /public/stylesheets.

W nawiązaniu plik HTML powinny być słowa, które definiują (np:/scripts /home.js) ... jak ten

<link rel="stylesheet" type="text/css" href="/styles/home.css" > 
    <script src="/scripts/home.js" type="text/javascript"></script> 
+0

Dzięki. Mi to pasuje. – MageXellos

0

Dlaczego nie coś takiego?

if(req.url == '/') { // Root lookups appear to be mapped to index.html 
    next(); 
} else { 
    fname = [disk location of your website] + req.url; 
    fs.open(fname, 'r', function(err, fd) { 
     if(err) { 
      next(); 
     } else { 
      fs.close(fd); 
      res.sendfile(fname); 
     } 
    }); 
} 
1
var express=require("express"); 

var app=express(); 

app.use('/', express.static(__dirname + '/website/views/')); 


app.set("views",__dirname+'/website/views'); 


app.get("/",function(req,res){ 
    res.sendfile('index.html'); 

}); 

powyższe kody jest mine.i chcą pomóc.

+0

Proszę podać wyjaśnienie kodu. Odpowiedzi tylko na kod nie są mile widziane. –

0

Cóż, najprostszym rozwiązaniem będzie poruszać app.use(express.static(path.join(__dirname, 'public')))

się przed wywołaniem app.use(app.router);

ten sposób statyczny middleware serwowane dostaje przed app.get('/*', index);