解決nginx加載css文件時無效問題(識別成 text/plan)
1、問題描述
今天遇到個問題，發(fā)現(xiàn)明明css文件已經(jīng)加載成功了，但是頁面上的樣式死活沒展示出來，如下圖
2、分析
通過本地打開這個項目是正常的，但是部署到線上后就不行了，想了下。這個靜態(tài)頁面是直接放在nginx的 html目錄下的，那就應(yīng)該跟nginx有關(guān)；這是本地項目，css文件是可以正常訪問的，并且content-type 是 text/css,
而線上項目雖然可以正常訪問css文件，但是連content-type都沒有，或者是 text/plan,反正不是text/css, 這就難怪了，瀏覽器是根據(jù)你的content-type來識別靜態(tài)文件的，你給錯文件類型，就別怪瀏覽器沒渲染；
3、解決
知道問題了，那我們就可以來著手解決了，需要在nginx的配置文件中修改配置，在 nginx.conf 中的 http{}塊內(nèi)加入以下配置即可
# mime.types 以自己的實際路徑為準(zhǔn)，一般情況下，nginx 都會帶有這個文件 include /etc/nginx/mime.types; default_type application/octet-stream;
加好后如下圖
然后重啟nginx，再次訪問，已經(jīng)可以正常顯示樣式內(nèi)容了，且 content-type 也是text/css
到此這篇關(guān)于解決nginx加載css文件時無效問題(識別成 text/plan)的文章就介紹到這了,更多相關(guān)nginx加載css文件時無效內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
Nginx配置SSL證書部署HTTPS網(wǎng)站的方法（頒發(fā)證書）
這篇文章主要介紹了Nginx配置SSL證書部署HTTPS網(wǎng)站的方法（頒發(fā)證書），小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-06-06
文章簡要介紹了如何檢查Nginx配置文件是否正確的方法,包括進入配置文件路徑、返回結(jié)果判斷正確性以及兩種啟動方式,希望對大家有所幫助2025-11-11
nginx配置ssl實現(xiàn)https訪問的步驟（適合新手）
這篇文章主要給大家介紹了關(guān)于nginx配置ssl實現(xiàn)https訪問的相關(guān)資料，這個教程非常適合新手小白，文中通過示例代碼將實現(xiàn)的方法一步步介紹的非常詳細，需要的朋友可以參考借鑒，下面來一起看看吧2018-12-12
本描述重點講解了Nginx配置中如何阻止未綁定特定域名的訪問,通過設(shè)置默認server塊和明確指定server名稱,確保只有合法請求能夠匹配成功,從而避免非法訪問的問題2026-05-05
本篇文章主要介紹了詳解Nginx反向代理到Tomcat服務(wù)器，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-02-02
這篇文章主要介紹了詳解 Nginx 301重定向的配置的相關(guān)資料,需要的朋友可以參考下2017-03-03
Nginx禁用TLSv1.0?1.1改為TLSv1.2?1.3的操作方法
使用Mozilla?SSL配置工具生成配置,修改nginx.conf的ssl_protocols和ssl_ciphers,通過ssllabs檢測及Linux命令測試TLS版本支持情況,確保網(wǎng)站SSL安全配置生效,本文給大家介紹Nginx禁用TLSv1.0?1.1改為TLSv1.2?1.3的操作方法,需要的朋友一起看看吧2025-08-08
本文給大家匯總介紹了nginx中使用rewrite偽靜態(tài)正則表達式的資源，非常的全面詳細，有需要的小伙伴可以參考下2016-08-08
Nginx配置?location模塊實現(xiàn)路由(反向代理、重定向)功能
本文主要介紹了Nginx配置?location模塊實現(xiàn)路由(反向代理、重定向)功能，文中通過示例代碼介紹的非常詳細，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-04-04
訂單系統(tǒng)增加附件預(yù)覽,下載的功能,但是這個附件是客戶推單時推送過來的,文件連接是類似oss連接,但是是客戶的域名,所以導(dǎo)致跨域問題,本文小編將給大家介紹如何用nginx解決前端js下載跨域問題,需要的朋友可以參考下2023-10-10