I can't upload image to strapi

by

I am trying to upload image to strapi, but i am getting error 400 ,this my code :
I guess the error because it can’t read the file input i am not sure 🤔

 <script>

    import axios from "axios";
    // const files = document.getElementById('file');
    let formData = new FormData();
    var file = document.querySelector('form');
    
      let handleUpload = () => {
    
   // You should have a server side REST API 
   axios.post('http://localhost:1337/upload',
       formData,{   
            headers: {
              'Content-Type': 'multipart/form-data'
            }
          }
        ).then(function () {
          console.log('SUCCESS!!');
        })
        .catch(function () {
          console.log('FAILURE!!');
        });
    };

</script> 

<div class="card" >
    <form id="myFrom" >
      <input
        type="file"
        id="image"
        name="file"
        alt="image"
      />
      <br />
      <button type="submit"on:click={handleUpload()}>Send</button>
    </form>
  </div>

this there showing in my browser

2 thoughts on “I can't upload image to strapi”

  1. Your mistake is here :

    <button type="submit"on:click={handleUpload()}>Send</button>

    You call handleUpload() instead of a reference. handleUpload() is called when the button is mounted, instead of when the button is clicked.

    You must remove the ()

    <button type="submit"on:click={handleUpload}>Send</button>
    Reply

Leave a Comment