fetch is not work in IOS simulator with React Native 0.44

Question

Fetch is not working in IOS simulator with React Native 0.44. I'm trying to create a login form in react native using fetch.

This is my code,

login.ios.js

import React, { Component } from 'react';
import { StyleSheet,TextInput,ActivityIndicatorIOS,TouchableHighlight, Text, View } from 'react-native';

class Login extends Component {
  constructor(){
    super();
    this.state = {
      reg_mob_no: "",
      password: "",
      error: "",
      showProgress: false,
    }
  }


  async onLoginPressed() {
    this.setState({showProgress: true})
    try {
      let response = await fetch('http://example.in/api/premiumuser/login', {
                              method: 'POST',
                              headers: {
                                'Accept': 'application/json',
                                'Content-Type': 'application/json',
                              },
                              body: JSON.stringify({
                                  reg_mob_no: this.state.reg_mob_no,
                                  password: this.state.password,
                              })
                            });
      let res = await response.text();
      console.log("res is:" + res );
    } catch(error) {
    }
  }
  render() {

    return (
      <View style={styles.container}>
        <Text style={styles.heading}>
              Login Form!
            </Text>
        <TextInput
          onChangeText={ (text)=> this.setState({reg_mob_no: text}) }
          style={styles.input} placeholder="Registered Mobile No">
        </TextInput>
        <TextInput
          onChangeText={ (text)=> this.setState({password: text}) }
          style={styles.input}
          placeholder="Password"
          secureTextEntry={true}>
        </TextInput>
        <TouchableHighlight onPress={this.onLoginPressed.bind(this)} style={styles.button}>
          <Text style={styles.buttonText}>
            Login
          </Text>
        </TouchableHighlight>

        <Text style={styles.error}>
          {this.state.error}
        </Text>


      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'flex-start',
    alignItems: 'center',
    backgroundColor: '#F5FCFF',
    padding: 10,
    paddingTop: 80
  },
  input: {
    height: 50,
    marginTop: 10,
    padding: 4,
    fontSize: 18,
    borderWidth: 1,
    borderColor: '#48bbec'
  },
  button: {
    height: 50,
    backgroundColor: '#48BBEC',
    alignSelf: 'stretch',
    marginTop: 10,
    justifyContent: 'center'
  },
  buttonText: {
    fontSize: 22,
    color: '#FFF',
    alignSelf: 'center'
  },
  heading: {
    fontSize: 30,
  },
  error: {
    color: 'red',
    paddingTop: 10
  },
  success: {
    color: 'green',
    paddingTop: 10
  },
  loader: {
    marginTop: 20
  }
});


module.exports = Login;

I am not getting any response from server when clicked on registerbutton.

This same source in working with expo but not working in ios simulator. Developer tool showing nothing.

How to solve this issue.. Please help!!!

React Native version: 0.44 Platform: IOS Development Operating System: mac os 10.12 Build tools: Xcode 9

Answer 1

Try to include the key-value pair credentials: 'include' in fetch options. RN 0.44 introduced withCredentials XHR flag, as you can see here.