Проблема с запросом PUT в axios с vue.js

Question

Я создаю приложение для умного дома.У меня проблема с отправкой PUT-запроса в остальные API (я строил его с помощью фляги), но при попытке отправить запрос выдает ошибку HTTP 400 ((Uncaught (в обещании) Ошибка: запрос не выполнен с кодом состояния 400)).Вы можете мне помочь?

import axios from 'axios';
export default {
    data: function() {
        return {
            value: 0,
            lampName: 'Kitchen',
        };
    },
    mounted () {
        axios
        .get("http://127.0.0.1:5000/lamp/" + this.$route.params.id)
        .then(response => (this.value = response.data))
    },
    methods: {
        updateValue () {
            axios
                .put('http://127.0.0.1:5000/lamp/' + this.$route.params.id,
                {value: this.value},
                {headers: {
                        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
                }
            })
        }
    }
}

Answer 1

Итак, это ошибочный запрос:

axios
    .put('http://127.0.0.1:5000/lamp/' + this.$route.params.id,
    {value: this.value},
    {headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    }
})

Я не знаю, что ожидает ваш сервер, но вы устанавливаете content-type из application/x-www-form-urlencoded при отправке данных JSON. Кажется вероятным, что это несоответствие является причиной ваших проблем. Вы сможете увидеть это, если изучите запрос в разделе Сеть инструментов разработчика вашего браузера.

Если вам нужно использовать application/x-www-form-urlencoded, тогда я предлагаю прочитать документацию axios, поскольку вы не можете просто передать объект данных, подобный этому:

https://github.com/axios/axios#using-applicationx-www-form-urlencoded-format

Короче говоря, вам нужно создать строку тела вручную, хотя есть утилиты, которые делают это менее обременительным.

Если вам действительно нужны данные JSON, просто удалите заголовок content-type. Аксиос должен установить подходящий content-type для вас.