android – ClientException with SocketException: Failed host lookup: ’tile.openstreetmap.org’ (OS Error: nodename nor servname supplied, or not identified, errno = 8)

I am utilizing flutter_map and geolocator to entry an person’s location and show it on openstreetmap. The issue is that after some scrolling on the map, this error (Ios simulator: ios 17.5 with iphone 15 professional max and ipad 13inch m4/android simulator pixel 3a/chrome(internet)) happens:

flutter: ClientException with SocketException: Failed host lookup: ’tile.openstreetmap.org’ (OS Error: nodename nor servname supplied, or not identified, errno = 8), uri=https://tile.openstreetmap.org/…..png

That is my code for accessing the person’s location and displaying the map:

import 'package deal:flutter/materials.dart';
import 'package deal:geolocator/geolocator.dart';
import 'package deal:permission_handler/permission_handler.dart';
import 'package deal:flutter_map/flutter_map.dart';
import 'package deal:latlong2/latlong.dart';
import 'package deal:undertaking/parts/compass/compass.dart';
import 'package deal:undertaking/parts/user_location.dart';
import 'dart:async';

class MainPage extends StatefulWidget {
  @override
  _MainPageState createState() => _MainPageState();
}

class _MainPageState extends State<MainPage> {
  LatLng? _currentPosition;
  late closing MapController _mapController;
  bool _isMapInitialized = false;
  bool _isCenteredOnUser = true;
  StreamSubscription<Place>? _positionStreamSubscription;

  @override
  void initState() {
    tremendous.initState();
    _mapController = MapController();
    _requestPermission();
  }

  void _requestPermission() async {
    closing standing = await Permission.location.request();
    if (standing.isGranted) {
      print('Location Permission granted');
      if (_isMapInitialized && mounted) {
        _getCurrentLocation();
        _startLocationUpdates();
      }
    } else if (standing.isDenied) {
      print('Location Permission denied');
    } else if (standing.isPermanentlyDenied) {
      print('Location Permission completely denied');
    }
  }

  void _getCurrentLocation() async {
    strive {
      Place place = await Geolocator.getCurrentPosition(
          desiredAccuracy: LocationAccuracy.excessive);
      if (mounted) {
        setState(() {
          _currentPosition = LatLng(place.latitude, place.longitude);
          _mapController.transfer(_currentPosition!, 14);
        });
      }
    } catch (e) {
      if (mounted) {
        print("Error getting location: $e");
      }
    }
  }

  void _startLocationUpdates() {
    const locationSettings = LocationSettings(
      accuracy: LocationAccuracy.excessive,
      distanceFilter: 10, // minimal distance to set off replace
    );

    _positionStreamSubscription =
        Geolocator.getPositionStream(locationSettings: locationSettings).hear(
      (Place place) {
        if (mounted) {
          setState(() {
            _currentPosition = LatLng(place.latitude, place.longitude);
            if (_isCenteredOnUser) {
              _mapController.transfer(_currentPosition!,
                  16); // Preserve the map centered if the icon is blue
            } else {
              // Map has been moved by the person, replace the icon colour
              setState(() {
                _isCenteredOnUser = false;
              });
            }
          });
        }
      },
      onError: (e) {
        if (mounted) {
          print("Error in location stream: $e");
        }
      },
    );
  }

  @override
  void dispose() {
    _positionStreamSubscription?.cancel();
    tremendous.dispose();
  }

  @override
  Widget construct(BuildContext context) {
    return Scaffold(
      physique: Stack(
        kids: [
          FlutterMap(
            mapController: _mapController,
            options: MapOptions(
              interactionOptions: const InteractionOptions(
                enableMultiFingerGestureRace: true,
                flags: InteractiveFlag.doubleTapDragZoom |
                    InteractiveFlag.doubleTapZoom |
                    InteractiveFlag.drag |
                    InteractiveFlag.flingAnimation |
                    InteractiveFlag.pinchZoom |
                    InteractiveFlag.scrollWheelZoom |
                    InteractiveFlag.rotate,
              ),
              initialZoom: 8,
              onMapReady: () {
                if (mounted) {
                  setState(() {
                    _isMapInitialized = true;
                  });
                  _getCurrentLocation();
                  _startLocationUpdates();
                }
              },
              onPositionChanged: (MapCamera position, bool hasGesture) {
                if (hasGesture) {
                  setState(() {
                    _isCenteredOnUser = false;
                });
                }
              },
            ),
            children: [
              TileLayer(
                urlTemplate: 'https://tile.openstreetmap.org/{z}/{x}/{y}.png',
                userAgentPackageName: 'com.example.app',
              ),
              const MapCompass.cupertino(
                hideIfRotatedNorth: false,
              ),
              if (_currentPosition != null)
                MarkerLayer(
                  markers: [
                    Marker(
                      width: 24,
                      height: 24,
                      point: _currentPosition!,
                      child: const CustomLocationMarker(),
                    ),
                  ],
                ),
              const RichAttributionWidget(
                attributions: [
                  TextSourceAttribution(
                    'OpenStreetMap contributors',
                  )
                ],
              ),
            ],
          ),
          Positioned(
            backside: 92,
            proper: 32,
            youngster: IconButton(
              icon: Icon(
                Icons.my_location_outlined, 
                colour: _isCenteredOnUser ? Colours.blue : Colours.gray,
                measurement: 64, 
              ),
              onPressed: () {
                if (_currentPosition != null) {
                  setState(() {
                    _isCenteredOnUser = true;
                  });
                  _mapController.transfer(
                      _currentPosition!, 16); // Zoom stage 16 for nearer view
                }
              },
            ),
          ),
        ],
      ),
    );
  }
}

That is what I’ve tried thus far:

including

    <uses-permission android:identify="android.permission.INTERNET"/>
    <uses-permission android:identify="android.permission.ACCESS_FINE_LOCATION"/>
    <uses-permission android:identify="android.permission.ACCESS_COARSE_LOCATION"/>
    <uses-permission android:identify="android.permission.ACCESS_NETWORK_STATE" />

to AndroidManifest.xml in android/app/src/foremost, debug, and profile

including

    <!-- Permission whereas operating on backgroud -->
    <key>UIBackgroundModes</key>
    <string>location</string>
    <!-- Permission choices for the `location` group -->
    <key>NSLocationAlwaysUsageDescription</key>
    <string>This app wants entry to location.</string>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string>This app wants entry to location.</string>
    <key>NSLocationAlwaysAndWhenInUseUsageDescription</key>
    <string>This app wants entry to location.</string>

in data.plist in ios folder

Making certain airplane mode is off and wifi is enabled and related (in simulator)

android web entry image

apple iphone ipad web entry image