получение, хранение и рендеринг изображений с помощью nodeJs, Mongodb и Pug - PullRequest
0 голосов
/ 03 декабря 2018

graphic of what I am trying to do

Привет, я начинающий разработчик, и я пытаюсь сделать веб-заявку, а именно простой клон в Твиттере для дидактических статей.Я использую NodeJs и Express, MongoDB с mongoose в качестве базы данных и Pug в качестве визуализации представления.Тогда у меня есть две стратегии:

  • Получение необработанных данных изображения, сохранение их в папке /public, сохранение пути к изображению в mongodb, затем отправка обратной ссылки на изображение и назначение его в pug.
  • Получение необработанных данных изображения, сохранение двоичных данных изображения в mongodb, затем отправка двоичных данных клиенту и его обработка клиентом.Я не знаю, как это сделать.

Поэтому я пытаюсь зарегистрировать новый User (который я уже смоделировал с помощью mongoose.model())

var mongoose = require("mongoose")

var usrSchema = mongoose.Schema({
  name: String,
  mail: String,
  pass: String,
  prof_pic: Buffer, // not working
  level: Number
})

module.exports = mongoose.model('User', usrSchema)

Регистрация без prof_pic работает нормально, используя HTML-форму с POST.Это мой userpug.pug файл:

html
  head
  body
    form(method="post" action="usuarios")
      input(type="text" name="name")
      br
      input(type="text" name="mail")
      br
      input(type="text" name="pass")
      br
      input(type="file" name="prof_pic") // not working
      br
      input(type="submit" value="Add")
      br
      #image_space= var_image // not working

А это мой файл server node.js:

var mongoose = require("mongoose")
var bodyParser = require("body-parser")
app.use(bodyParser.urlencoded({extended:false}))
var User = require("/models/user.js")
var fs = require("fs")

// just renders a form where to upload the data
app.get("/", (req,res,next) => {
  res.render("userpug")
})

// handles data upload
app.post("/", (req,res,next) => {
  new_usr = new User({
    name: req.body.name,
    mail: req.body.mail,
    pass: req.body.pass,
    prof_pic: req.body.prof_pic, // does not work fine
    level: 1 // every user starts at lvl 1
  })

  // save the file
  User.save() // it works

  fs.writeFile("images/profile_picture.jpg", req.body.prof_pic, (err) => {
    console.log(err)
  }) // works but file is invalid

  console.log("image data: ", req.body.prof_pic) //it just prints fileName.jpg
  res.redirect("/result")
})

Но когда я пытаюсь загрузить данные, ни одно из этих двух действий не работает:

// rendering the file from database
app.get("/result", (req,res,next) => {
  User.findOne({}).then(user => {
    console.log(user.prof_pic.buffer) //only prints file name bytes
    res.render("userpug", {var_image: user.prof_pic.buffer}) //not working
  })
})
// or trying to render from file system
app.get("/result", (req,res,next) => {
  fs.readFile("images/profile_picture.jpg", (err, data) => {
    console.log("image data: ", data) //only shows filename bytes
    res.render("userpug", {var_image: user.prof_pic.buffer}) // ???
  })
})

Так что дело в том, что я не знаю, как обрабатывать данные из <form>, как преобразовывать в двоичный файл, как читать их и, наконец, как отображать их в виде мопса.

Я испробовал стратегии как для файловой системы, так и для исходных данных, но все еще не работает.Я немного исследовал Base64 и Buffers, но все еще не могу решить проблему, и информация о преобразовании двоичных данных и изображениях плохая (или, может быть, я просто не могу понять это).Большое спасибо за ваше время!

...