Instagram API / Flickity Carousel

Question

尝试将其集成到一个站点上：https://github.com/mangcoding/instagram-feeder我对API的了解还不够多，无法让它在用户名而不是标签上工作。我想这可能和下面这行有关: let instaData = data.edge_hashtag_to_media.edges；

有没有人知道我能做什么，谢谢！

<script charset="utf-8">
        (function ($) {
            $(window).on('load', function () {
                var limit = 20;
                $.instagramFeed({
                    'tag': 'data', // want this to be 'username': 'data', 
                    'get_data': true,
                    'callback': function (data) {
                        let instaData = data.edge_hashtag_to_media.edges;
                        instaData.slice(0, limit).filter(x => x.node.edge_media_to_caption.edges.length > 0)
                            .forEach(item => {
                                let node = item.node;
                                let source = $("#instagram-template").html();
                                let template = Handlebars.compile(source);
                                let taken = new Date(node.taken_at_timestamp * 1000)
                                    .toDateString().substr(4);
                                //change format to month date,year
                                let created = taken.slice(0, 6) + ',' + taken.slice(6);
                                let context = {
                                    link: "https://www.instagram.com/p/" + node
                                        .shortcode + "/",
                                    image_url: node.display_url,
                                    countLikes: node.edge_liked_by.count,
                                    caption: node.edge_media_to_caption.edges[0].node
                                        .text,
                                    created: created
                                };
                                let html = template(context);
                                $("#instagramFeed").append(html);
                            });
                        $('#instagramFeed').flickity({
                            cellAlign: 'left',
                            wrapAround: true,
                            pageDots: false,
                            setGallerySize: false,
                            prevNextButtons: true,
                            arrowShape: { "x0": 20, "x1": 60, "y1": 40, "x2": 60, "y2": 35, "x3": 25 }
                        });
                    }
                });
            });
        })(jQuery);
    </script>

Answer 1

弄清楚了：

设instaData = data.edge_owner_to_timeline_media.edges；

vs

设instaData = data.edge_hashtag_to_media.edges；

<script charset="utf-8">
        (function ($) {
            $(window).on('load', function () {
                var limit = 20;
                $.instagramFeed({
                    'username': 'myusername',
                    'get_data': true,
                    'callback': function (data) {
                        let instaData = data.edge_owner_to_timeline_media.edges;
                        instaData.slice(0, limit).filter(x => x.node.edge_media_to_caption.edges.length > 0)
                            .forEach(item => {
                                let node = item.node;
                                let source = $("#instagram-template").html();
                                let template = Handlebars.compile(source);
                                let taken = new Date(node.taken_at_timestamp * 1000)
                                    .toDateString().substr(4);
                                //change format to month date,year
                                let created = taken.slice(0, 6) + ',' + taken.slice(6);
                                let context = {
                                    link: "https://www.instagram.com/p/" + node
                                        .shortcode + "/",
                                    image_url: node.display_url,
                                    countLikes: node.edge_liked_by.count,
                                    caption: node.edge_media_to_caption.edges[0].node
                                        .text,
                                    created: created
                                };
                                let html = template(context);
                                $("#instagramFeed").append(html);
                            });
                        $('#instagramFeed').flickity({
                            cellAlign: 'left',
                            wrapAround: true,
                            pageDots: false,
                            setGallerySize: false,
                            prevNextButtons: true,
                            arrowShape: { "x0": 20, "x1": 60, "y1": 40, "x2": 60, "y2": 35, "x3": 25 }
                        });
                    }
                });
            });
        })(jQuery);
    </script>