Question

在React Native中设置用于身份验证的API调用时遇到了一些麻烦。我使用以下代码：

fetch('http://myserver.ngrok.io/auth/login', {
        method: 'POST',
        body: {
            email: 'email@gmail.com',
            password: 'password',
        },
    })
        .then(() => {
            this.props.navigation.navigate('Main');
        })
        .catch(() => {
            this.props.navigation.navigate('Auth');
            console.error('Request Failed');
        });

我正在使用ngrok，因为起初我以为我的android仿真器/设备QR扫描无法连接到计算机的本地主机时遇到问题。我已经在邮递员中测试了对该ngrok端点的api调用，并且运行良好。但是，上面的代码总是给我我的Request Failed。

我已经在我的android模拟器和通过QR与我的android手机进行隧道测试中对此进行了测试。这是语法问题吗？

Answer 1

使用fetch发送JSON的正确方法取决于您的情况：

fetch('http://myserver.ngrok.io/auth/login', {
  method: 'POST',
  headers: {'Content-Type': 'application/json'}
  body: JSON.stringify({
    email: 'email@gmail.com',
    password: 'password',
  }),
})

注意JSON.stringify和标题。

此外，即使发生服务器错误，提取也将成功，并且用户可能输入无效的凭据，因此请在重定向到main之前检查服务器响应：

.then(resp => resp.json())
.then(data => this.props.navigation.navigate(data.correctCredentials ? 'Main' : 'Auth'))
.catch(...)

无法进行API调用React Native

1 个答案: