Question

我正在使用npm＆＃39; isomorphic-fetch＆＃39;发送请求。我遇到的问题是我无法设置请求标头的内容类型。

我设置了application / json的内容类型，但是请求标头被设置为text / plain。

import 'isomorphic-fetch';

  sendRequest(url, method, body) {
    const options = {
      method: method,
      headers:{'content-type': 'application/json'},
      mode: 'no-cors'
    };

    options.body = JSON.stringify(body);

    return fetch(url, options);
  }

当我在浏览器中检查请求时，内容类型为o：

content-type:text/plain;charset=UTF-8

任何人都可以解释为什么我无法设置此属性吗？

Answer 1

我在阅读了以下文章后找到了答案：

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#Headers

守护
由于标头可以在请求中发送并在响应中接收，并且对于哪些信息可以且应该是可变的具有各种限制，因此标头对象具有保护属性。这不会暴露给Web，但会影响头对象上允许的突变操作。

可能的保护值是：

none：默认。

request：保护从请求中获取的标头对象（Request.headers）。

request-no-cors：保护从使用Request.mode no-cors创建的请求中获取的标头对象。

response：保护从响应中获得的标头（Response.headers）。

immutable：主要用于ServiceWorkers;将标头对象呈现为只读。

注意：您不得附加或设置request受保护的标头Content-Length标头。同样，不允许在响应头中插入Set-Cookie：不允许ServiceWorkers通过合成响应设置cookie。

当options mode属性设置为no-cors时，请求标头值是不可变的。

相反，我将mode属性设置为cors。

Answer 2

您需要创建一个fetch header对象。

sendRequest(url, method, body) {
    const options = {
        method: method,
        headers: new Headers({'content-type': 'application/json'}),
        mode: 'no-cors'
    };

    options.body = JSON.stringify(body);

    return fetch(url, options);
}

使用Fetch APi时如何设置请求标头的内容类型

2 个答案: