Блог

Главная - Вопросы по программированию - Cors блокируется при попытке получить токен доступа к Instagram на стороне клиента с помощью react / js

Cors блокируется при попытке получить токен доступа к Instagram на стороне клиента с помощью react / js

#javascript #reactjs #facebook #instagram #instagram-api

#javascript #reactjs #Facebook #Instagram #instagram-api

Вопрос:

Хорошо, итак, я пытаюсь получить токен доступа, следуя основному руководству, предоставленному разработчиками приложений Facebook, а именно: https://developers.facebook.com/docs/instagram-basic-display-api/getting-started . Я на шаге: 5, где я пытаюсь обменять свой код на access_token. Я отправляю запрос на https://api.instagram.com/oauth/access_token однако я получаю блокировку cors с этой ошибкой:

Доступ к XMLHttpRequest по адресу ‘https://api.instagram.com/oauth/access_token » из источника «https://localhost ‘ был заблокирован политикой CORS: тип содержимого поля заголовка запроса не разрешен с помощью Access-Control-Allow-Headers в предполетном ответе.

Я буквально все перепробовал. Добавление заголовков в axios, использование ngrok для получения реального защищенного https:, а не самодельного сертификата (для режима разработки ofc). Я также изменил URL-адреса приложений. В чем может быть проблема?

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

1. Изучали ли вы настройки разработчика, чтобы добавить разрешения / разрешенные URL-адреса для вашего приложения? Попробуйте добавить туда localhost

2. Вы пробовали: https://cors-anywhere.herokuapp.com/https://api.instagram.com/oauth/access_token

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

4. Да, это, вероятно, в 100% раз лучше, я сделал это, чтобы мой секрет был в безопасности на сервере.. Но, черт возьми, вам не нужно голосовать..

Ответ №1:

Да, я разрешил URL-адреса, я все сделал. Я попытался https://cors-anywhere.herokuapp.com/https://api.instagram.com/oauth/access_token это не сработало, там написано «плохой запрос». Однако мне удалось решить эту проблему с помощью дополнительной библиотеки под названием axios-oauth-client: https://www.npmjs.com/package/axios-oauth-client . После внедрения этой библиотеки и вместо того, чтобы выполнять axios.post(url, data), но используя эту библиотеку и передавая туда данные, все работает нормально, и я получаю токен доступа. Возможно, проблема была в заголовках