Mam aplikację, która obsługuje html i wygląda tak.

// ... 
var staticPath = config.development.staticFiles;
app.get('/category/:catName', function(req, res) {
    res.sendFile(path.join(__dirname, staticPath + "shop-grid.html"));
})

app.get('/', function(req, res) {
    res.sendFile(path.join(__dirname, staticPath + "index.html"));
})  
// ...

W każdym html, css są połączone w ten sposób.

<link rel="stylesheet" href="css/style.css" type="text/css">

Plik index.html działa dobrze, ale „shop-grid.html” nie ładuje się z css, ponieważ próbował załadować css pod adresem „localhost: 8080 / category /css/style.css ”zamiast„ localhost: 8080 / css / style.css ”, co działa z pierwszym kodem HTML.

Co tu zrobiłem źle?

0
Anh Tuấn Phạm 1 wrzesień 2020, 12:00

2 odpowiedzi

Najlepsza odpowiedź

Martwi mnie, dlaczego zmieniono ścieżkę względną? Pliki HTML znajdują się w tym samym katalogu, zmieniany jest tylko adres URL.

Przeglądarka nie wie nic o tym, jak zapisałeś pliki na serwerze.

Wie tylko o adresach URL.

css/style.css to ścieżka względna .

Ścieżki względne są rozwiązywane przez pobranie adresu URL bieżącej strony, usunięcie wszystkiego po ostatnim / w ścieżce, a następnie dołączenie ścieżki względnej.

http://localhost:8080/ + css/style.css = http://localhost:8080/css/style.css

http://localhost:8080/category/cats + css/style.css = http://localhost:8080/category/css/style.css


Użyj ścieżki bezwzględnej : /css/style.css.

Ścieżki bezwzględne są rozwiązywane przez usunięcie całej ścieżki (tj. Wszystkiego po nazwie hosta i (jeśli istnieje) numerze portu), a następnie dołączenie ścieżki bezwzględnej.

2
Quentin 1 wrzesień 2020, 09:20

Przekierowujesz oba przypadki i dlatego zmieniasz swój _dirname. ale kiedy ładujesz shop-grid.html, przekierowujesz całkowicie do innego katalogu. ścieżka href nie jest globalna, jest to ścieżka względna.

0
jaSnom 1 wrzesień 2020, 09:16