MattB
8 months ago
1754
11
Vue

404 error when uploading file with Axios. Please help

Posted 8 months ago by MattB

I have a form with input for 2 images, one which goes to an images folder and one which goes to thumbnails. When I hit upload, I get GET http://danza.test/thumbnails[object%20File] 404 (Not Found). If I output the request object, all looks ok. I'm stuck.

Upload method:

let $updatedGallery = this;
                    let $index = this.images.push(this.editedItem)-1;
                    axios.post('/api/gallery', this.editedItem).then((response) => {
                        $updatedGallery.editedItem.id = response.data.id;
                        Object.assign($updatedGallery.images[$index], $updatedGallery.editedItem);
                    })
                        .catch(function (error) {
                            console.log(error);
                        });

Object:

editedItem: {
                name: '',
                image: null,
                thumbnail: null,
                species: '',
                tag: '',
                patreon: '',
                action: '',
            },
            defaultItem: {
                name: '',
                image: null,
                thumbnail: null,
                species: '',
                tag: '',
                patreon: '',
                action: '',
            },

Form:

<v-row>
                                    <v-col cols="12" sm="6" md="6">
                                        <v-file-input v-model="editedItem.image" label="Picture"></v-file-input>
                                    </v-col>
                                    <v-col cols="12" sm="6" md="6">
                                        <v-file-input v-model="editedItem.thumbnail" label="Thumbnail"></v-file-input>
                                    </v-col>

Please sign in or create an account to participate in this conversation.