Home > OS >  Upload file return 405 error Axios / Laravel
Upload file return 405 error Axios / Laravel

Time:07-05

I'm working with Axios / Vue JS and Laravel 9 in the backend I'm trying to upload a file but I'm getting an error, this is my code :

selectedFile: function(){

    let form = document.getElementById('myform');
    let data = new FormData(form);
    data = data.append('file', document.querySelector(".dropzoneFile").files[0]);
  
    axios.post('http://testing.localhost/lab', data, {
            'content-type': 'multipart/form-data',
    }); 

}

The error I'm getting (Browser Inspect):

Request URL: http://testing.localhost/lab
Request Method: POST
Status Code: 405 
Referrer Policy: strict-origin-when-cross-origin

The problem happens only with uploading forms ( not in normal forms )

That's my HTML:

<form id="myform" enctype="multipart/form-data">
                <div >
                    <drop-zone @drop.prevent="drop" @change="selectedFile"></drop-zone>
                </div>
            </form>

and That's the dropzone component:

<template>
  <div
    @dragenter.prevent="toggleActive"
    @dragleave.prevent="toggleActive"
    @dragover.prevent
    @drop.prevent="toggleActive"
    :
    
  >
    <div >
        <i ></i>
    </div>

    <h5>Drop files here or click to upload.</h5>
    <label for="dropzoneFile" >Upload</label>
   <input type="file" id="dropzoneFile"  />
  </div>
</template>

CodePudding user response:

405 Error status code occures when there is no relanvent method defined to handle that perticular post, get, delete or put in route file

Make sure you have POST method defined for that requested URL in your web.php file

The HyperText Transfer Protocol (HTTP) 405 Method Not Allowed response status code indicates that the server knows the request method, but the target resource doesn't support this method. The server must generate an Allow header field in a 405 status code response.

CodePudding user response:

Found it by my self : NEVER AND NEVER USE dd(); While you are using API. because of the preflight should not return an HTTP error, and that's what dd() caused

  • Related