在Node.js中設(shè)置響應(yīng)的MIME類型的代碼詳解
更新時間：2025年04月21日 08:34:36 作者：前端涂涂
在 Node.js 中設(shè)置響應(yīng)的 MIME 類型是為了讓瀏覽器正確解析服務(wù)器返回的內(nèi)容,比如 HTML、CSS、圖片、JSON 等,我們通常通過設(shè)置響應(yīng)頭中的 Content-Type 字段來完成,本文就給大家詳細(xì)介紹了在Node.js中設(shè)置響應(yīng)的MIME類型的方法,需要的朋友可以參考下
一、什么是 MIME 類型（Content-Type）？
MIME（Multipurpose Internet Mail Extensions）類型用于告訴瀏覽器或客戶端：返回的數(shù)據(jù)是什么類型的內(nèi)容。
例如：
text/html：HTML 文件application/json：JSON 數(shù)據(jù)text/css：CSS 樣式表image/png：PNG 圖片
二、手動設(shè)置 MIME 類型示例
const http = require('http');
const fs = require('fs');
const path = require('path');
// 常見擴(kuò)展名與 MIME 類型的映射表
const mimeTypes = {
'.html': 'text/html',
'.css': 'text/css',
'.js': 'application/javascript',
'.json': 'application/json',
'.png': 'image/png',
'.jpg': 'image/jpeg',
'.gif': 'image/gif',
'.svg': 'image/svg+xml',
'.ico': 'image/x-icon',
'.txt': 'text/plain',
};
const server = http.createServer((req, res) => {
let filePath = '.' + (req.url === '/' ? '/index.html' : req.url);
let ext = path.extname(filePath);
// 默認(rèn) MIME 類型
let contentType = mimeTypes[ext] || 'application/octet-stream';
fs.readFile(filePath, (err, data) => {
if (err) {
res.writeHead(404, { 'Content-Type': 'text/plain' });
return res.end('404 Not Found');
}
res.writeHead(200, { 'Content-Type': contentType });
res.end(data);
});
});
server.listen(3000, () => {
console.log('Server running on http://localhost:3000');
});
三、使用第三方模塊 mime
如果你不想維護(hù) MIME 映射表，可以使用官方推薦的 mime 模塊。
安裝：
npm install mime
使用：
const mime = require('mime');
const filePath = 'public/style.css';
const contentType = mime.getType(filePath); // 返回 'text/css'
常用 MIME 類型一覽
| 擴(kuò)展名 | MIME 類型 |
|---|---|
.html | text/html |
.css | text/css |
.js | application/javascript |
.json | application/json |
.png | image/png |
.jpg | image/jpeg |
.gif | image/gif |
.svg | image/svg+xml |
.txt | text/plain |
.pdf | application/pdf |
四、注意事項
Content-Type是告訴瀏覽器怎么處理數(shù)據(jù)的關(guān)鍵；- MIME 類型必須與實際資源類型匹配，否則瀏覽器可能拒絕渲染或報錯；
- 若未設(shè)置
Content-Type，瀏覽器可能會猜測類型，但這不安全； - 返回 JSON 時推薦：
res.writeHead(200, { 'Content-Type': 'application/json' });
res.end(JSON.stringify({ message: 'hello' }));
到此這篇關(guān)于在Node.js中設(shè)置響應(yīng)的MIME類型的代碼詳解的文章就介紹到這了,更多相關(guān)Node.js設(shè)置MIME類型內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
nodejs實現(xiàn)的簡單web服務(wù)器功能示例
這篇文章主要介紹了nodejs實現(xiàn)的簡單web服務(wù)器功能,結(jié)合實例形式分析了nodejs構(gòu)建web服務(wù)器的相關(guān)監(jiān)聽、響應(yīng)、數(shù)據(jù)處理等操作技巧,需要的朋友可以參考下2018-03-03
詳解node.js創(chuàng)建一個web服務(wù)器(Server)的詳細(xì)步驟
這篇文章主要介紹了詳解node.js創(chuàng)建一個web服務(wù)器(Server)的詳細(xì)步驟，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
npm?does?not?support?Node.js問題的解決辦法
這篇文章主要給大家介紹了關(guān)于npm?does?not?support?Node.js問題的解決辦法,文中通過代碼以及圖文介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-10-10
為了使在終端使用npm,我們可以配置環(huán)境變量,這篇文章主要給大家介紹了關(guān)于IDEA中配置運(yùn)行node.js的相關(guān)資料,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-10-10
這篇文章主要介紹了node版本管理工具n包使用教程詳解，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-11-11
本篇文章主要介紹了nodeJS實現(xiàn)路由功能實例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-06-06
這篇文章主要介紹了一下什么是node，以及node環(huán)境配置，之后我們就將開始深入去學(xué)習(xí)node了，感興趣的小伙伴可以深入了解閱讀一下2023-03-03
nodejs文件操作模塊FS（File System）常用函數(shù)簡明總結(jié)
這篇文章主要介紹了nodejs文件操作模塊FS（File System）常用函數(shù)簡明總結(jié),對FS模塊的大部份異步函數(shù)做了介紹,而且用中文注釋,這下用起來方便了,需要的朋友可以參考下2014-06-06
一文學(xué)會搭建HTTP服務(wù)器調(diào)用DLL庫
這篇文章主要為大家介紹了一文學(xué)會搭建HTTP服務(wù)器調(diào)用DLL庫，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-06-06
這篇文章主要介紹了node.js 如何監(jiān)視文件變化，幫助大家更好的理解和學(xué)習(xí)node.js，感興趣的朋友可以了解下2020-09-09