Question

我使用此功能从我的API获取数据。它会将电子邮件和密码发布到我的API

onSubmitSignIn = () => {
  fetch('http://localhost:3001/signin', {
    method: 'post',
    headers: {'Content-Type': 'application/json'},
    body: JSON.stringify({
      email: this.state.signInEmail,
      password: this.state.signInPassword
    })
  })
    .then(response => response.json())
    .then(data => {
      if (data === 'login success') {
        this.props.onRouteChange('home');
      }
    })
    .catch((e) => console.log(e))
};

，此请求将在API中处理

app.post('/signin', (req, res) => {
    if (req.body.email === db.users[0].email && req.body.password === db.users[0].password) {
        res.json('login success')
    } else {
        res.json('login fail')
    }
});

这将导致TypeError: NetworkError when attempting to fetch resource.

但是，如果移除了.then并且下面添加了this.props.onRouteChange('home');

onSubmitSignIn = () => {
    fetch('http://localhost:3001/signin', {
        method: 'post',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({
            email: this.state.signInEmail,
            password: this.state.signInPassword
        })
    })

    this.props.onRouteChange('home');
};

它会起作用，我可以毫无错误地登录。

但是，如果this.props.onRouteChange('home');被删除，则仍然会显示相同的错误

onSubmitSignIn = () => {
    fetch('http://localhost:3001/signin', {
        method: 'post',
        headers: {'Content-Type': 'application/json'},
        body: JSON.stringify({
            email: this.state.signInEmail,
            password: this.state.signInPassword
        })
    })
};

我还用Postman仔细检查了我的API，并且帖子请求成功了。

这对我来说是一个奇怪的问题，我是javascript的新手，请原谅我，如果这恰好是一个粗心的新手错误。感谢。

P.S。如果需要更多代码，请告诉我。

Answer 1

您是否在托管该应用的同一客户端上运行该应用？尝试将localhost更改为客户端的LAN IP，看看是否有所作为？

无法使用fetch，NetworkError获取资源

1 个答案: