从搜索引擎，我结束了这个主题的非json发布数据与fetch，所以我认为我将添加这个。

对于非json，你不必使用表单数据。你可以简单地设置Content-Type头为application/x-www-form-urlencoded，并使用一个字符串:

fetch('url here', {
    method: 'POST',
    headers: {'Content-Type':'application/x-www-form-urlencoded'}, // this line is important, if this content-type is not set it wont work
    body: 'foo=bar&blah=1'
});

构建body字符串的另一种方法是使用库，而不是像上面那样将其输入。例如query-string或qs包中的stringify函数。所以使用它看起来像这样:

import queryString from 'query-string'; // import the queryString class

fetch('url here', {
    method: 'POST',
    headers: {'Content-Type':'application/x-www-form-urlencoded'}, // this line is important, if this content-type is not set it wont work
    body: queryString.stringify({for:'bar', blah:1}) //use the stringify object of the queryString class
});

您可以使用fill-fetch，这是fetch的扩展。简单地说，你可以像下面这样发布数据:

import { fill } from 'fill-fetch';

const fetcher = fill();

fetcher.config.timeout = 3000;
fetcher.config.maxConcurrence = 10;
fetcher.config.baseURL = 'http://www.github.com';

const res = await fetcher.post('/', { a: 1 }, {
    headers: {
        'bearer': '1234'
    }
});

// extend FormData for direct use of js objects
Object.defineProperties(FormData.prototype, { 
    load: {
       value: function (d) {
                   for (var v in d) {
                      this.append(v, typeof d[v] === 'string' ? d[v] : JSON.stringify(d[v]));
                   }
               }
           }
   })

var F = new FormData;
F.load({A:1,B:2});

fetch('url_target?C=3&D=blabla', {
        method: "POST", 
          body: F
     }).then( response_handler )

在ES2017 async/await支持下，如何POST一个JSON有效负载:

(async () => { const rawResponse =等待取回('https://httpbin.org/post'， { 方法:“文章”, 标题:{ “接受”:application / json, “内容类型”:“application / json” }， 身体:JSON。stringify({a: 1, b: '文本内容'}) })； const content = await rawResponse.json(); console.log(内容); }) ();

不能使用ES2017?参见@vp_art使用承诺的回答

然而，这个问题是由一个长期以来固定的chrome错误引起的问题。 以下是原来的答案。

chrome devtools甚至不显示JSON作为请求的一部分

这是真正的问题，这是chrome开发工具的一个bug，在chrome 46中修复。

这段代码工作得很好-它正确地发布了JSON，只是不能被看到。

我希望看到我发回的对象

这是行不通的，因为这不是JSfiddle的正确格式。

正确的代码是:

var payload = {
    a: 1,
    b: 2
};

var data = new FormData();
data.append( "json", JSON.stringify( payload ) );

fetch("/echo/json/",
{
    method: "POST",
    body: data
})
.then(function(res){ return res.json(); })
.then(function(data){ alert( JSON.stringify( data ) ) })

对于接受JSON有效负载的端点，原始代码是正确的

在花了一些时间后，反向工程jsFiddle，试图生成有效负载-有一个效果。

请采取眼睛(照顾)在线返回response.json();这里的回应不是回应，而是承诺。

var json = {
    json: JSON.stringify({
        a: 1,
        b: 2
    }),
    delay: 3
};

fetch('/echo/json/', {
    method: 'post',
    headers: {
        'Accept': 'application/json, text/plain, */*',
        'Content-Type': 'application/json'
    },
    body: 'json=' + encodeURIComponent(JSON.stringify(json.json)) + '&delay=' + json.delay
})
.then(function (response) {
    return response.json();
})
.then(function (result) {
    alert(result);
})
.catch (function (error) {
    console.log('Request failed', error);
});

jsFiddle: http://jsfiddle.net/egxt6cpz/46/ && Firefox > 39 && Chrome > 42

这与内容类型有关。正如你可能已经从其他讨论和这个问题的答案中注意到的，有些人能够通过设置Content-Type: 'application/json'来解决这个问题。不幸的是，在我的情况下，它没有工作，我的POST请求在服务器端仍然是空的。

然而，如果你尝试使用jQuery的$.post()，它可以工作，原因可能是因为jQuery使用Content-Type: 'x-www-form-urlencoded'而不是application/json。

data = Object.keys(data).map(key => encodeURIComponent(key) + '=' + encodeURIComponent(data[key])).join('&')
fetch('/api/', {
    method: 'post', 
    credentials: "include", 
    body: data, 
    headers: {'Content-Type': 'application/x-www-form-urlencoded'}
})