如何使用fetch发送数组？（Javascript）

我正在尝试使用fetch发送一个数组，如下所示：

{"cards":[[189,2],[211,2],[238,2],[778,2],[985,2],[1008,2],[1073,2],[1171,2],[48886,2],[49161,2],[49164,2],[49184,1],[49356,2],[50372,2],[51722,1],[52422,2]],"heroes":[1066],"format":2}

以下是我正在尝试的：

 getCardsForDeck = deck => {
    var stringifiedDeck = JSON.stringify(deck);
    console.log("stringifiedDeck:" + stringifiedDeck);
    fetch(`http://localhost:3001/api/getCardsForDeck`, {
      method: "PUT",
      body: stringifiedDeck
    })
      .then(cards => cards.json())
      .then(res => this.setState({ cards: res.cards }));
  };

但我遇到了一个错误：

Unhandled Rejection (SyntaxError): Unexpected token < in JSON at position 0

未处理的拒绝（SyntaxError）：JSON中位置0处的意外标记<

如果不使用JSON.stringify（）发送此数据，我该如何发送？或者我必须编辑数据以删除括号吗

在“网络”选项卡中检查api时，它给出以下信息：

     SyntaxError: Unexpected token o in JSON at position 1
[0]     at JSON.parse (<anonymous>)
[0]     at parse (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\body-parser\lib\types\json.js:89:19)
[0]     at C:\Users\User\projects\webapp\deck-editor\backend\node_modules\body-parser\lib\read.js:121:18
[0]     at invokeCallback (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:224:16)
[0]     at done (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:213:7)
[0]     at IncomingMessage.onEnd (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:273:7)
[0]     at IncomingMessage.emit (events.js:194:15)
[0]     at endReadableNT (_stream_readable.js:1125:12)
[0]     at process._tickCallback (internal/process/next_tick.js:63:19)
[0] SyntaxError: Unexpected token o in JSON at position 1
[0]     at JSON.parse (<anonymous>)
[0]     at parse (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\body-parser\lib\types\json.js:89:19)
[0]     at C:\Users\User\projects\webapp\deck-editor\backend\node_modules\body-parser\lib\read.js:121:18
[0]     at invokeCallback (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:224:16)
[0]     at done (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:213:7)
[0]     at IncomingMessage.onEnd (C:\Users\User\projects\webapp\deck-editor\backend\node_modules\raw-body\index.js:273:7)
[0]     at IncomingMessage.emit (events.js:194:15)
[0]     at endReadableNT (_stream_readable.js:1125:12)
[0]     at process._tickCallback (internal/process/next_tick.js:63:19)

SyntaxError:JSON中位置1处的意外标记o
[0]位于JSON.parse（）
[0]在解析时（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\body parser\lib\types\json.js:89:19）
[0]位于C:\Users\User\projects\webapp\deck editor\backend\node\u modules\body parser\lib\read.js:121:18
[0]位于invokeCallback（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:224:16）
[0]完成时（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:213:7）
[0]位于IncomingMessage.onEnd（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:273:7）
[0]位于IncomingMessage.emit（events.js:194:15）
[0]位于endReadableNT（_stream_readable.js:1125:12）
[0]在进程中。_tick回调（internal/process/next_tick.js:63:19）
[0]SyntaxError:JSON中位置1处的意外标记o
[0]位于JSON.parse（）
[0]在解析时（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\body parser\lib\types\json.js:89:19）
[0]位于C:\Users\User\projects\webapp\deck editor\backend\node\u modules\body parser\lib\read.js:121:18
[0]位于invokeCallback（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:224:16）
[0]完成时（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:213:7）
[0]位于IncomingMessage.onEnd（C:\Users\User\projects\webapp\deck editor\backend\node\u modules\raw body\index.js:273:7）
[0]位于IncomingMessage.emit（events.js:194:15）
[0]位于endReadableNT（_stream_readable.js:1125:12）
[0]在进程中。_tick回调（internal/process/next_tick.js:63:19）

您似乎在期待

http://localhost:3001/api/getCardsForDeck

将JSON发送回在您将JSON发送给它之后。它很可能是用HTML响应的，而不是JSON

该代码中还有两个其他错误：

您需要说明发送的内容，因为它不是默认的URI编码数据：

fetch(`http://localhost:3001/api/getCardsForDeck`, {
  method: "PUT",
  body: stringifiedDeck,
  headers: {                              // ***
    "Content-Type": "application/json"    // ***
  }                                       // ***
})

您需要检查响应的状态。（每个人都忽略了这一点。）最简单的方法是检查响应上的

ok

标志：

fetch(`http://localhost:3001/api/getCardsForDeck`, {
  method: "PUT",
  body: stringifiedDeck,
  headers: {
    "Content-Type": "application/json"
  }
})
.then(response => {
  if (!response.ok) {                                  // ***
    throw new Error("HTTP error " + response.status);  // ***
  }                                                    // ***
  // ...use `response.json`, `response.text`, etc. here
})
.catch(error => {
  // ...handle/report error
});

---

此错误消息表明，您得到的很可能不是JSON。因为它以

开头，所以
http://localhost:3001/api/getCardsForDeck
通过回显您放回的内容来回应？您的代码似乎认为它会。通常，它会发送自己的响应，可能是JSON、文本或HTML……您的api函数可能会输出错误：您可能需要指定返回的数据类型，例如，api正在返回XML，您需要JSON。在#2中的此调用将在任何其他调用正确之前进行？这将是第一个“那么”？事实上，我现在明白了，现在正在做出改变@戴维达欣-没错，是的。通常在第一个
之后的
末尾，您将有
返回response.json（）
（如果您需要JSON）或
返回response.text（）
（如果您需要文本）等，其中我有上面的“使用
response.json
，
response.text，等等”，然后是另一个
，然后是“实际使用数据”。@davidahines-是的，因为根据定义，json是文本。（因此，如果您使用的是JavaScript代码，而不是字符串，那么您就没有使用JSON。）如果您没有使用
JSON.stringify
，那么它就不是JSON，而是一个对象。（这并不能阻止很多lib为您转换为JSON，但我99%确定
fetch
不会。：-）设置此选项后，很容易找到问题。谢谢