ajax – 为什么React fetch()向服务器发送2个请求？

fetch('/api/addUserObject',{
      method: 'POST',headers: {
        'Accept': 'application/json','Content-Type': 'application/json'
      },body: JSON.stringify({...this.state,token: this.props.userData.token,profile: this.props.currentProfile }),}).then(response => response.json())
      .then(data => {
        console.log(data);
      });

当我在Chrome中打开网络日志时,我看到如下内容：

那么为什么有2个请求而不是1个？它们都在服务器端被接受.

此请求由onClick事件处理：

<div className="btn" onClick={this.handleSubmit} /></div>

问题是,这是一个POST请求,我需要在此获取数据,因此一个请求(如果它发送标头以检查交叉原点),则在服务器上启动错误.

组件代码很大,所以我将它表示为：

<StyledDiv>
  <FormControl>...</FormControl>
  <FormControl>...</FormControl>
  <FormControl>...</FormControl>
  <FormControl>...</FormControl>
  <div className="btn" onClick={this.handleSubmit} /></div>
</StyiledDiv>