Начало работы

Из этого курса вы узнаете, как настроить приложение на панели приложений, получить краткосрочныймаркер доступа пользователя Instagram и запросить с его помощью профиль пользователя Instagram через API. После прохождения этого курса вы научитесь получать маркеры доступа и разрешения от пользователей своего приложения, а также выполнять основные запросы через API.

Для прохождения курса нужно уметь выполнять основные запросы cURL в командной строке или в приложении (например, Postman).

Прежде чем начать

Вам понадобятся:

• аккаунт разработчика Facebook;
• аккаунт Instagram с медиафайлами;
• общедоступный сайт, принадлежащий вам (это может быть как реальный сайт, так и бесплатный тренировочный ресурс, например страница Github или веб-приложение Heroku);
• инструмент командной строки (например, "Терминал") или приложение, которое может выполнять запросы cURL (например, Postman).

Шаг 1. Создайте приложение Facebook

Перейдите на сайт developers.facebook.com, нажмите Мои приложения и создайте новое приложение. Укажите тип приложенияПотребительское или Отсутствует.

Когда откроется панель нового приложения, выберите Настройки > Основное, прокрутите до конца страницы и нажмите Добавить платформу.

Выберите Сайт, укажите URL своего сайта и сохраните изменения. Позднее вы сможете сменить платформу, но в этом курсе мы будем использовать вариант Сайт.

Шаг 2. Настройте Instagram Basic Display

Выберите Продукты, найдите Instagram Basic Display и нажмите кнопку Настроить, чтобы добавить его в приложение.

Прокрутите до конца страницы и нажмите Создать приложение.

Заполните форму, как описано ниже.

Отображаемое имя

Укажите название приложения Facebook, которое вы только что создали.

Действительные URI для перенаправления OAuth

Укажите URL своего сайта. Это поле предназначено для специального URI, регистрирующего параметры перенаправления, но в этом курсе мы для удобства будем использовать URL вашего сайта.

Пример: https://socialsizzle.heroku.com/auth/

После ввода URL сохраните изменения и проверьте его ещё раз. В зависимости от структуры к URL может автоматически добавляться косая черта. Сохраните полный URL: он потребуется для получения кодов авторизации и маркеров доступа.

URL обратного вызова деавторизации

Ещё раз укажите URL своего сайта. Потом вам нужно будет заменить его на URL для обработки уведомлений о деавторизации, но в этом курсе можно временно использовать адрес сайта.

URL обратного вызова с запросом на удаление данных

Ещё раз укажите URL своего сайта. Потом вам опять-таки нужно будет заменить его соответствующим URL для обработки запросов на удаление данных, но в целях этого курса можно временно использовать адрес сайта.

Проверка приложения

Пока пропустите этот раздел, поскольку в курсе вам не понадобится переключать приложение в общедоступный режим.

Шаг 3. Добавьте тестового пользователя Instagram.

Выберите Роли > Роли и прокрутите до раздела "Тестировщики Instagram". Нажмите Добавить тестировщиков Instagram, введите свое имя пользователя Instagram и отправьте приглашение.

Откройте новое окно браузера, перейдите на сайт www.instagram.com и войдите в приглашенный аккаунт Instagram. Выберите (Значок профиля) > Редактировать профиль > Приложения и сайты > Приглашения тестировщиков и примите приглашение.

Теперь ваше приложение Facebook будет иметь доступ к вашему аккаунту Instagram даже в режиме разработки.

Шаг 4. Авторизуйте тестового пользователя.

Ниже показан шаблон URL окна авторизации. Подставьте вместо {app-id} ID вашего приложения Instagram (его можно найти здесь: Панель приложений > Продукты > Instagram > Базовое представление > поле ID приложения Instagram), а вместо {redirect-uri} — URL вашего сайта из шага 2 (Действительные URI для перенаправления OAuth). Это должен быть тот же самый URL с точностью до символа.

https://api.instagram.com/oauth/authorize
  ?client_id={app-id}
  &redirect_uri={redirect-uri}
  &scope=user_profile,user_media
  &response_type=code

Пример:

https://api.instagram.com/oauth/authorize
  ?client_id=684477648739411
  &redirect_uri=https://socialsizzle.herokuapp.com/auth/
  &scope=user_profile,user_media
  &response_type=code

Откройте новое окно браузера и перейдите по получившемуся URL окна авторизации. На странице должны появиться имя пользователя Instagram, название приложения и описание разрешений, которые оно запрашивает.

Выполните авторизацию тестового пользователя Instagram (то есть предоставьте приложению доступ к данным вашего профиля). Для этого войдите в аккаунт в окне авторизации и нажмите Авторизовать. В случае успеха страница перенаправит вас на URI, указанный на предыдущем этапе, добавив код авторизации. Пример:

https://socialsizzle.herokuapp.com/auth/?code=AQDp3TtBQQ...#_

Обратите внимание: в конце URI перенаправления стоят символы #_, но в код они не входят. Скопируйте этот код (без символов #_ portion): он понадобится на следующем этапе.

Шаг 5. Обменяйте код на маркер.

Откройте инструмент командной строки или приложение, поддерживающее запросы cURL, и отправьте API такой запрос POST:

curl -X POST \
  https://api.instagram.com/oauth/access_token \
  -F client_id={app-id} \
  -F client_secret={app-secret} \
  -F grant_type=authorization_code \
  -F redirect_uri={redirect-uri} \
  -F code={code}

Подставьте вместо {app-id} ID вашего приложения Instagram, вместо {app-secret} — секрет приложения Instagram, вместо {redirect-uri} — URI перенаправления, а вместо {code} — полученный от нас код. Обратите внимание: URI перенаправления должен полностью совпадать с указанным на предыдущем этапе, вплоть до косой черты в конце (она могла автоматически добавиться к URI при настройке приложения Instagram в панели приложений).

Пример:

curl -X POST \
  https://api.instagram.com/oauth/access_token \
  -F client_id=684477648739411 \
  -F client_secret=eb8c7... \
  -F grant_type=authorization_code \
  -F redirect_uri=https://socialsizzle.herokuapp.com/auth/ \
  -F code=AQDp3TtBQQ...

В случае успеха API вернет закодированный объект JSON с краткосрочным маркером доступа пользователя Instagram, действующим в течение одного часа, и ID вашего тестового пользователя Instagram:

{
  "access_token": "IGQVJ...",
  "user_id": 17841405793187218
}

Скопируйте маркер доступа и ID пользователя: они понадобятся на следующем этапе.

Шаг 6. Запросите узел User.

Используя командную строку или приложение, отправьте следующий запрос cURL к узлу User (Пользователь), чтобы получить имя и ID пользователя. Подставьте вместо {user-id} и {access-token} полученные на предыдущем этапе ID и маркер доступа соответственно.

curl -X GET \
  'https://graph.instagram.com/{user-id}?fields=id,username&access_token={access-token}'

Пример:

curl -X GET \
  'https://graph.instagram.com/17841405793187218?fields=id,username&access_token=IGQVJ...'

Можно также отправить запрос к узлу Me (Я). Он проанализирует ваш маркер, определит ID пользователя Instagram, который предоставил маркер, и запросит этого пользователя. Пример:

curl -X GET \
  'https://graph.instagram.com/me?fields=id,username&access_token=IGQVJ...'

В случае успеха API выведет имя и ID пользователя Instagram:

{
  "id": "17841405793187218",
  "username": "jayposiris"
}

Дальнейшие действия

Теперь вы знаете, как получать маркеры и выполнять основные запросы. Чтобы научиться использовать другие возможности API, ознакомьтесь с нашими руководствами.