如何用Nodejs和Multer發佈圖片？

我正在嘗試構建一個包含上傳文件（如圖像）併發布的應用程序。如何用Nodejs和Multer發佈圖片？

這是我迄今所做的：

var express = require('express'); 
var multer = require('multer'); 

var storage = multer.diskStorage({ 
     destination: function (req, file, cb) { 
     cb(null, './public/img'); 
     }, 
     filename: function (req, file, cb){ 
     cb(null, file.originalname + '-' + Date.now()); 
     } 
    }); 

var upload = multer({storage: storage});

所以這上面的代碼將我上傳的文件保存在一個名爲在最後發表的帖子「IMG」

module.exports = function(app){ 

    app.get('/', function(req, res){ 
     res.render('index'); 
    }); 

    app.post('/upload', upload.single('file'), function(req, res){ 

    res.send(req.file); 
    }); 
}

現在文件夾中請求我在'req.file'中獲取關於該文件的所有元數據信息。我想獲得的文件，並張貼如果有人，比如，讓這個請求：

app.get('/postedfiles', function(req, res){});

我應該將它們保存在數據庫中的東西？

來源

2017-09-06 Jeff Goes

不是真的，它保存在您的計算機內部，在您選擇的目錄中。

這是multer上傳的純html表單。

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title></title> 
    </head> 
    <body> 
    <form accept="image/x-png,image/gif,image/jpeg" enctype="multipart/form-data" action="/profile" method="post"> 
     <input type="file" name="avatar" value=""> 
     <input type="submit" name="" value="ssss"> 
    </form> 
    </body> 
</html>

這是我們的後端代碼。在內部存儲中，我選擇在/upload目錄下的文件上傳位置，併爲其指定當前時間的文件名。我們聲明瞭upload變量的設置，然後我們在使用upload.single('avatar')的同時收到了一個post請求，我們在回調之前宣佈它。什麼avatar這裏是它的輸入標籤內的HTML格式的文件名。在回調中，我們可以使用req.file訪問我們的文件。模塊以這種方式保存文件，非常容易使用。

var express = require('express') 
var multer = require('multer') 
var app = express() 

var storage = multer.diskStorage({ 
    destination: function (req, file, cb) { 
    cb(null, __dirname + '/uploads')  //you tell where to upload the files, 
    }, 
    filename: function (req, file, cb) { 
    cb(null, file.fieldname + '-' + Date.now() + '.png') 
    } 
}) 

var upload = multer({storage: storage, 
    onFileUploadStart: function (file) { 
     console.log(file.originalname + ' is starting ...') 
    }, 
}); 

app.set('view engine', 'ejs'); 

app.get('/', function(req, res, next){  
    res.render('mult'); //our html document 
}) 

app.post('/profile', upload.single('avatar'), function (req, res, next) { 
    // req.file is the `avatar` file 
    console.log(req.file); 
    return false; 
})

確保，你給的圖片，要麼PNG或JPEG，或任何你想使用的擴展名，否則也不會被視爲計算機的圖像。

更新你的問題

如果你想顯示客戶端的圖像而無需刷新頁面，只需要使用AJAX與客戶端瀏覽器的GET請求。您可以上傳網絡服務器或網絡服務器中的文件，並從那裏檢索圖像。例如，我的個人資料圖片保存在計算器中 here

您可以在get請求中使用參數來接收來自服務器的所有文件。

例如，想象一個客戶向/uploads/imageOfApet.png發出獲取請求。

app.get('/uploads/:theImageName', function(req, res){ 
    console.log(req.params.theImageName); //returns the imageOfApet.png 
    var theName = req.params.theImageName; //imageOfApet.png 
    res.sendFile(__dirname + "/uploads/" + theName); //Sending the user the file 
})

來源

2017-09-06 15:39:21 turmuka

我明白了。順便謝謝你的回答。但我想要的是能夠向網頁上的用戶顯示剛剛上傳的圖像。我不知道該怎麼做。 –

請參閱更新@JeffGoes – turmuka

例如在這段代碼文件被保存到'uploads'目錄，我可以將圖像鏈接到我的網站裏面像www.mywebsite.com/uploads/imageNumberOne.png – turmuka

如何用Nodejs和Multer發佈圖片？

回答

相關問題