HTTP POST -> 400：错误请求答案

【问题标题】：HTTP POST -> 400: Bad RequestHTTP POST -> 400：错误请求
【发布时间】：2019-05-28 15:07:09
【问题描述】：

我正在学习如何制作 API，目前该 API 可以正常工作（使用 Postman）。我现在正在尝试制作一个使用它的应用程序，并且我设法发出 GET 和 DELETE 请求，但我被困在 POST 和 PUT 请求中。

这是我为 POST 尝试的内容：

url = "http://localhost:8000/musiques"

let titre = document.getElementById('formTitre').value;
let auteur = document.getElementById('formAuteur').value;
let genre = document.getElementById('formGenre').value;
let annee = document.getElementById('formAnnee').value;
let image = document.getElementById('formImage').value;

let jsonArr = [];

jsonArr.push({
    auteur: auteur,
    titre: titre,
    genre: genre,
    annee: annee,
    image: image
});
console.log(jsonArr);

let req = new XMLHttpRequest();
req.open("POST", url);
req.send(jsonArr);

当我尝试它时，我收到了错误 400 错误请求。

编辑：
好的，现在我有了这个：

let titre = document.getElementById('formTitre').value;
let auteur = document.getElementById('formAuteur').value;
let genre = document.getElementById('formGenre').value;
let annee = document.getElementById('formAnnee').value;
let image = document.getElementById('formImage').value;

let jsonArr = [];

console.log(titre);

jsonArr.push({
    auteur: auteur,
    titre: titre,
    genre: genre,
    annee: annee,
    image: image
});

console.log(JSON.stringify(jsonArr));

fetch(url, {
    method: 'POST',
    body: JSON.stringify(jsonArr),
    headers:{
        'Content-Type': 'application/json'
    }
}).then(res => res.json())
.then(response => console.log('Success:', JSON.stringify(response)))
.catch(error => console.error('Error:', error));

这给了我一个错误：

Success: {"error":{"code":500,"message":"Internal Server Error","exception":
[{"message":"An exception occurred while executing 'INSERT INTO api_musique
(auteur, genre, image, annee, titre) VALUES (?, ?, ?, ?, ?)' with params 
[null, null, null, null, null]:\n\nSQLSTATE[23000]: Integrity constraint 
violation: 1048 Le champ 'auteur' can't be empty

现在好多了。非常感谢，我正在努力。

【问题讨论】：

还有比远程服务器响应更多的信息吗？不要忘记，我们不知道它期望什么格式的请求、它认为有效的数据值或您实际发送的值。
@ADyson 我做了一些更改，这个错误消息确实更好。

标签： javascript json api

【解决方案1】：

您可以使用fetch:

fetch(url, { method: "POST", body: JSON.stringify(jsonArr) })

更多关于usage here。它返回一个Promise，您可以使用它来获取信息about the response。

响应对象可以让您弄清楚为什么会收到400。否则这可能是由您的 API 引起的问题。

【讨论】：

【解决方案2】：

这里是更正

let titre = document.getElementById('formTitre').value;
let auteur = document.getElementById('formAuteur').value;
let genre = document.getElementById('formGenre').value;
let annee = document.getElementById('formAnnee').value;
let image = document.getElementById('formImage').value;

let jsonArr = {
    auteur: auteur,
    genre: genre,
    image: image,
    annee: parseInt(annee),
    titre: titre
};

console.log(titre);


console.log(JSON.stringify(jsonArr));

fetch(url, {
    method: 'POST',
    body: JSON.stringify(jsonArr),
    headers:{
        'Content-Type': 'application/json'
    }
}).then(res => res.json())
.then(response => console.log('Success:', JSON.stringify(response)))
.catch(error => console.error('Error:', error));

非常感谢大家

【讨论】：