Как я могу опубликовать изображение с 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){});
я должен сохранить их в базе данных или что-то?
1 ответ
Не совсем, он сохраняется внутри вашего компьютера, внутри каталога, который вы выберете.
Это простая 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')
пока мы получаем запрос по почте, мы объявляем его прямо перед обратным вызовом. Какие 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 в клиентском браузере. Вы можете загружать файлы на свой веб-сервер или на веб-сервер и получать изображения оттуда. Например, мое изображение профиля в stackru сохраняется здесь
Вы можете использовать params в запросе 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
})