Несколько дней назад подруга попросила меня помочь с ее бизнес-аккаунтом в Instagram, разработать сервис, который поможет ей и другим владельцам аккаунтов поддерживать свою аудиторию. Без всяких сомнений, я согласился, потому что, во-первых, я люблю помогать другим, если могу, а во-вторых, это была хорошая возможность начать работать с Instagram API.

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

Какие технологии мы будем использовать?

Сначала я думал, что он будет построен только на Angular, но мы получим токен доступа из Instagram API, и хранить его в локальном хранилище или где-то еще на интерфейсе очень небезопасно, потому что если какой-то хулиган украдет его - они иметь доступ ко всем данным вашей учетной записи. Гораздо лучше разработать бэкэнд и сохранить токен в базе данных. Вот почему я решил использовать Node.js в качестве серверной части и MongoDB в качестве базы данных.

Регистрация клиента Instagram.

Перво-наперво, давайте перейдем на страницу разработчика Instagram и создадим нашего первого клиента. Для этого вам необходимо войти в систему, перейти на вкладку Управление клиентами и нажать там Зарегистрировать нового клиента. Заполните все необходимые данные и Зарегистрируйтесь. После успешного создания клиента нам потребуются 3 параметра: Client ID, Client Secret и URL-адреса перенаправления, на которые Instagram перенаправит вас с CODE в качестве параметра запроса после регистрации. в свой аккаунт.

Настройте сервер Node.js.

Прежде чем мы начнем, убедитесь, что на вашем локальном компьютере установлены Node.js и npm (менеджер пакетов узлов).

node --version && npm --version
v7.3.0
3.10.10

А если его там нет, просто зайдите на веб-сайт Node.js и выполните инструкции по установке.

После того, как node и npm будут запущены на вашем компьютере, создайте папку с приложением и инициализируйте npm там.

mkdir instagram-auth && cd instagram-auth
npm init -y
npm install --save express

Если все было успешно установлено, у вас должен быть файл package.json в корневой папке проекта.

Обратите внимание, что я добавил свойство сценария запуска, чтобы мы могли запустить наш сервер с помощью команды npm start.

Теперь нам нужно создать файл server.js и приступить к его настройке.

Мы можем запустить npm start и посмотреть, работает ли наш сервер на локальном порту 3000.

Как работает аутентификация в Instagram?

Давайте разберемся, как работает аутентификация в Instagram. На вашей странице есть кнопка Войти, которая перенаправляет вас на страницу входа в Instagram по URL-адресу:

https://api.instagram.com/oauth/authorize/?client_id=CLIENT-ID&redirect_uri=REDIRECT-URI&response_type=code

В нашем клиенте Instagram у нас есть все эти параметры запроса, поэтому в нашем случае URL-адрес должен выглядеть так:

https://api.instagram.com/oauth/authorize/?client_id=CLIENT_ID&redirect_uri=http://localhost:3000/auth&response_type=code

После того, как пользователь войдет в систему по предоставленному URL-адресу и примет все разрешения, он будет перенаправлен на redirect_uri с кодом в качестве параметра запроса.

http://localhost:3000/auth?code=3304fe8434294ebfa3b0d2c610411dec

Используйте полученный код для POST в Instagram access_token API:

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

Реализация Node.js.

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

  • morgan - это промежуточное программное обеспечение регистратора HTTP-запросов для Node.js.
  • mongoose - инструмент моделирования объектов для MongoDB.
npm install --save morgan mongoose

Импортируйте их на наш сервер и настройте:

В этом руководстве я не буду рассказывать, как настроить MongoDb, но вы легко можете сделать это самостоятельно бесплатно на веб-сайте mLab.

Теперь переместим наши константы в конфигурацию.

Теперь нам нужна одна html-страница с кнопкой Войти:

Нам нужно обработать 2 маршрута для входа в систему. Первый - когда пользователь переходит на / login, а второй - / auth, когда пользователь перенаправляет обратно с помощью параметр запроса CODE.

Давайте попробуем. Запустите сервер и перейдите по URL-адресу http: // localhost: 3000, и после нажатия кнопки Войти мы должны увидеть следующее:

Если вы видите что-то подобное - это здорово! Теперь мы можем сделать POST запрос к Instagram API и получить токен.

Нам нужно будет запросить модуль для публикации запроса к API токена доступа Instagram:

npm install --save request

И давайте немного очистим наш код и переместим функцию обратного вызова GET в отдельный модуль.

Итак, теперь мы делаем http POST запрос с параметрами и ожидаем получить пользователя из Instagram. Давайте запустим наш сервер и попробуем.

Теперь мы получаем токен и пользователя. Последний шаг - сохранить эти данные в нашем MongoDb. И давайте начнем с создания плана и модели нашей коллекции.

Теперь сохраните пользователя, которого мы получили из Instagram, и перенаправьте его в домашний каталог.

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

Мы видим, что наш пользователь был создан, и теперь вы можете работать с этим токеном и получить доступ к данным Instagram.

Спасибо за время, потраченное на чтение этой статьи, и я надеюсь, что она была для вас полезной. Если у вас возникли трудности - смело пишите мне, всегда рады вам помочь.

Ваше здоровье…