Рабочая форма с загрузкой файла изображения в expressjs - PullRequest
Новая
       13

Рабочая форма с загрузкой файла изображения в expressjs

0 голосов
/ 28 января 2019

Какой простой способ загрузить изображение с помощью формы?

Я хочу загрузить изображение с помощью формы.Я пытался решить это, но я получил "неожиданное поле".Я установил multer и следовал простому учебнику, но он не работал должным образомэто форма 

    <div class="col-lg-4">
          <div class="card">
            <div class="card-header bg-primary"> Add Books </div>
             <form id="c_form-h" class="" method="post" action="/addbooks" enctype="multipart/form-data" style="padding: 5px;">  
            <div class="form-group row">
                 <label for="addbookname" class="col-6 col-form-label">Book Name</label>
             <div class="col-12">
                <input type="text" class="form-control" name="book_name" placeholder="Add Book Name" required> 
            </div>
            </div>


            <div class="form-group row">
                <label for="addsummary" class="col-6 col-form-label">Summary</label>
              <div class="col-12">  
              <textarea class="form-control" name="summaries" placeholder="Write Some Description" rows="3" required>   
              </textarea>
            </div>
        </div>


            <div class="form-group row">
                <label for="addcategory" class="col-9 col-form-label">Select Category</label>
              <div class="col-12">
                <input type="number" class="form-control" name="isbn" placeholder="ISBN" required> 
            </div>
            </div>

            <div class="form-group row">
                <label for="addimage" class="col-9 col-form-label">Add Image</label>
                <div class="col-12">
                  <input type="file" class="form-control-file" name="image" required> 
              </div>
              </div>


             <div class="form-group row">
                <label for="addcategory" class="col-9 col-form-label">Select Category</label>
               <div class="col-12">
                  <select class="form-control" name="categories" required>
                    <option></option>
                    <option>Fruits</option>
                    <option>Intercontinental Foods</option>
                    <option>3</option>
                    <option>4</option>
                  </select>
                </div>
                </div>
             <button type="submit" class="btn btn-primary">Submit</button>
          </form>
        </div>
        </div>

Кроме того, некоторые могут также дать мне подсказку об обновлении изображения?Я имею в виду Как изменить изображение Спасибо

1 Ответ

0 голосов
/ 28 января 2019

В вашем HTML у вас есть имя файла как image

<input type="file" class="form-control-file" name="image" required>

Итак, вам нужно указать то же имя файла в multer, что и image вместо photo

//Replaced photo with image
router.post('/addbooks', multer(multerConfig).single('image'), bookControllers.addbooks);

Ссылка: Multer - Документация API

Путь обновления базы данных:

Вы получите информацию о файле в req.file на вашемконтроллер, как 

{ fieldname, originalname, encoding, mimetype, destination, filename, path, size }

В зависимости от ваших потребностей вы можете сохранить информацию о файле в вашей базе данных 

knex('book').insert({
...
image: req.file.path,
....
}).then(function(result){
...