首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >TypeError:网络请求失败

TypeError:网络请求失败
EN

Stack Overflow用户
提问于 2019-10-01 20:45:49
回答 1查看 129关注 0票数 0

我在学校里有一个小项目,是使用React-native的。我的工作是读取数据库(localhost)中的数据并渲染到平面列表中。像标题这样的问题,我已经在许多页面中看到了一些需要修复的解决方案,但它不work.That是我的routes.js代码:

代码语言:javascript
运行
复制
const express = require('express');
const bodyParser = require('body-parser');
const mysql = require('mysql');

const connection = mysql.createPool({
  host     : 'localhost',
  user     : 'root',
  password : '',
  database : 'mangareader'
});
const app = express();

// Creating a GET route that returns data from the 'users' table.
app.get('/manga', function (req, res) {
    // Connecting to the database.
    connection.getConnection(function (err, connection) {

    // Executing the MySQL query (select all data from the 'users' table).
    connection.query('SELECT * FROM manga', function (error, results, fields) {
      // If some error occurs, we throw an error.
      if (error) throw error;

      // Getting the 'response' from the database and sending it to our route. This is were the data is.
      res.send(results)
    });
  });
});

// Starting our server.
app.listen(3000, () => {
 console.log('Go to http://localhost:3000/manga so you can see the data.');
});

这就是我的渲染代码:

代码语言:javascript
运行
复制
import React, {Component} from 'react';
import {
    FlatList,
    StyleSheet,
    View,
    Text,
    ActivityIndicator,
  } from 'react-native'; 


  export default class MangaList extends Component {

    constructor(props){
        super(props);
        this.state ={ isLoading: true}
      }

      componentDidMount(){
        return fetch('192.168.1.5:3000/manga')
          .then((response) => response.json())
          .then((responseJson) => {

            this.setState({
              isLoading: false,
              dataSource: responseJson.manga,
            }, function(){

            });

          })
          .catch((error) =>{
            console.error(error);
          });
      }



      render(){

        if(this.state.isLoading){
          return(
            <View style={{flex: 1, padding: 20}}>
              <ActivityIndicator/>
            </View>
          )
        }

        return(
          <View style={styles.container}>
            <FlatList
              data={this.state.dataSource}
              renderItem={({item}) => <Text>{item.manga_name}, {item.manga_des}</Text>}
              keyExtractor={({id}, index) => manga_id}
            />
          </View>
        );
      }
    }
  const styles = StyleSheet.create({
      container: {
          marginTop: 15,
          flex: 1,
          justifyContent: 'center',
          alignItems: 'center',
          backgroundColor: '#F5FCFF'
      },
  });

但是当我用https://facebook.github.io/react-native/movies.json .By替换本地主机时,它运行得很好,我的英语不好,所以如果我有任何错误的语法,请原谅我

EN

回答 1

Stack Overflow用户

发布于 2019-10-02 15:44:14

假设您的express服务器运行良好:

如果您的服务器位于本地主机上,请将ip地址更改为http://10.0.2.2:3000/manga以访问您的服务器。

如果要连接到另一台主机或使用192.168.*.*,请在终端中键入adb reverse tcp:3000 tcp:3000 (在路径中或同一目录中包含adb ),然后使用http://192.168.*.*:3000/manga

也检查一下: moritzw建议的Android 8: Cleartext HTTP traffic not permitted

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58185068

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档