API Instagram и импорт фотографий без аутентификации на стороне сервера - PullRequest
8 голосов
/ 13 сентября 2011

Я немного запутался в некоторых функциях, которые я хотел бы реализовать на веб-сайте с помощью Instagram API . Я хотел бы получить доступ к своему каналу на основе своего идентификатора пользователя из API Instagram и отобразить их на своем сайте. Это говорит о том, что есть способ сделать аутентификацию OAuth на стороне клиента, но я немного запутался в том, как мне поступить. С JavaScript у меня все в порядке, и если кто-то может указать мне правильное направление, я уверен, что смогу это понять.

Любые лучшие практики были бы великолепны.

Заранее спасибо,

JN

Ответы [ 2 ]

10 голосов
/ 02 февраля 2012

Вы спрашиваете, как использовать клиентскую (неявную) аутентификацию для Instagram.

Вот пара JS-библиотек, созданных для него:

  1. https://github.com/Instagram/instagram-javascript-sdk
  2. https://github.com/potomak/jquery-instagram
7 голосов
/ 10 мая 2012

Это давало мне неприятности целую вечность, но я думаю, что придумал простой способ просто разместить мои собственные фотографии на моем веб-сайте, используя идеи из плагина "jquery-instagram", но опустив его до упора.

  1. Придумайте #tag и добавьте его ко всем фотографиям, которые вы хотите показать на своем сайте, убедитесь, что это не то, что просто кто-то будет использовать.(Сделайте это таким образом, чтобы избежать необходимости аутентификации).

  2. Зарегистрируйте свое приложение здесь: http://instagr.am/developer/register/ (Просто используйте свой логин в Instagram)

  3. Используйте следующий код (с jQuery), где «tag» - это использованный вами тег, «id» - это идентификатор вашего зарегистрированного клиента приложения, а «photoCount» - максимальное количество фотографий, которые вы хотите получить.

    $.ajax({
      type: "GET",
      dataType: "jsonp",
      cache: false,
      url: "https://api.instagram.com/v1/tags/" + tag + "/media/recent?client_id=" + id,
      success: function(response) {
        var length = response.data != 'undefined' ? response.data.length : 0;
        var limit = photoCount != null && photoCount < length ? photoCount : length;
        if(limit > 0) {
          for(var i = 0; i < limit; i++) {
            $('<img>', {
              src: response.data[i].images.standard_resolution.url
            }).appendTo($("#photos"));
          }
        }
      }
    });
    
...