使用express提供公共靜態檔案

我試圖讓我的快遞從我的公用檔案夾中提供檔案，但我似乎無法在這里作業。我在我的檔案路徑中嘗試了很多變體，但我似乎無法讓 pug 與 node.js 合作。我至少可以從索引中看到 html，但 css 和音樂檔案都不想加載。是的，我看過許多與我類似的問題。我仍然無法確定為什么它不起作用。請幫忙。

我在開發工具中收到這些錯誤拒絕應用來自“http://localhost:3000/public/music.css”的樣式，因為它的 MIME 型別（“text/html”）不是受支持的樣式表 MIME 型別，并且嚴格的 MIME 檢查已啟用。GET http://localhost:3000/public/Music/Pink_Floyd/WishYouWereHere/ShineOnYouCrazyDiamond(PartsI-V).mp3 404（未找到）

我的檔案結構是這樣的：

js

-server.js

上市

-Music

--artist

---album

----musicfiles.mp3 

-music.css 

意見

 -index.pug

我的 node.js 代碼：

var jsmediatags = require('jsmediatags');
var express= require('express');
var app=express();
var pug=require('pug');
const path=require('path')
const fs=require('fs');
const { error } = require('console');
var tagsArray=Array();

const port=3000;
const host='localhost';

app.use('/public', express.static(path.join(__dirname, 'public')))
app.set('views','./views');
app.set('view engine', 'pug');

const server =app.listen(port, host, ()=>{

  console.log("server started at " host " port:" port);

  
});

process.on('SIGTERM', () => {
  server.close(() => {
    console.log('Process terminated')
  })
})


jsmediatags.read("./public/Music/Pink_Floyd/WishYouWereHere/ShineOnYouCrazyDiamond(PartsI-V).mp3", {
  onSuccess: function(tag) {

    
    var tags=tag.tags;
    tagsArray=[tags.artist,tags.track,tags.album,tags.title,tags.picture];
    var artist=tags.artist;
    var album=tags.album;
    var title=tags.title;
    var track=tags.track;
   
      var base64Url=Buffer.from(tags.picture.data).toString("base64");

    // var base64Url=Buffer.from(base64String).toString("base64");
    var artInfo="data:" tags.picture.format ";base64," base64Url;
    
    console.log(`data:${tags.picture.format};base64,`);

    app.get('/', (req, res)=>{

      res.render("index", {
        artist:tags.artist,
        album: tags.album,
        title: tags.title,
        track: tags.track,
        art: artInfo
        
      });
      console.log('done');
    });


  },
  onError: function(error) {
    console.log(':(', error.type, error.info);
  }
});

我的哈巴狗代碼：

html(lang="en")
    head
        meta(charset='UTF-8')
        meta(http-equiv='X-UA-Compatible' content='IE=edge')
        meta(name='viewport' content='width=device-width, initial-scale=1.0')
        title Music App
        link(rel='stylesheet' type='text/css' href='/public/music.css')
    body
        img#albumC(src=art alt='album art')
        .playbox
            .play
            .reflect
            .playRef
        .pausebox
            .pause
                .PA.center
                .PB.center
            .reflect
            .pause
                .PAref.center
                .PBref.center
        .stopbox
            .stop
            .reflect
            .stopRef
        h2 Artist: #{artist}
        h2 Album: #{album}
        h2 Song: #{title}
        h2 Track: #{track}
        audio(controls src="/public/Music/Pink_Floyd/WishYouWereHere/ShineOnYouCrazyDiamond(PartsI-V).mp3")

uj5u.com熱心網友回復：

從您的目錄草圖中，在我看來，您的目錄是所在public目錄的兄弟（而不是子目錄）。所以，而不是這個：jsserver.js

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

你會像這樣先升一級：

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

上一個目錄，然后下到該public目錄。

這將與您擁有的此標簽相匹配：

 link(rel='stylesheet' type='text/css' href='/public/music.css')

標籤：css 节点.js 表示 哈巴狗

上一篇：res.locals.path=req.path;是什么？在node.js中？

下一篇：在pug中從ORM訪問資料