React Native / Expo：Fetch 抛出“网络请求失败”

Question

我看到了几个关于这个主题的帖子，但没有结果。一方面，我有一个收集信息（姓名、名字等）然后将其保存在数据库（mongodb）中的表单。当我使用邮递员通过路由/注册发送我的信息时，一切正常，我可以在 mongodb 中看到我的新用户。但是当我在 Expo 上启动应用程序时，他向我抛出“网络请求失败”。

前端获取：

submitForm = () => {
  var signupData = JSON.stringify({
    first_name: this.state.firstName,
    last_name: this.state.lastName,
    email: this.state.email,
    password: this.state.password
  });

  fetch(`https://localhost:3000/signup`, {
    method: "POST",
    headers: { "Content-Type": "application/json" },
    body: signupData
  })
    .then(response => {
      console.log(response);
      return response.json();
    })
    .then(data => {
      if (data.result) {
        this.props.handleUserValid(
          this.state.firstName,
          this.state.lastName,
          this.state.email,
          data.user.token
        );
        this.props.navigation.navigate("Account");
      }
    })
    .catch(error => {
      console.error(error);
    });
};

和后端路由：

router.post("/signup", function(req, res, next) {
  var salt = uid2(32);

  console.log("Signup is running...");
  const newUser = new userModel({
    first_name: req.body.first_name,
    last_name: req.body.last_name,
    email: req.body.email,
    password: SHA256(req.body.password + salt).toString(encBase64),
    token: uid2(32),
    salt: salt
  });
  newUser.save(function(error, user) {
    console.log("LOG: user", user);
    res.json({ result: true, user });
  });
});

module.exports = router;

这是错误的屏幕截图

再次使用 Postman 时，获取工作正常，我的控制台日志被打印出来并且用户添加到我的数据库中。谢谢您的帮助。

- 编辑 -

我通过 Expo 在 Web 浏览器中启动了该应用程序，一切正常。我的登录/注册页面和我的帐户页面。但是在我的手机上它不起作用（IOS），这是我手机的网络问题（可能是证书问题，IP错误？）

如果你有一个我感兴趣的想法，我已经坚持了 2 天

Answer 1

React-native Expo 和 Python Django 后端也有同样的问题。问题是关于模拟器本地主机和服务器本地主机之间的冲突。您的后端服务器可能在 127.0.0.1:8000 上运行，但模拟器找不到它。

在终端中，使用命令“ipconfig”找到您的 Ipv4-Address。 例如，它将是 192.138.1.40

在此之后将其放入您的提取中（'http://192.138.1.40:8000/'）。
同样重要的是 -使用相同的主机和端口运行您的后端服务器。
以python Django为例：

py manage.py runserver 192.138.1.40:8000

在 Django 上，您还需要在 settings.py 中添加 ALLOWED_HOSTS = ['192.138.1.40']

Answer 2

我对世博会也有同样的问题：获取错误。对于我的后端。我使用 json-server 来模拟 API 数据。就我而言，json 服务器在 http://localhost:3000/playlist 上运行

我没有使用 fetch("http://localhost:3000/playlist") ，而是 fetch( http://10.0.2.2:3000/playlist )，然后它就工作了。使用Android模拟器，找不到服务器地址。

至于为什么使用10.0.2.2，请查看这里。为什么我们使用 10.0.2.2 连接到本地 Web 服务器而不是在 Android 客户端中使用计算机 IP 地址

Answer 3

你应该检查一下网址

• https://localhost:3000/signup（X）
• http://localhost:3000/signup(O)

不是 HTTPS