Блог

Я знаю, что есть несколько похожих путей, но ни одно решение мне не помогло.

Я создаю приложение с Ruby on Rails и Vue. В настоящее время я пытаюсь получить токен доступа Spotify моего пользователя. Итак, мне просто нужно создать get-запрос и дождаться ответа.

Он отлично работает из представления, созданного с помощью Rails, но не из моего приложения Vue.

Это ошибка в моей консоли:

 Access to XMLHttpRequest at 'https://accounts.spotify.com/authorize?client_id=261c008xxxxxx52da843b8096damp;redirect_uri=http://localhost:3000/auth/spotify/callbackamp;response_type=codeamp;scope=playlist-modify-public user-read-emailamp;state=5987fec3952e0c46332183c526d0abef2f0d35a13e39694e' (redirected from 'http://localhost:3000/auth/spotify') from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
  

В запрошенном ресурсе отсутствует заголовок ‘Access-Control-Allow-Origin’. но если мы проверим заголовки:

В моем js-файле у меня есть:

 Vue.http.interceptors.push(function (request, next) {
  request.headers.set('Content-Type', 'application/json');
  request.headers.set('Access-Control-Allow-Origin', '*');
  request.headers.set('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
  request.headers.set('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');
  request.headers.set('X-CSRF-Token', document.getElementsByName('csrf-token')[0].content);
  next();
});
  

Я не знаю, где искать, у вас есть идея?
Я уже пытался установить расширение chrome, разрешить все origins на стороне моего сервера, заменить Vue-ресурс на Axios, установить cors с помощью node…

Access-Control-Allow-Origin должен быть заголовок ответа, а не заголовок запроса. Его должен установить ваш внутренний API.