Node.js 博客實例(三)添加文件上傳功能
阿新 • • 發佈:2017-05-24
文件 ace direct 上傳文件 file form parser rec mark
index.js加入代碼:
blog/views/下新建upload.ejs:
blog/app.js中app.use(express.bodyParser());改為:
原教程 https://github.com/nswbmw/N-blog/wiki/_pages的第三章
上傳文件眼下有三種方法:
使用 Express 自帶的文件上傳功能,不涉及數據庫
使用 Formidable 外部模塊,不涉及數據庫
上傳到 MongoDB ,涉及數據庫
這裏使用第一種,用戶將文件上,存儲於:blog/public/images/文件夾下。
blog/views/header.ejs 在<span><a title="發表" href="/post">post</a</span>前加入一行:
<span><a title="上傳" href="/upload">upload</a</span>
fs=require(‘fs‘),以及:
<span style="white-space:pre"> </span>app.get(‘/upload‘,checkLogin); app.get(‘/upload‘,function(req,res){ res.render(‘upload‘,{ title:‘文件上傳‘, user:req.session.user, success:req.flash(‘success‘).toString(), error:req.flash(‘error‘).toString() }); }); app.post(‘/upload‘,checkLogin); app.post(‘/upload‘,function(req,res){ for(var i in req.files){ if(req.files[i].size==0){ //使用同步方式刪除一個文件 fs.unlinkSync(req.files[i].path); console.log("successfully removed an empty file"); }else{ var target_path=‘./blog/public/images/‘+req.files[i].name; //使用同步方式重命名一個文件 fs.renameSync(req.files[i].path,target_path); console.log(‘successfully rename a file‘); } } req.flash(‘success‘,‘文件上傳成功‘); res.redirect(‘/upload‘); });
<%- include header %> <form method=‘post‘ action=‘/upload‘ enctype=‘multipart/form-data‘ > <input type="file" name="file1" multiple="multiple" /><br> <input type="file" name="file2" multiple="multiple" /><br> <input type="file" name="file3" multiple="multiple" /><br> <input type="file" name="file4" multiple="multiple" /><br> <input type="file" name="file5" multiple="multiple" /><br> <input type="submit" /> </form> <%- include footer %>
//保留上傳文件的後綴名,並把上傳文件夾設置為 /public/images app.use(express.bodyParser({ keepExtensions: true, uploadDir: ‘./blog/public/images‘ }));此時我們上傳一張圖片:123.png
提交:
發表博客,在博客裏引用照片:
發表:
Node.js 博客實例(三)添加文件上傳功能