Как я могу опубликовать изображение с 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
})
Другие вопросы по тегам