Home > Enterprise >  SOLVED type 'String' is not a subtype of type 'int' of 'index' while g
SOLVED type 'String' is not a subtype of type 'int' of 'index' while g

Time:02-02

i'm trying to get media fields from the instagram api and i'm getting this error

type 'String' is not a subtype of type 'int' of 'index'

here's Homepage.dart :

import 'package:flutter/material.dart';
import 'package:get_storage/get_storage.dart';
import 'package:insta_details/models/data.dart';
import 'package:insta_details/utils/custom_dio_mixin.dart';

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  static String id = "HomePage";

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> with CustomDioMixin {
  bool loading = true;
  bool error = false;
  late Media media;

  @override
  void initState() {
    super.initState();
    getData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: loading
            ? const Center(
                child: CircularProgressIndicator(),
              )
            : error
                ? const Center(
                    child: Text('An error has occurred!'),
                  )
                : ListView.builder(
                    itemBuilder: (context, index) => MediaWidget(
                      media: media,
                    ),
                  ),
      ),
    );
  }

  Future<void> getData() async {
    try {
      final storage = GetStorage();
      final token = storage.read("accessToken");
      Media? media;

      final response = await dio.get(
        'https://graph.instagram.com/me/media?fields=id,caption,media_url,timestamp&access_token=$token',
      );
      print("get data response => ${response.statusCode} ${response.data}");

      Media mediadata = Media.fromJson(response.data);
      print(mediadata);
    } catch (e) {
      print("get data failed");
      print(e);
      setState(() {
        error = true;
      });
    } finally {
      setState(() {
        loading = false;
      });
    }
  }
}

class MediaWidget extends StatelessWidget {
  final Media media;
  const MediaWidget({Key? key, required this.media}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return GridView.builder(
      gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
        crossAxisCount: 2,
      ),
      itemCount: 6,
      itemBuilder: (context, index) {
        return Image.network(media.mediaUrl);
      },
    );
  }
}

and here data.dart :

class Media {
  Media({
    required this.id,
    required this.caption,
    required this.mediaUrl,
    required this.timestamp,
  });

  String id;
  String caption;
  String mediaUrl;
  String timestamp;

  factory Media.fromJson(Map<String, dynamic> json) => Media(
        id: json["data"]["id"] as String,
        caption: json["data"]["caption"] as String,
        mediaUrl: json["data"]["media_url"] as String,
        timestamp: json["data"]["timestamp"] as String,
      );

  Map<String, dynamic> toJson() => {
        "id": id,
        "caption": caption,
        "media_url": mediaUrl,
        "timestamp": timestamp,
      };
}

and the log :

I/flutter ( 5699): get data response => 200 {data: [{id: 18106429915287733, caption: cabin in the woods, media_url: https://scontent.cdninstagram.com/v/t51.29350-15/272751472_358111429123560_6575694365508668882_n.jpg?_nc_cat=100&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=0omRv4cUGtwAX8bbmC7&_nc_ht=scontent.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT_fqBkL5ykJXWRj7Rcy4nCnyuXEKh-8o0TX9FJkJ4dcfQ&oe=61FD881A, timestamp: 2022-01-27T11:15:07 0000}, {id: 17917394609104775, caption: Truck, media_url: https://scontent.cdninstagram.com/v/t51.29350-15/272701475_1080001635904581_1705933746471766077_n.jpg?_nc_cat=107&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=ZfSpeg7rHn4AX89PW0c&_nc_ht=scontent.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT_Qbj7zOH-UEzplA9mdIrCHaeb9EBBuz1RjKJclN9Q2RA&oe=61FE9898, timestamp: 2022-01-27T11:14:26 0000}, {id: 17921627228176014, caption: Gaara, media_url: https://scontent.cdninstagram.com/v/t51.29350-15/272660463_892749041374464_5507853711157520506_n.jpg?_nc_cat=101&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=va5seINOs-4AX9vOy4L&_nc_ht=scontent.cdninst
I/flutter ( 5699): get data failed
I/flutter ( 5699): type 'String' is not a subtype of type 'int' of 'index'

my JSON response :

{
"data": [
    {
        "id": "18106429915287733",
        "caption": "cabin in the woods",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272751472_358111429123560_6575694365508668882_n.jpg?_nc_cat=100&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=xXGDvxMsycAAX_U_-55&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT-EuNnLxrBSNirBOl1prRXlHepdhQqUjYRBEv3Zh_Ld6Q&oe=61FD881A",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:15:07 0000"
    },
    {
        "id": "17917394609104775",
        "caption": "Truck",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272701475_1080001635904581_1705933746471766077_n.jpg?_nc_cat=107&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=ZfSpeg7rHn4AX_J_eQs&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT92hbhb0XK56kxC-_e8kpM6QFLazDH0TDCfdIdEIpNinw&oe=61FC9E58",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:14:26 0000"
    },
    {
        "id": "17921627228176014",
        "caption": "Gaara",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272660463_892749041374464_5507853711157520506_n.jpg?_nc_cat=101&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=va5seINOs-4AX_SB6jL&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT8rviJ6wbaT0yF1Hq2VprtnQ-W0rARS5oxIr52MIhC0Rw&oe=61FD720B",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:13:42 0000"
    },
    {
        "id": "18024346318348836",
        "caption": "Marceline",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272807293_686124672409566_4991399943515126026_n.jpg?_nc_cat=106&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=JMfTMSD_1c8AX-m5WDx&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT_P38eDVtcqEYL053wGPkLjhHStLCh7_fgFnCg4LcH1yA&oe=61FD1F82",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:13:02 0000"
    },
    {
        "id": "17859174368680579",
        "caption": "uchiha shisui",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272721151_749467822692662_5191995429373550055_n.jpg?_nc_cat=111&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=01A68vtgY-kAX-ux6iB&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT9oWtK9VWV8j3c8Ij2YXctIpuh9sC-NJO1BLCwFObDDSA&oe=61FE0B03",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:12:35 0000"
    },
    {
        "id": "17917757036265369",
        "caption": "Son and Father",
        "media_type": "IMAGE",
        "media_url": "https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272660947_1107548556714461_1575953024252145708_n.jpg?_nc_cat=100&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=Mzj5Wp9sv_oAX_2Z4Nv&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT8Ywp3DUIemrIoCPajFvivfTG_-AWvEs2fpkngYXUN6Lg&oe=61FE17A1",
        "username": "parekchampl",
        "timestamp": "2022-01-27T11:11:47 0000"
    }
],
"paging": {
    "cursors": {
        "before": "QVFIUnpEcERJTXdYRjd3SVp3MUo2U25UeWhhdlgxQ2xMY0diR2pYVFhCVl9TUUhlM1hqYllKWUpEWXJtYW5RWW41am1Lc3B4U281TU14ZAFoxSVBkMVRsZAkZAB",
        "after": "QVFIUkgtUzExdDNsYzgwUFhGdnRXQlB6N0JkZATVFeU1DVkhzXzduLTF1RklpR1A5MDNMeWVEemtzdE15OVBlYmpYb29mQlVtdDJsX1N2SUcwa2ZAkc21jblZAn"
    }
}

}

[SOLVED]

i added

  List<Media> mediadata = [
    for (final mediaJson in response.data["data"]) Media.fromJson(mediaJson)
  ];
  print(mediadata);

to my getData() method and edited my data class to this:

  factory Media.fromJson(Map<String, dynamic> json) => Media(
    id: json["id"] as String,
    caption: json["caption"] as String,
    mediaUrl: json["media_url"] as String,
    timestamp: json["timestamp"] as String,
  );

CodePudding user response:

According to the documentation : https://developers.facebook.com/docs/instagram-basic-display-api/reference/media ,every field is a String

  factory Media.fromJson(Map<String, dynamic> json) => Media(
    id: json["data"]["id"] as String,
    caption: json["data"]["caption"] as String,
    mediaUrl: json["data"]["media_url"] as String,
    timestamp: json["data"]["timestamp"] as String,
  );

Or change to something like below:

  factory Media.fromJson(Map<String, dynamic> json) => Media(
    id: int.parse(json["data"]["id"] as String),
    caption: json["data"]["caption"] as String,
    mediaUrl: json["data"]["media_url"] as String,
    timestamp: DateTime.parse(json["data"]["timestamp"] as String),
  );

CodePudding user response:

On your model class id is nullable int, but you are receiving id as String.

You can typecast string to int On your Media.fromJson, while the id accept null value, if something wrong happen id will get null value.

  factory Media.fromJson(Map<String, dynamic> json) => Media(
        id: int.tryParse(json["data"]["id"]),

And for toJson pass id as String

  Map<String, dynamic> toJson() => {
        "id": id.toString(),

More about int.tryParse.

CodePudding user response:

The value of your data key is a List not a Map. Here's an example:

const responseData =
{
   "data":[
      {
         "id":"18106429915287733",
         "caption":"cabin in the woods",
         "media_type":"IMAGE",
         "media_url":"https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272751472_358111429123560_6575694365508668882_n.jpg?_nc_cat=100&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=xXGDvxMsycAAX_U_-55&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT-EuNnLxrBSNirBOl1prRXlHepdhQqUjYRBEv3Zh_Ld6Q&oe=61FD881A",
         "username":"parekchampl",
         "timestamp":"2022-01-27T11:15:07 0000"
      },
      {
         "id":"17917394609104775",
         "caption":"Truck",
         "media_type":"IMAGE",
         "media_url":"https://scontent-iad3-1.cdninstagram.com/v/t51.29350-15/272701475_1080001635904581_1705933746471766077_n.jpg?_nc_cat=107&ccb=1-5&_nc_sid=8ae9d6&_nc_ohc=ZfSpeg7rHn4AX_J_eQs&_nc_ht=scontent-iad3-1.cdninstagram.com&edm=ANo9K5cEAAAA&oh=00_AT92hbhb0XK56kxC-_e8kpM6QFLazDH0TDCfdIdEIpNinw&oe=61FC9E58",
         "username":"parekchampl",
         "timestamp":"2022-01-27T11:14:26 0000"
      }
   ]
};

void main() {
  final mediaList = responseData["data"]!.map((entry) => Media.fromJson(entry))
      .toList();
  for (var media in mediaList) {
    print(media.id);
  }
}

class Media {
  Media({
    required this.id,
    required this.caption,
    required this.mediaUrl,
    required this.timestamp,
  });

  int? id;
  String caption;
  String mediaUrl;
  String timestamp;

  factory Media.fromJson(Map<String, dynamic> json) {
    return Media(
      id: int.tryParse(json["id"]),
      caption: json["caption"],
      mediaUrl: json["media_url"],
      timestamp: json["timestamp"],
    );
  }

  Map<String, dynamic> toJson() => {
        "id": id.toString(),
        "caption": caption,
        "media_url": mediaUrl,
        "timestamp": timestamp,
      };
}

  •  Tags:  
  • Related