modInstagram2 с использованием Basic Display API


Всем привет!

Обновление компонента для тех, кому надоели блокировки IP серверов Инстаграмом :)

Что нового/Особенности:
  • Используется официальное Instagram Basic Display API
  • Нужен только токен. Который, как оказалось, не так уж и сложно получить. Процесс получения подробно описан по шагам в документации.
  • Автоматическое продление токена (время жизни токена 60 дней)
  • Вывод неограниченного кол-ва постов
  • Выводятся посты только того аккаунта, для которого получен токен
  • Уменьшилось количество свойств поста (id, ссылка на пост, фото/видео, дата публикации, текст описания..) все поля описаны в документации
Актуальная документация в Modstore.

Купить компонент: modstore.pro/packages/photos-and-files/modinstagram2
Демо: demo.webone.pw/modinstagram/
Игорь Терентьев
17 июня 2020, 20:53
modx.pro
1 173
+13

Комментарии: 43

Андрей
18 июня 2020, 02:04
+1
Респект за обновление! Очень не хватало.
Илья Уткин
18 июня 2020, 08:37
+2
Процесс получения токена запутанный, но инструкция очень подробная и точная — всё заводится с первого раза)
Александр Мельник
19 июня 2020, 19:31
0
А расскажите пожалуйста, как происходит продление токена автоматическое?
Откуда вы черпали информацию, может ссылка?
Pavel
12 июля 2020, 11:30
0
Здравствуйте. Спасибо всё работает, помогите пожалуйста вывести миниатюру видео фала по моему шаблону.

<div class="col-md-3 col-sm-6 col-xs-12">
<div class="element relative">
<a class="absolute" href="{$permalink}" target="_blank" title="{$location_name} {$type}"></a>
<div class="img-wrapper">
<div class="hiddentitle">
<div class="table">
<div class="table-cell text-center">
<span><i class="fa fa-instagram" aria-hidden="true"></i> instagram</span>
</div>
</div>
</div>
<div class="article-img element-img">
<img class="lazy" [[pthumb? &input=`{$media_url}` &options=`h=400&w=400&zc=1&dims=1`]] alt="{$type}">
</div>
</div>
<div class="element-content">
<div class="title-h5 upper"><i class="fa fa-instagram" aria-hidden="true"></i>{$timestamp}</div>
<p class="f12">{$caption | strip : true | truncate : 100}</p>
</div>
</div>
</div>
    Игорь Терентьев
    13 июля 2020, 17:26
    0
    Здравствуйте, pthumb не поддерживает изображения с внешних сайтов — только локальные.
      Pavel
      13 июля 2020, 18:59
      0
      Здравствуйте. Спасибо за ответ, но у меня выводятся изображения постов инстаграмма нормально где размещены фото файлы, а вот видео пустое окошко — вот я и думал как то вывести миниатюру видеофайла.
        Игорь Терентьев
        13 июля 2020, 19:42
        0
        Плэйсхолдер не тот, для превью видео специальный: {$thumbnail_url}
        Отформатировать дату можно так: {$timestamp | date: 'd.m.Y'}
          Pavel
          13 июля 2020, 22:09
          0
          Спасибо большое. Сейчас сделал так
          <div class="article-img element-img">
          <img class="lazy" src="{$media_url}" alt="{$type}">
          <img class="lazy" src="{$thumbnail_url}" alt="{$type}">
          </div>
          вроде выводится но мне кажется это не совсем правильный вывод… за формат даты спасибо так действительно компактней )))
            Игорь Терентьев
            13 июля 2020, 22:30
            0
            Вот так будет переключаться в зависимости от типа поста:
            {switch $media_type}
                {case 'CAROUSEL_ALBUM'}
                    <img class="lazy" src="{$children.data.[0].media_url}" alt="{$type}">
                {case 'VIDEO'}
                    <img class="lazy" src="{$thumbnail_url}" alt="{$type}">
                {case default}
                    <img class="lazy" src="{$media_url}" alt="{$type}">
            {/switch}
              Pavel
              14 июля 2020, 11:53
              0
              Спасибо огромное всё работает как надо. Успехов вам!
    Александр
    16 июля 2020, 19:52
    0
    Добрый день, подскажите, а две ленты на два разных аккаунта получится так запустить? на одном сайте
      Игорь Терентьев
      17 июля 2020, 08:34
      0
      Добрый день, да, можно. Нужно будет в вызове сниппета указать разные токены и разный префикс кэша:
      {'!modInstagram2' | snippet : [
          'accessToken' => '123123123123123',
          'cachePrefix' => 'mod_ig',
      ]}
        Игорь Терентьев
        17 июля 2020, 11:59
        0
        Хотя нет, автоматическое продление токена не будет работать. Можете мне после покупки написать через поддержку modstore и скинуть доступы — я вам сделаю бесплатно.
      Игорь Терентьев
      17 июля 2020, 20:55
      0
      Всем привет! Выпустил версию 2.0.3 — исправил обновление токена. Обязательно к обновлению.
        Александр Мельник
        30 июля 2020, 11:56
        0
        Скажите, а как вы обходите вот эту штуку?

        Уже очень много месяцев горит надпись, что подтверждение приостановлено изза вируса, и не дает получить токен.
          Игорь Терентьев
          30 июля 2020, 12:31
          0
          Подтверждать не нужно, все работает в режиме разработки:
            Александр Мельник
            11 августа 2020, 12:11
            0
            Спасибо. Еще один глупый вопрос — а как боретесь с ограничением на количество обращений?
            Написано что есть ограничение в 240 обращений в час, что мне кажется совсем мало.
              Игорь Терентьев
              11 августа 2020, 12:26
              0
              Время жизни кэша указывается в параметре cacheTime. По-умолчанию 1800 (30 минут).
          varanika
          07 сентября 2020, 14:33
          0
          А изменений никаких новых не было у инстаграмма? А то отломился показ.
          Получили новый токен — на старом сайте не работает, создала тестовый на модхосте, поставила новый токен — та же фигня :(
          prntscr.com/ucz5x8
          ERROR @ /home/s23594/www/core/components/modinstagram2/model/modinstagram2.class.php: 79) PHP warning: DateTime::diff() expects parameter 1 to be DateTimeInterface, bool given
          ERROR @ /home/s23594/www/core/components/modinstagram2/model/modinstagram2.class.php: 64) modInstagram2 get ERROR: 400
            Игорь Терентьев
            07 сентября 2020, 17:59
            0
            Здравствуйте!
            Попробовал на modhost — работает.
            Обновитесь до последней версии и выполните по инструкции заново шаги 16-18 modstore.pro/packages/photos-and-files/modinstagram2
            В версии 2.0.3 была исправлена функция продления токена.
            Алексей
            30 сентября 2020, 11:38
            0
            Добрый день, попробовал на тестовом, токен новый, пишет ошибку (с добавлением токена только в сниппет):
            [2020-09-30 11:39:50] (ERROR @ /home/s23868/www/core/components/modinstagram2/model/modinstagram2.class.php: 79) PHP warning: DateTime::diff() expects parameter 1 to be DateTimeInterface, bool given
            [2020-09-30 11:39:50] (ERROR @ /home/s23868/www/core/components/modinstagram2/model/modinstagram2.class.php: 64) modInstagram2 get ERROR: 400

            Ошибка (с добавлением токена и в сниппет и в системные настройки):
            [2020-09-30 11:43:09] (ERROR @ /home/s23868/www/core/components/modinstagram2/model/modinstagram2.class.php: 64) modInstagram2 get ERROR: 500

            т.е. разные ошибки

            На вашем сайте тоже пропали фото demo.webone.pw/modinstagram/
            Что-то поломалось?
              Алексей
              30 сентября 2020, 11:46
              0
              upd
                Александр Мельник
                30 сентября 2020, 12:05
                0
                Материться хочется. Прочел ваше сообщение и решил проверить свои сайты. НО нужно сказать что я не пользовался готовым компонентом, а разрабатывал сам, согласно документации по api instagram
                И да, на всех сайтах начались сбои- где то все изображения пропали, где то часть изображений.
                Так что скорее всего дело не в компоненте для modx, а видимо instagram снова что-то изменил, как он уже за…
                  Алексей
                  30 сентября 2020, 12:13
                  0
                  Выяснил что это из за get параметра «permalink» в запросе к graph.instagram.com
                    Александр Мельник
                    30 сентября 2020, 12:17
                    0
                    так он же вроде и является ссылкой на изображение. А где выяснили, дайте ссылку пожалуйста.
                      Алексей
                      30 сентября 2020, 12:20
                      0
                      Посмотрел на какой url компонент запрос шлёт и уже методом тыка убирал по одному и заработало, но уже без ссылки на пост:
                      graph.instagram.com/me/media?fields=id,media_type,media_url,caption,timestamp,thumbnail_url,permalink,children{fields=id,media_url,thumbnail_url,permalink}&limit=8&access_token=********
                        Игорь Терентьев
                        30 сентября 2020, 13:17
                        0
                        О, спасибо! Сейчас выпущу новую версию. При этом в документации это поле еще есть prnt.sc/uqhkuc Возможно временный баг.
                          Александр Мельник
                          30 сентября 2020, 13:35
                          0
                          Похоже больше на баг с их стороны.
                          Потому что у меня на всех сайтах частично пропали изображения. Какие-то есть и ссылка на них есть, а какие -то нет.
                          Либо же это как-то связано с " Если медиафайл содержит материалы, защищенные авторскими правами, или был помечен как нарушающий авторские права, поле не будет отображаться." Может они начали каким-то образом с помощью ИИ определять не нарушает ли изображение авторские права или чувства верующих или гомосексуалистов.
                            Алексей
                            30 сентября 2020, 13:44
                            0
                            Какие правки будут в новой версии?
                Pavel
                10 ноября 2020, 12:41
                0
                Здравствуйте. Получаю такую ошибку (public_html/core/components/modinstagram2/model/modinstagram2.class.php: 65) modInstagram2 get ERROR: 400) что нужно поправить?
                  Pavel
                  10 ноября 2020, 15:58
                  0
                  Пересоздал приложение и вроде все работает.
                  Савва
                  18 ноября 2020, 10:45
                  0
                  Переключение слайдов со всех выведенных фото работают только у последнего поста (все остальные тоже переключают фото последнего поста). Как быть?..
                    Игорь Терентьев
                    18 ноября 2020, 16:53
                    0
                    Привет! Нужен уникальный id prnt.sc/vlid6g Какой слайдер используешь?
                    Вот так точно работает со слайдером Bootstrap 4:
                    {if ($idx - 1) % 3 == 0}
                        <div class="row">
                    {/if}
                        <div class="col-12 col-md-4 mb-4 in-item">
                            <div class="card">
                                {switch $media_type}
                                    {case 'CAROUSEL_ALBUM'}
                                        <div id="carouselInstagram{$idx}" class="carousel slide">
                                            <div class="carousel-inner">
                                                {foreach $children.data as $item}
                                                    <div class="carousel-item {$item@index == 0 ? 'active' : ''}">
                                                        <a data-fancybox="instagram" href="{$item.media_url}">
                                                            {if $item.media_url | preg_match : '(.mp4)Ui' }
                                                                <video class="card-img-top" width="100%" controls="controls">
                                                                    <source src="{$item.media_url}" type="video/mp4">
                                                                </video>
                                                            {else}
                                                                {set $img = '!pthumb' | snippet : [
                                                                    'input' => $item.media_url,
                                                                    'options' => 'w=600',
                                                                ]}
                                                                <img class="d-block w-100" src="{$img}" alt="">
                                                            {/if}
                                                        </a>
                                                    </div>
                                                {/foreach}
                                            </div>
                                            <a class="carousel-control-prev" href="#carouselInstagram{$idx}" role="button" data-slide="prev">
                                                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                                                <span class="sr-only">Предыдущий</span>
                                            </a>
                                            <a class="carousel-control-next" href="#carouselInstagram{$idx}" role="button" data-slide="next">
                                                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                                                <span class="sr-only">Следующий</span>
                                            </a>
                                        </div>
                                    {case 'VIDEO'}
                                        <a data-fancybox="instagram" href="{$media_url}">
                                            <video class="card-img-top" width="100%" controls="controls">
                                                <source src="{$media_url}" type="video/mp4">
                                            </video>
                                        </a>
                                    {case default}
                                        {set $img = '!pthumb' | snippet : [
                                            'input' => $media_url,
                                            'options' => 'w=600',
                                        ]}
                                        <a data-fancybox="instagram" href="{$media_url}">
                                            <img class="card-img-top" src="{$img}" alt="">
                                        </a>
                                {/switch}
                            	<div class="card-body">
                            		<h6 class="card-subtitle mb-2 text-muted">{$timestamp | date : 'd.m.Y'}</h6>
                            		<p class="card-text">{$caption | strip : true | truncate : 100}</p>
                            		<a href="{$permalink}" class="btn btn-primary" target="_blank" rel="nofollow">Подробнее</a>
                            	</div>
                            </div>
                        </div>
                    {if $idx % 3 == 0}
                        </div>
                    {/if}
                      Савва
                      20 ноября 2020, 23:37
                      0
                      Разобрался.
                      Спасибо.
                    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
                    43