Post方法中的JSON格式错误

问题描述

我正在尝试提交POST请求,但收到错误状态代码400,因为我发送的数据格式错误,但我不知道该如何格式化。

Web API应该采用这种格式(Web API运行良好,如果我通过邮递员发送数据,我不会遇到任何麻烦):

[{ "word": "string","Box": 0 }]

这是我发送的:

"["{\"word\": \"Value\",\"Box\": 0 }"]"

有什么格式吗?

这是简化的整个代码

<form onsubmit="handlePostSubmit()" id="formPost">

  <div>
    <input type="checkBox" id="chk01" name="ckbWord" value="Value" defaultChecked></input>
    <label for="chk01"> value</label>
  </div>

  <button type="submit" form="formPost" value="Submit">Submit</button>
</form>

<script>
function getWords() {
  const words = document.forms[0];
  var txt = "";
  for (var i = 0; i < words.length; i++) {
    if (words[i].checked) {
      txt += '{"word": "' + words[i].value + '","Box": 0 }';
    }
  }
  return txt;
}

function handlePostSubmit() {
//  params.preventDefault();

  const words = getWords();
  alert(words);
  var x = create(words)
            .then(() => {
                //Todo: Msg of ok or error
    alert("Ok")
            });
  alert(x);
}

async function create(params) {
    const response = await fetch("https://localhost:44312/words",{
        method: 'POST',headers: {
            'Content-Type': 'application/json',},body: JSON.stringify([params]),});
    if (response.ok) {
        const resposta = await response.json();
        return resposta;
    }
    throw new Error('Error to save words');
}
</script>

解决方法

我认为不需要使用字符串来构建JSON。

您可以像这样简单地推动对象:

const wordsFromDoc = document.forms[0]
const words = []
for (var i = 0; i < words.length; i++) {
   if (words[i].checked) {
     words.push({ word: words[i].value,box: 0 });
   }
}

return words;

然后您可以将它们传递并稍后JSON.stringify(),而无需将其包装在数组中。

const response = await fetch("https://localhost:44312/words",{
    method: 'POST',headers: {
        'Content-Type': 'application/json',},body: JSON.stringify(params),});
,

请注意,您尝试自己制作json字符串,并且在确定,时包括丢失的txt是造成错误的原因。 我们可以修复它,但我认为您应该更改实现方式。

我建议使用数组而不是字符串。例如:

function getWords() {
  const words = document.forms[0];
  const wordsArray = [];
  for (var i = 0; i < words.length; i++) {
    if (words[i].checked) {
      wordsArray.push({word: words[i].value,box: 0 });
    }
  }
  return wordsArray;
}

然后再执行JSON.stringify(param)