express的中間件bodyParser詳解
bodyParser用于解析客戶(hù)端請(qǐng)求的body中的內(nèi)容,內(nèi)部使用JSON編碼處理,url編碼處理以及對(duì)于文件的上傳處理.
下面是一個(gè)文件上傳的例子.
建立一個(gè)1.html頁(yè)面
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>向服務(wù)器上傳文件</title>
<script type="text/javascript">
function uploadFile(){
var formData=new FormData();
var files=document.getElementById("files").files;
var file=files[0];
formData.append("myfile",file);
var xhr=new XMLHttpRequest();
xhr.open("post","index.html",true);
xhr.onload= function (e) {
if(this.status==200)
document.getElementById("result").innerHTML=this.response;
};
xhr.send(formData);
}
</script>
</head>
<body>
請(qǐng)選擇文件:<input type="file" id="files" name="file" />
<input type="button" value="上傳文件" onclick="uploadFile();" />
<div id="result"></div>
</body>
</html>
上面的XMLHttpRequest對(duì)象與FormData對(duì)象時(shí)HTML5中的內(nèi)容,不作重點(diǎn)講解.用這兩個(gè)對(duì)象可以將用戶(hù)選取的文件上傳到服務(wù)器端,.
在服務(wù)器端使用了app.use(express.bodyParser())中間件之后,代表客戶(hù)端請(qǐng)求的http.IncomingMessage,也就是res對(duì)象就具有了一個(gè)files屬性.
server.js端代碼:
var express=require("express");
var fs=require("fs");
var app=express();
app.use(express.bodyParser());
app.get("/index.html", function (req,res) {
res.sendfile(__dirname+"/1.html");
});
app.post("/index.html", function (req,res) {
var file=req.files.myfile;
fs.readFile(file.path, function (err,data) {
if(err) res.send("讀文件操作失敗");
else{
fs.writeFile(file.name,data, function (err) {
if(err) res.send("寫(xiě)文件操作失敗.");
else res.send("文件上傳成功");
})
}
});
});
app.listen(1337,"127.0.0.1", function () {
console.log("開(kāi)始監(jiān)聽(tīng)");
});
啟動(dòng)服務(wù)器后,運(yùn)行瀏覽器:

選擇文件:

在瀏覽器端出現(xiàn)了 上傳成功字樣,
在服務(wù)器端也有了我們上傳的文件.

點(diǎn)擊上傳后:
另外bodyParse可以接受客戶(hù)端ajax提交的json數(shù)據(jù),以及url的處理.
相關(guān)文章
使用Fetch API執(zhí)行GraphQL查詢(xún)和變體問(wèn)題
這篇文章主要介紹了使用Fetch API執(zhí)行GraphQL查詢(xún)和變體問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-04-04
用node開(kāi)發(fā)并發(fā)布一個(gè)cli工具的方法步驟
這篇文章主要介紹了用node開(kāi)發(fā)并發(fā)布一個(gè)cli工具的方法步驟,小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2019-01-01
詳解HTTPS 的原理和 NodeJS 的實(shí)現(xiàn)
這篇文章主要介紹了詳解HTTPS 的原理和 NodeJS 的實(shí)現(xiàn),小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-07-07
詳解如何使用Node.js實(shí)現(xiàn)熱重載頁(yè)面
這篇文章主要介紹了詳解如何使用Node.js實(shí)現(xiàn)熱重載頁(yè)面,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05
express+multer上傳圖片打開(kāi)亂碼問(wèn)題及解決
這篇文章主要介紹了express+multer上傳圖片打開(kāi)亂碼問(wèn)題及解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-09-09
node 安裝 windows-build-tools全過(guò)程
這篇文章主要介紹了node 安裝 windows-build-tools全過(guò)程,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-10-10
Node.js 實(shí)現(xiàn)簡(jiǎn)單的無(wú)侵入式緩存框架的方法
這篇文章主要介紹了Node.js 實(shí)現(xiàn)簡(jiǎn)單的無(wú)侵入式緩存框架的方法,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-07-07
node.js實(shí)現(xiàn)回調(diào)的方法示例
這篇文章主要介紹了node.js實(shí)現(xiàn)回調(diào)的方法,結(jié)合實(shí)例形式分析了node.js實(shí)現(xiàn)向回調(diào)函數(shù)傳遞參數(shù)、閉包的使用及鏈?zhǔn)交卣{(diào)相關(guān)操作技巧,需要的朋友可以參考下2017-03-03
nodejs和php實(shí)現(xiàn)圖片訪(fǎng)問(wèn)實(shí)時(shí)處理
這篇文章主要為大家詳細(xì)介紹了nodejs和php分別實(shí)現(xiàn)圖片訪(fǎng)問(wèn)實(shí)時(shí)處理,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-01-01

