Skip to content

TypeError: Network request failed(…)  #5

@gerardus1995

Description

@gerardus1995

I've been trying to solve this problem but i got no luck so far. I'm doing almost the same as the examples of documentation. I want my app to get the info of the url im providing. In the console i get the error as the title says "TypeError: Network request failed(…) ".Here is my code for it:

`'use strict';

import React, { Component } from 'react';
import {
StyleSheet,
View,
Text,
DrawerLayoutAndroid,
StatusBar,
Image,
ToastAndroid,
ScrollView
} from 'react-native';

import {
MKProgress,
MKSpinner,
} from 'react-native-material-kit';

var MyToolbar = require('./MyToolbar');
import Button from 'react-native-button';
import Icon from 'react-native-vector-icons/MaterialIcons';
import RNBackbone from 'react-native-backbone';
import fetchStorage from 'react-native-backbone/src/storages/fetch';

const styles2 = StyleSheet.create({
progress: {
width: 370,
height: 4,

},
spinner: {
width: 22,
height: 22,
},
});

class BoatsContent extends Component {
constructor() {
super();
this.state = {
isLoading: true
};

    fetchStorage.globalOptions.headers = {
        "Authorization": "Bearer AUTH_TOKEN"
    };

    var Businesses = RNBackbone.Collection.extend({
        url: 'http://api.example.com',
    });

    var businesses = new Businesses();

    businesses.fetch({
        success: () => {
            console.log(businesses);
            this.setState({isLoading: false});
        },
        error: (model, error) => {
            console.log(error);
            console.log(this.state.isLoading);
            console.log(businesses);
        }
    });
}  

render() {
if (this.state.isLoading) {
return (
<DrawerLayoutAndroid
drawerWidth={300}
drawerPosition={DrawerLayoutAndroid.positions.Left}
renderNavigationView={() => this.props.navigationView}
ref={'DRAWER'}>

        <View style={[styles.row,{ flex: 0.11 } ]}>
            <View style={[styles.container,{ flex: 1 }]}>
                <MyToolbar style={styles.toolbar} title={this.props.title} sidebarRef={()=>this._setDrawer()} openIcon={()=>this.gotoNext()}/>
                <StatusBar backgroundColor='#01A0B4' />
            </View>
        </View>
        <ScrollView>
            <MKProgress.Indeterminate
              style={styles2.progress}
            />
            <Text>Fetching from API, please wait...</Text>
            <View style={[styles.container,{ flex: 1.2, marginTop: 410, marginLeft: 250}]}>             
                <Button
                    containerStyle={{padding:23, height:60, width: 60, overflow:'hidden', borderRadius:100, backgroundColor: '#01BCD4'}}
                    style={{fontSize: 30, color: 'white'}}>
                    <Image pointerEvents="none" source={require('./img/plus_white.png')} />
                </Button>
            </View>
        </ScrollView>
      </DrawerLayoutAndroid>      
    );      

} else {
    return (
      <DrawerLayoutAndroid
        drawerWidth={300}
        drawerPosition={DrawerLayoutAndroid.positions.Left}
        renderNavigationView={() => this.props.navigationView}
        ref={'DRAWER'}> 

        <View style={[styles.row,{ flex: 0.11 } ]}>
            <View style={[styles.container,{ flex: 1 }]}>
                <MyToolbar style={styles.toolbar} title={this.props.title} sidebarRef={()=>this._setDrawer()} openIcon={()=>this.gotoNext()}/>
                <StatusBar backgroundColor='#01A0B4' />
            </View>
        </View>
        <ScrollView>
            <Text>Successfully fetched {this.business.length} models from REST api</Text>
            <View style={[styles.container,{ flex: 1.2, marginBottom: 20, marginRight:20}]}>                
                <Button
                    containerStyle={{padding:23, height:60, width: 60, overflow:'hidden', borderRadius:100, backgroundColor: '#01BCD4'}}
                    style={{fontSize: 30, color: 'white'}}>
                    <Image pointerEvents="none" source={require('./img/plus_white.png')} />
                </Button>
            </View>
        </ScrollView>
      </DrawerLayoutAndroid>      
    );
}

}

_setDrawer() {
this.refs['DRAWER'].openDrawer();
}

}

const styles = StyleSheet.create({
container: {
flex: 1,
alignItems: 'center',
},
toolbar: {
height: 56,
backgroundColor: '#01BCD4',
width: 370,
alignItems: 'center'
},
fab: {
width: 60,
height: 60,
borderRadius: 100,
borderColor: '#01BCD4',
backgroundColor: '#01BCD4',
marginLeft: 285,
marginTop: 410,
},
});

module.exports = BoatsContent;`

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions