Загрузите и получите изображение, используя parse и back4app с nodejs и express - PullRequest
Новая
       25

Загрузите и получите изображение, используя parse и back4app с nodejs и express

0 голосов
/ 01 марта 2020

Может быть, это уже отвеченный вопрос, но я не могу найти правильный ответ для меня. Я не вижу, что не так с моим кодом.

У меня есть форма для загрузки данных о транспортном средстве, таких как маршрут, цена, фотография транспортного средства и т. Д. c. Когда я получаю URL изображения, на нем ничего не отображается пример изображения

Вот код, который я использую для публикации моей формы 

 //POST create vehicle
    app.post('/createVehicle', async function(req, res, next){


     const fileData = new Parse.File("VehiclePic", { base64: req.body.VehicleImg }, "image/png");
     console.log(fileData);

    let car = new Car();

    const Vehicle = {
        VehicleImg: fileData,
        Name: req.body.Name,
        description: req.body.description,
        Price: parseInt(req.body.Price),
        Route: req.body.Route,
        PassengerAmount: parseInt(req.body.PassengerAmount)
    }


    try{
        fileData.save().then(saved => {

            car.set('Image', saved);
            car.set('Name', Vehicle.Name);
            car.set('Description', Vehicle.description);
            car.set('Route', Vehicle.Route);
            car.set('Price', Vehicle.Price);
            car.set('PassengerAmount', Vehicle.PassengerAmount);

            console.log("URL vehiculo " + saved.url());
            car.save();

            console.log("El vehiculo ha sido creado con exito!");
        })     

    }catch(error){
        console.error('error ' , error);
    }

    res.redirect('/');

});

Причина, по которой я не используйте Vehicle. js. 

<div class="createVehicle-section container">
            <br>

            <form method="POST" action="/createVehicle" enctype="multipart/form-data">

                <div id="img">
                    <label for="VehicleImg">Seleccione la imagen:</label>
                    <input type="file" id="VehicleImg" name="VehicleImg" >
                </div>

                <br>

                <div class="col-lg-12 row">
                    <div class="col-md-6">
                        <label for="VehicleName">Nombre del vehiculo</label>
                        <input type="text" id="VehicleName" name="Name">
                        <br>
                        <label for="DescriptionVe">Descripción</label>
                        <input type="text" id="Descriptionve" name="description">
                    </div>          

                    <div class="col-md-6">
                        <label for="PriceVe">Precio</label>
                        <input type="number" id="PriceVe" name="Price" min="0" max="9999">
                        <br>
                        <label for="RouteVe">Ruta</label>
                        <input type="text" id="RouteVe" name="Route">
                    </div>


                </div>
                <br>
                <div class="col-md-6 container">
                    <label for="PassegerAmountVe">Cantidad de Pasajeros Permitida</label>
                    <input type="number" id="PassengerAmountVe" name="PassengerAmount" min="0" max="9999">
                </div>

                <br>
                <div class="text-center">
                    <input class="btn btn-main btn-lg btn-shadow" type="submit" value="Guardar"/>

                </div>

            </form>
            <br>
        </div>

РЕДАКТИРОВАТЬ: Вот мой код Multer, чтобы загрузить его в локальное хранилище, и мне нужно загрузить его в back4app. 

//Multer Image Storage 
const storage = multer.diskStorage({
    destination: './public/images/',
    filename: function(req, file, cb){ //cb = callback
         cb(null, file.fieldname + '-' + Date.now() + path.extname(file.originalname));
    }
});
// Init Upload
const upload = multer({
    storage: storage,
    limits:{fieldSize: 1000000},
    fileFilter: function(req, file, cb){
        checkFileType(file, cb);
    }
}).single('VehicleImg');

1 Ответ

0 голосов
/ 04 марта 2020

Попробуйте следующий код: 

const upload = multer();

app.post('/createVehicle', upload.single('VehicleImg'), async function(req, res, next){

     const fileData = new Parse.File("VehiclePic.png", [...req.file.buffer], "image/png");
     console.log(fileData);

    let car = new Car();

    const Vehicle = {
        VehicleImg: fileData,
        Name: req.body.Name,
        description: req.body.description,
        Price: parseInt(req.body.Price),
        Route: req.body.Route,
        PassengerAmount: parseInt(req.body.PassengerAmount)
    }


    try{
        fileData.save().then(saved => {

            car.set('Image', saved);
            car.set('Name', Vehicle.Name);
            car.set('Description', Vehicle.description);
            car.set('Route', Vehicle.Route);
            car.set('Price', Vehicle.Price);
            car.set('PassengerAmount', Vehicle.PassengerAmount);

            console.log("URL vehiculo " + saved.url());
            car.save();

            console.log("El vehiculo ha sido creado con exito!");
        })     

    }catch(error){
        console.error('error ' , error);
    }

    res.redirect('/');

});
...