React Native-网络请求失败

时间:2018-07-29 19:52:48

标签: react-native app-transport-security

我是ReactNative的新手,正尝试用Wordpress网站的凭据编写一个简单的登录表单。我在模拟器和真实设备上始终收到以下错误:

Error Screen:

反应代码:

constructor(props) {
        super(props);
        this.validate = this.validate.bind(this);
        this.state = {
            validating: false,
            email: '',
            password: ''
        };
    }

render() {
        return (
            <View style={styles.container}>
                <TextInput style={styles.input}
                    onChangeText={(text) => this.setState({email:text})}
                    autoCapitalize="none" 
                    onSubmitEditing={() => this.passwordInput.focus()} 
                    autoCorrect={false} 
                    keyboardType='email-address' 
                    returnKeyType="next" 
                    placeholder='Nutzername'
                    placeholderTextColor='rgba(225,225,225,0.7)' />
                <TextInput style = {styles.input}
                    onChangeText={(text) => this.setState({password:text})}   
                    returnKeyType="go"                     
                    placeholder='Passwort' 
                    secureTextEntry
                    placeholderTextColor='rgba(225,225,225,0.7)' />
                <TouchableOpacity style={styles.buttonContainer} onPress={this.validate}>
                    <Text style={styles.buttonText}>LOGIN</Text>
                </TouchableOpacity> 
            </View>
        );
    }
validate(){
    this.setState({ validating: true });

    let formData = new FormData();
    formData.append('type', 'login');
    formData.append('email', this.state.email);
    formData.append('password', this.state.password);

    return fetch('http://myEbEnv.elasticbeanstalk.com/authentication.php', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json'
        },
        body: formData
    })
    .then((response) => response.json())
    .then((responseJson) => {
        console.log('Success!');
    })
    .catch((error) => {
        console.error(error);
    });
}

我的信息列表:

<key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoadsInWebContent</key>
        <true/>
        <key>NSAllowsArbitraryLoads</key>
        <true/>
        <key>NSExceptionDomains</key>
        <dict>
            <key>localhost</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
            <key>http://myEbEnv.elasticbeanstalk.com</key>
            <dict>
                <key>NSExceptionAllowsInsecureHTTPLoads</key>
                <true/>
            </dict>
        </dict>
    </dict>

我看不到问题出在哪里。第504行的错误(请参见屏幕截图)是来自失败的XMLHttpRequest的错误消息。任何想法如何解决?预先感谢!

1 个答案:

答案 0 :(得分:1)

您不应将协议包括在例外域中。它应该只包含域:

PS C:\Users\Tomasz> $c|gm




  S C:\Users\Tomasz> $c


City               : 
Country            : 
Department         : 
DisplayName        : John Doe
DistinguishedName  : CN=John Doe,CN=Users,DC=domain,DC=com
EmailAddress       : jdoe@domain.com
Enabled            : False
Fax                : 
GivenName          : John
MobilePhone        : 
Name               : John Doe
ObjectClass        : user
ObjectGUID         : cdb9a45c-80f4-4919-bf43-5db8d9ca83da
Office             : 
OfficePhone        : 
PostalCode         : 
SamAccountName     : jdoe
SID                : S-1-5-21-2025429266-2000478354-1606980848-16934
State              : 
StreetAddress      : 
Surname            : Doe
Title              : 
UserPrincipalName  : jdoe@domain.com

如果是引起问题的原因是与myEbEnv.elasticbeanstalk.com的连接,那么您现在应该可以通过HTTP进行连接。