@mironov_m
Учусь Frontend

Как делать запрос с localhost к VK API?

Ситуация.
Использую create-react-app.
Создал приложение на VK, получил токен.
Создавал как Standalone-приложение, так и веб-сайт. В настройках приложений прописывал адреса сайтов localhost:3000 с портом и без.
Пытаюсь делать запрос:
fetch(`https://api.vk.com/method/users.search?q=${name}&sort=0&count=10&fields=photo_200&v=5.89&access_token=token`);


Ошибка в консоли

Access to fetch at 'https://api.vk.com/method/users.search?q=%D0%BC%D0...' from origin 'localhost:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.


Почитав про CORS, понимаю что с сервера ВК не приходит заголовок, браузер блокирует такой кроссдоменный запрос.
При использовании mode to 'no-cors' ошибка
Uncaught (in promise) SyntaxError: Unexpected end of input

Что мне сделать, чтобы все заработало? Как сервер решает, кому разрешать запросы?
Неужели при разработке нельзя делать запросы к VK?
Перечитал уже все ссылки, вопросы, статьи на несколько раз, в том числе и с этого сайта. Мне срочно нужно делать задание, а решение никак не могу найти.
  • Вопрос задан
  • 3629 просмотров
Решения вопроса 1
@mironov_m Автор вопроса
Учусь Frontend
Помогло использование вот этого!
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
@GlebHleb
Как гласит эта документация:
no-cors — ... In addition, JavaScript may not access any properties of the resulting Response. This ensures that ServiceWorkers do not affect the semantics of the Web and prevents security and privacy issues arising from leaking data across domains.

Для обхода CORS, используйте JSONP, как описано в документации ВК:
var script = document.createElement('script');
script.src = "https://api.vk.com/method/getProfiles?uid=66748&access_token=533bacf...&callback=callbackFunc";
document.getElementsByTagName("head")[0].appendChild(script);
function callbackFunc(result) {
   console.log(result);
}
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы