网络图像未在 React Native 中显示答案

【问题标题】：Network Image is not showing in React Native网络图像未在 React Native 中显示
【发布时间】：2019-08-30 11:17:14
【问题描述】：

我实际上正在制作一个电子商务应用程序，并使用 Nodejs 作为后端，并使用 sequelize 作为 Mysql 数据库的 ORM 和 React-native(RN) 作为前端。我的问题是，我在前端既没有得到任何图像，也没有任何错误，但是当我在浏览器中打开图像时，它实际上打开了，还有一件事，我从 localhost 得到响应......这些是我的后端文件首先。

models/productImage.js

module.exports = (sequelize, DataTypes) => {
  const ProductImage = sequelize.define('ProductImage', {
    productId: DataTypes.INTEGER,
    fileName: DataTypes.STRING
  }, {});
  ProductImage.associate = function (models) {
    ProductImage.belongsTo(models.Product, {
      onDelete: 'cascade'
    });
  };
  return ProductImage;
};

routes/productImage.js

let Image = new ProductImage({
            productId: req.body.productId,
            fileName: req.file.filename
        })

        if (Image.fileName) {
            Image.fileName = 'http://127.0.0.1:4000/static/' + Image.fileName;
        }

        await Image.save();
        res.send(Image)

Response

[
  {
    "id": 1,
    "name": "Iphone",
    "slug": "iphone",
    "price": "100000",
    "color": "blue",
    "isActive": 1,
    "createdAt": "2019-08-30T08:59:36.000Z",
    "updatedAt": "2019-08-30T08:59:36.000Z",
    "images": [
      {
        "fileName": "http://127.0.0.1:4000/static/images-1567155576836.jpg"
      },
      {
        "fileName": "http://127.0.0.1:4000/static/images-1567155783680.jpg"
      }
    ]
  }
]

App.js

app.use('/static', express.static('public'))

前端部分（RN）

state = {
    products: []
  }


async componentDidMount() {
    let products = await API.home();
    this.setState({
      products: products
    })
  }

 <FlatList
      data={this.state.products}
      renderItem={({ item }) => (
      <View>
         <Text>{item.name}</Text>
         <Text>{item.price}</Text>
        <Image style={{ width: 400, height: 400 }}
        resizeMode={'contain'}
       source={{ uri: item.images[0].fileName }} />
     </View>
    )}
   keyExtractor={item => item.id.toString()}     
 />

【问题讨论】：

你100%确定这个IP地址：127.1.0.7是正确的吗？您的主机文件中有什么？
ios 上的默认设置是不使用http，也许这就是为什么？您可以在 info plist 文件中打开 http
你的网址不应该是127.0.0.1，试着用你的IP地址改一下
我将其更改为 127.0.0.1，但它仍然无法正常工作，我目前正在使用它的 android。
@matcheek 是的，在主机文件中是 127.0.0.1，我在图像中更改了它。但仍然没有得到任何图像

标签： javascript mysql node.js react-native sequelize.js

【解决方案1】：

谢谢大家的回复，但我自己想通了。有一个 IP地址问题。当我将IP地址设置为与我使用的相同时在 fetch 请求中向后端发送请求，它起作用了。换句话说，在 image.fileName 中而不是设置随机 Ip。我设置了主机 Ip 地址..

我把这个答案留给将来需要帮助的人问题...

欢呼

【讨论】：