如何在 flutter 中顯示來自 API 響應的圖像

Question

我正在嘗試顯示從 api 響應中獲得的圖像。

這里我的 api 回復看起來像

{
            "id": 40,
            "user_id": 49,
            "contact_person": "fss",
            "relation": "dfs",
            "phone": "dsf",
            "image": "emergency/1735859198927595.jpg",
            "created_at": "2022-06-17T05:38:54.000000Z",
            "updated_at": "2022-06-17T05:38:54.000000Z"
        },

並將其顯示在像這樣的listtile leading上

ListTile(leading: SizedBox(height: 50,width: 50,
         child: Image.network(emergencyContact[index].image))

但它給了我這個錯誤

Exception caught by image resource service ════════════════════════════
Invalid argument(s): No host specified in URI file:///emergency/1735859198927595.jpg

請幫忙解決這個問題。

Answer 1

你的圖像 url 不是.network url，它應該以https或http開頭，否則它將不起作用

String url = https://media.sproutsocial.com/uploads/2017/02/10x-featured-social-media-image-size.png;

ListTile(leading: SizedBox(height: 50,width: 50,
     child: Image.network(url))

Answer 2

所以異常錯誤很好地解釋了你沒有提供你的主機： https://your.site.com/image-path.png

請 append https://your.site.com/${emergencyContact[index].image}

ListTile(leading: SizedBox(height: 50,width: 50,
         child: Image.network(`https://your.site.com/${emergencyContact[index].image}`))