I have a problem when I want to display image emulator that comes from my API on localhost all the text it's appear,also when I past the image url emulator browser it's shown, but when I display images inside the app widget (NetworkImage(imageUrl) I got the following exception
Exception caught by image resource service ════════════════════════════════════════════════ The following SocketException was thrown resolving an image codec: OS Error: Connection refused, errno = 111, address = 127.0.0.1, port = 48458
When the exception was thrown, this was the stack:
0 NetworkImage._loadAsync (package:flutter/src/painting/_network_image_io.dart:84:41)
1 NetworkImage.load (package:flutter/src/painting/_network_image_io.dart:47:14)
2 ImageProvider.resolve... (package:flutter/src/painting/image_provider.dart:327:17)
3 ImageCache.putIfAbsent (package:flutter/src/painting/image_cache.dart:160:22)
... Image provider: NetworkImage("http://127.0.0.1:8000/14176.jpg", scale: 1.0) Image key: NetworkImage("http://127.0.0.1:8000/14176.jpg", scale: 1.0)
════════ Exception caught by image resource service ════════════════════════════════════════════════ OS Error: Connection refused, errno = 111, address = 127.0.0.1, port = 48460
my code : Slider services
class SliderService {
String _baseUrl = 'http://10.0.2.2:8000/api';
getAllSlider() async {
return await httpGet('sliders');
}
httpGet(String api)async{
return await http.get(_baseUrl + '/' + api,headers: {"Accept": "application/json"} );
}
}
Home screen code:
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:storeapp/services/slider_service.dart';
import 'package:storeapp/widgets/carousel_slider.dart';
class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
SliderService _sliderService = SliderService();
var items=[];
@override
void initState() {
// TODO: implement initState
super.initState();
_getSliders();
}
_getSliders() async {
var sliders = await _sliderService.getAllSlider();
var result = json.decode(sliders.body);
result['data'].forEach((data){
setState(() {
items.add(
NetworkImage(data['image_url']
)
);
//print(data['image_url']);
});
});
}
@override
Widget build(BuildContext context) {
print("Items : $items");
return Scaffold(
appBar: AppBar(
title: Text("MY STORE"),
centerTitle: true,
),
body: Container(
height: 450,
child: ListView(
children: <Widget>[
carouselSlider(items),
),
],
),
),
);
}
}
How can I solve this problem and display the images from localhost without any errors
