Реагировать на нативную аутентификацию с использованием бэкэнд-API laravel

Я новичок в реакции-родной. В настоящее время я пытаюсь установить логин react-native с помощью Laravel API. API, который я использовал, уже протестирован и работает. Но когда я попытался вставить реагирующий натив, он показывает ошибку, пока я вызываю API. Предупреждение в эмуляторе: Возможный отказ от необработанного обещания (id:0): TypeError: Ошибка сетевого запроса

Вот мой код.

import React, { Component } from 'react';
import {
    StyleSheet,
    View,
    TextInput,
    Text,
    TouchableOpacity,
    Alert,
    AsyncStorage,
} from 'react-native';
import {Actions} from 'react-native-router-flux';
import Logo from '../components/Logo';


export default class Login extends Component   {

    constructor(props) {
        super(props);
        this.state = {
            email: "",
            password: ""
        }
    };
    signup(){
        Actions.signup()
    }
    home(){
        Actions.home()
    }
    handleLogin = () => {
        fetch('http://localhost:8888/api/login',{
            method: 'POST',
            header:{
                'Accept': 'application/json',
                'Content-Type': 'application/json'
            },
            body: JSON.stringify({
                email: this.state.email,
                password: this.state.password,
            })
        })
        .then((response) => response.json())
        .then((res) => {

            if (res.success === true){

                alert(res.message)

            }else{
                alert(res.message)
            }

           alert('test')
        })
    }
    render() {
        return (
            <View style={styles.container}>
                <Logo/>

                <View style={styles.inputContainer}>
                    <TextInput style={styles.inputBox}
                        underlineColorAndroid='0,0,0,0'
                        placeholder='Email'
                        placeholderTextColor= 'grey'
                        keyboardType= 'email-address'
                        onChangeText={(text) => this.setState({email:text})}
                        onSubmitEditing={()=> this.password.focus()}
                    />

                    <TextInput style={styles.inputBox}
                        underlineColorAndroid='0,0,0,0'
                        placeholder='Password'
                        placeholderTextColor= 'grey'
                        secureTextEntry= {true}
                        ref={(input) => this.password = input}
                        onChangeText={(text) => this.setState({password:text})}

                    />
                    <TouchableOpacity style={styles.button} onPress={this.handleLogin}>
                        <Text style={styles.buttonText}>Login</Text>
                    </TouchableOpacity>
                </View>  

                <View style={styles.signupText}>
                    <Text>Don't have an account? </Text>
                    <TouchableOpacity onPress={this.signup}>
                        <Text style={styles.signupButton}>Signup</Text>
                    </TouchableOpacity>
                </View>

            </View>
        );
    }

}

Кто-нибудь знает, в чем проблема?


person SAS231    schedule 02.04.2020    source источник
comment
Что вы получите, если добавите это в конец последнего .then((res) => вызова .catch((e) => console.log('Error: ', e))   -  person speak    schedule 02.04.2020
comment
можете ли вы поместить headers вместо header в свою выборку в функции handleLogin.   -  person Akhil Nayak    schedule 02.04.2020
comment
@ HY98 дайте мне знать, если это не сработает.   -  person Akhil Nayak    schedule 02.04.2020
comment
@AkhilNayak это не работает.   -  person SAS231    schedule 02.04.2020
comment
@speak u означает .then((response) => response.json()) .then((res) => { if (res.success === true){ alert(res.message) }else{ alert(res.message) } alert('test') }) .catch((e) => console.log('Error: ', e)) вот так?   -  person SAS231    schedule 02.04.2020
comment
какую ошибку вы получили после добавления оператора catch?   -  person Akhil Nayak    schedule 02.04.2020
comment
Да — см. developer.mozilla.org/en-US/ docs/Web/JavaScript/Guide/ -- вы должны получить запись об ошибке, а не полный сбой.   -  person speak    schedule 02.04.2020
comment
Ошибка: [TypeError: Ошибка сетевого запроса] вот что я получаю   -  person SAS231    schedule 02.04.2020
comment
Посмотрите этот ответ: stackoverflow.com/a/55834683/11380693   -  person Akhil Nayak    schedule 02.04.2020
comment
@AkhilNayak становится все хуже, после того, как я добавил этот код, я даже не могу запустить Android   -  person SAS231    schedule 02.04.2020
comment
какую ошибку вы получили?   -  person Akhil Nayak    schedule 02.04.2020
comment
› Задача :app:generateDebugBuildConfig FAILED   -  person SAS231    schedule 02.04.2020
comment
ошибка Не удалось установить приложение. Убедитесь, что у вас настроена среда разработки Android: facebook.github.io/react-native/docs/. Запустите CLI с флагом --verbose для получения дополнительных сведений. Ошибка: сбой команды: приложение gradlew.bat: installDebug -PreactNativeDevServerPort = 8081   -  person SAS231    schedule 02.04.2020
comment
это ошибка, пока я реагирую на собственный запуск Android   -  person SAS231    schedule 02.04.2020
comment
не могли бы вы запустить cd android && gradlew clean, а затем cd.. && react-native run-android   -  person Akhil Nayak    schedule 02.04.2020
comment
если это все еще не работает, сбросьте свой код до последнего git push, и мне жаль, что я не могу вам в этом помочь.   -  person Akhil Nayak    schedule 02.04.2020
comment
Я сделал. Потом вылазит ошибка   -  person SAS231    schedule 02.04.2020
comment
@AkhilNayak Все в порядке, большое спасибо за попытку помочь мне.   -  person SAS231    schedule 02.04.2020


Ответы (1)


Проблема решена путем настройки adb и использования команды adb reverse.

ПРИМЕР

adb reverse tcp:8081 tcp:3333

https://stackoverflow.com/a/39108921/12988525

person SAS231    schedule 02.04.2020