樣式表使用node.js與錯誤的MIME類型一起發送，我該如何解決？

的node.js /快遞代碼樣式表使用node.js與錯誤的MIME類型一起發送，我該如何解決？

var express = require('express'), 
    app = express(), 
    port = process.env.PORT || 3000, 
    path = require('path'); 


app.use('/public', function (req, res) { 
    res.sendfile(path.join(__dirname + '/public/index.html')); 
}); 

app.use('/', function (req, res) { 
    var data = '<h1>hello world</h1>'; 

    res.writeHead(200, {'Content-Type': 'text/html'}); 
    res.end(data) 
}); 

app.listen(port); 

console.log('server started at port %s ', port);

HTML

<!DOCTYPE html> 
<html lang="de"> 
    <head> 
    <meta charset="utf-8"> 
    <title>MME2 U1</title> 

    <link rel="stylesheet" type="text/css" href="css/app.css"> 
    <script src="js/app.js" type="text/javascript"></script> 

    </head> 
    <body> 
    <div class="wrap"> 
     <header> 
     <h1>Multimedia Engeneering 2</h1> 
     <h2>Übung 1</h2> 
     </header> 
     <div class="main"> 
     <div class="content"> 
      <section id="video1"> 
      <h3>WebM</h3> 

      <video id="vid1" controls> 
       <source src=vid/small_WebM.webm type=video/webm> 
      </video> 

      <div id="buttons"> 
       <button id="playVid1">▶</button> 
       <button id="stopVid1">▇</button> 
      </div> 
      </section> 

      <section id="video2"> 
      <h3>Ogg Vorbis</h3> 
      <video id="vid2" controls> 
       <source src=vid/small_Ogg.ogv type=video/ogg> 
      </video> 
      <div id="buttons"> 
       <button id="playVid2">▶</button> 
       <button id="stopVid2">▇</button> 
      </div> 
      </section> 

      <section id="video3"> 
      <h3>Mp4</h3> 
      <video id="vid3" controls> 
       <source src=vid/small_mp4.mp4 type=video/mp4> 
      </video> 
      <div id="buttons"> 
       <button id="playVid3">▶</button> 
       <button id="stopVid3">▇</button> 
      </div> 
      </section> 
     </div> 

     <div class="side"> 
      <ul> 
      <li><a href="#video1">Video 1</a></li> 
      <li><a href="#video2">Video 2</a></li> 
      <li><a href="#video3">Video 3</a></li> 
      </ul> 
     </div> 
     </div> 

     <footer> 
     <p>Lena Meßmer, Sophie Wirth</p> 
     </footer> 
    </div> 
    </body> 
</html>

CSS代碼

html, body{ 
    margin: 0; 
    padding: 0; 
    font-family: Arial, Helvetica, sans-serif; 
} 

.wrap { 
    margin: 0 auto; 
} 

header{ 
    background: url(http://media.giphy.com/media/S3bkh4BuHMyfC/giphy.gif); 
    padding: 1%; 
    border-bottom: 3px solid #C9469A; 
} 

.main { 
    width: 100%; 
    margin: 0 auto; 
    display: flex; 
    flex-direction: row; 
    flex-wrap: nowrap; 
    justify-content: flex-start; 
    align-content: stretch; 
    align-items: flex-start; 
    align-self: stretch; 
} 

.content { 
    background: #fff; 
    padding: 1%; 
    order: 0; 
    flex: 4 1 auto; 
    align-self: auto; 
} 

.side { 
    background: #FF91BA; 
    padding: 1%; 
    order: 0; 
    flex: 2 1 auto; 
    align-self: stretch; 
    border-left: 12px solid #7F587C; 

    color: #7F587C; 
} 

.side a { 
    color: #7F587C; 
    font-weight: bold; 
    text-decoration: none; 
} 

.side li { 
    margin: 3%; 
} 

section{ 
    margin: 3%; 
} 

footer { 
    width: 98%; 
    background: #202020; 
    padding: 1%; 
    border-top: 3px solid #28b1b6; 
    color: #939393; 
} 

.clearfix:after { 
    content: "."; 
    clear: both; 
    display: block; 
    visibility: hidden; 
    height: 0px; 
} 

h1, h2, h3{ 
    margin: 0; 
} 

h1 { 
    color: #fff; 
} 

h2 { 
    color: #fff; 
    font-style: italic; 
} 

h3 { 
    color: #3c3c3c; 
    width: 50%; 
    border-bottom: 2px dashed #C9469A; 
    margin-bottom: 1%; 
}

htaccess的

AddType text/css .css 
AddType text/javascript .js

Node.js的代碼是在根目錄，th e html和css在/ public subdir中。每當我加載我得到的一面：資源解釋爲樣式表，但與MIME類型文本/ HTML傳輸：「http://localhost:3000/css/app.css」。

我該如何解決這個問題？

來源

2015-10-29 Ozymandias

var express = require('express'), 
    app = express(), 
    port = process.env.PORT || 3000, 
    path = require('path'); 

app.use('/public', express.static('public')); 
app.use('/', function (req, res) { 
    res.sendfile(path.join(__dirname + '/index.html')); 
}); 
app.listen(port); 

console.log('Server started at http://localhost:%s/', port);

所以我重寫了我的代碼，就像這樣，並且工作。只有當我使用express.static作爲公共子網址時，它纔會發生變化。

來源

2015-11-02 10:12:50 Ozymandias

樣式表使用node.js與錯誤的MIME類型一起發送，我該如何解決？

回答

相關問題