亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Express Server 的 MIME 類型問題('text/html')

Express Server 的 MIME 類型問題('text/html')

楊魅力 2023-07-06 15:02:29
剛剛在我的學校啟動 Express 服務器模塊。我做了一個非常簡單的網站只是為了嘗試一下,但似乎 css 文件沒有被執行(在 chrome 的終端 cl 中檢查)。拒絕應用“http://localhost:3000/public/style.css”中的樣式,因為其 MIME 類型(“text/html”)不是受支持的樣式表 MIME 類型,并且啟用了嚴格的 MIME 檢查。家:26獲取http://localhost:3000/public/einstein-home.jpg 404(未找到)const express = require('express');    const app = express();        app.use(express.static('public'));             app.get('/home', (request, response) => {        console.log('dirname', __dirname);        response.sendFile(__dirname + '/views/home.html')    });        app.get('/about', (request, response) => {        console.log('dirname', __dirname);        response.sendFile(__dirname + '/views/about.html')    });        app.get('/works', (request, response) => {        console.log('dirname', __dirname);        response.sendFile(__dirname + '/views/works.html')    });            app.listen(3000, () => {        console.log('Website about Einstein');    });body {    font-family: Verdana, Geneva, Tahoma, sans-serif;    background-color: #f2f2f2;    margin-top: 0px;    margin-right: 0px;    margin-bottom: 0px;    margin-left: 0px;    font-style: normal;    font-weight: 200;}.container {    width: 90%;    margin-left: auto;    margin-right: auto;    height: 600px;    background-color: #FFFFFF;}header {    width: 100%;    height: 8%;    background-color: #52bad5;    border-bottom: 1px solid #2C9AB7;}nav {    float: right;    width: 50%;    text-align: right;    margin-right: 25px;}header nav ul {    list-style: none;    float: right;}nav ul li {    float: left;    color: #FFFFFF;    font-size: 14px;    text-align: left;    margin-right: 25px;    letter-spacing: 2px;    font-weight: bold;    transition: all 0.3s linear;}ul li a {    color: #FFFFFF;    text-decoration: none;}ul li:hover a {    color: #2C9AB7;}.text {    width: 90%;    text-align: justify;    font-weight: lighter;    line-height: 25px;    float: left;    padding-left: 20px;    padding-right: 20px;    color: #A3A3A3;}
查看完整描述

1 回答

?
ITMISS

TA貢獻1871條經驗 獲得超8個贊

我強烈建議不要滾動你自己的模板:express 是ejs內置的,如果你需要更復雜的東西,添加更好的模板pug或者nunjucks是完美的選擇。依靠res.render()生成 HTML 文件,不要使用res.writeres.sendFile

至于為什么事情不能正常工作,請記住閱讀如何static工作:你告訴 Express 在進入“真正的”路由之前需要檢查哪些目錄的 URL 請求,其中 - 關鍵 - 目錄的名稱不會映射到 URL。

即如果你有這個:

app.use(express.static('public'))
app.use(express.static('files'))

那么請求yoursite.tld/css/cake.css將首先檢查css/cake.cssinside?public,然后檢查 inside?files,然后如果app.get沒有路徑匹配,它將落入任何可能匹配的路由。


查看完整回答
反對 回復 2023-07-06
  • 1 回答
  • 0 關注
  • 231 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號