Question

我有一个提取，其中请求类型似乎正在改变，这弄乱了我的帖子。我提交我的基本表格（仅限一个字段）。这是获取。

      handleSubmit(event, data) {
    //alert('A name was submitted: ' + this.state.value);
    event.preventDefault();
    console.log("SUBMIT STATE::", this.state.value);
    return (
        fetch("//localhost:5000/api/values/dui/", {
            method: "post",
            mode: 'no-cors',
            headers: {
                'Access-Control-Allow-Origin': '*',
                'Content-Type': 'application/json',
                'Accept': 'application/json',                  
            },
            body: JSON.stringify({
                name: this.state.value,
            })
        }).then(response => {
            if (response.status >= 400) {
                this.setState({
                    value: 'no greeting - status > 400'
                });
                throw new Error('no greeting - throw');
            }
            return response.text()
        }).then(data => {
            var myData = JSON.parse(data);
            this.setState({
                greeting: myData.name,
                path: myData.link
            });
        }).catch(() => {
            this.setState({
                value: 'no greeting - cb catch'
            })
        })
    );


}

但是当我在fiddler中看到这个内容时，类型现在是＆＃39; content-type：text / plain; charset = UTF-8＆＃39;。这是原始的提琴手：

POST http://localhost:5000/api/values/dui/ HTTP/1.1
Host: localhost:5000
Connection: keep-alive
Content-Length: 16
accept: application/json
Origin: http://evil.com/
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36

content-type：text / plain; charset = UTF-8 推荐人：http://localhost:3000/ Accept-Encoding：gzip，deflate，br Accept-Language：en-US，en; q = 0.8

{"name":"molly"}

在DOM Inspector中，我看到：

POST http://localhost:5000/api/values/dui/ 415（不支持的媒体类型）

我也觉得很奇怪“接受”＃39;是小写以及内容类型＆＃39;。任何原因发生这种情况。我还没有在我的搜索中发现任何具体内容。

Answer 1

为请求设置mode: 'no-cors'时，浏览器不允许您设置CORS-safelisted request-headers以外的任何请求标头。见the spec requirements about adding headers：

要将名称/值（名称 / 值）对附加到Headers对象（标题），请运行这些步骤进行：


否则，如果 guard 为“request-no-cors”且名称 / 值不是CORS-safelisted request-header，则返回

在该算法中，return等同于“返回而不将该标题添加到Headers对象”。

之所以将其设置为text/plain;charset=UTF-8是因为the algorithm for the request constructor调用extract a body algorithm，其中包括以下步骤：

启用对象的类型：

↪ USVString


将Content-Type设为text/plain;charset=UTF-8。

Answer 2

所以这就解决了这个问题，我把'no-cors'改为'cors'。坦率地说，之前因为我在我的本地开发工作站和我正在部署的服务器之间的交叉原因问题，我认为我已经翻转了这些问题，但不用说，当我将其设置回模式时：'cors'，这一切都再次起作用。本地工作站和服务器。为什么会改变实际的请求标头，我不确定。如果有人有答案，我会很高兴地投票。

感谢。

在fiddler中查看时，React - 获取帖子内容类型正在发生变化

2 个答案: