Sigmond Gatt Ответов: 1

Как передать изображение из ajax в nodejs ( ошибка незаконного вызова)


Всем привет !,

Поэтому я пытаюсь загрузить изображение из frontend(html) и сохранить его локально , получить путь и сохранить путь в БД. Вот мой код:

HTML:
  <!-- ... form-->
   <div class="form-group">
      <input type="file" id="prop_image" name="prop_image" accept="image/*">
  </div>
<div class="form-group">
                  <input type="submit" class="btn btn-primary" id="submit" ng-click="createProperty()"; name="submit" value="Create Property">
                </div><


язык JavaScript :
$("#PropertyForm").submit(function(event) {
         event.preventDefault();
   roomForm = new FormData();
         roomForm.append("room_no",$scope.Rooms[i].roomNo);
         roomForm.append("features_mask",featureVal);
         roomForm.append("mon_hrs",RoomAvail.mon);
         roomForm.append("tue_hrs",RoomAvail.tue);
         roomForm.append("wed_hrs",RoomAvail.wed);
         roomForm.append("thu_hrs",RoomAvail.thu);
         roomForm.append("fri_hrs",RoomAvail.fri);
         roomForm.append("sat_hrs",RoomAvail.sat);
         roomForm.append("sun_hrs",RoomAvail.sun);
         roomForm.append("area_dim",$scope.Rooms[i].area_dim);
         roomForm.append("prop_image",document.getElementById('prop_image').files[0]);
         roomForm.append("property_id",$scope.property_id);


         console.log("before");

  $.ajax({
           url:"http://localhost:1337/createRoom",
           type:"POST",
           method: "POST",
           mimeType: "multipart/form-data",
           // contentType: 'multipart/form-data',

           data: roomForm,
           success: (response)=>
           {
               console.log("success");
           },
           error: (error)=>
           {
             Swal.fire({
                   icon:'error',
                   title:'Oops...',
                   text: "Error in Query. Please contact System Admin."
                 });
           }
         })




nodejs ( я пытаюсь использовать moduler) если вы предпочитаете использовать другую библиотеку или так просто скажите мне, как это сделать :) :
app.post("/createRoom",upload.single("prop_image"), (req,res,next) =>{ 
      
    log("in create rooms"); 
    log(req.file); // CANNOT GET FILE!
    connection.query("INSERT INTO ......"
    ,(error,rows,field)=>
    {
        if(!!error)
        {
            res.status(400).send("Error in query :",error);
        }else
        {
            res.status(200).send("Rooms Created");
        }
    })
})


Что я уже пробовал:

я попытался передать FormData() и добавить к нему изображение, но оно не работает, ошибка незаконного вызова все еще всплывает. Я ценю вашу работу, так как это занимает у меня некоторое время :(

Richard Deeming

Вы не можете передать простой объект JSON для загрузки файла. Вы должны использовать FormData.
Использование объектов FormData - Web API | MDN[^]

Обновите свой вопрос, чтобы показать FormData версию вашего кода и включить полную информацию об ошибке.

Sigmond Gatt

Я обновил свой вопрос, но все та же ошибка ( незаконный вызов)