Невозможно запросить API AWS с помощью Vue и Axios - PullRequest
Новая
       29

Невозможно запросить API AWS с помощью Vue и Axios

0 голосов
/ 17 октября 2018

Я уже пару дней пытаюсь получить ответ от API AWS.Он работает просто отлично, если я запрашиваю его с помощью Postman, но когда я пишу код с использованием vue и axios, он просто не работает.Итак, вот где я, что работает, а что нет.

У меня есть простой метод "getCryptos", который получает текущую рыночную стоимость из API coinmarketcap.com.Это доказывает, что с другим API, отличным от AWS, все работает.Метод выглядит так: 

async getCryptos() {
  await axios.get('https://api.coinmarketcap.com/v1/ticker/').then((resp) => {
    this.response = resp.data;
  }).catch((err) => {
    this.error = err.message;
  });
}

Этот метод работает просто отлично.При вызове код переходит к функции , затем и заполняет this.response собранными данными.

Теперь для вызова API AWS я изменил код, добавив ключ API и параметр для запроса GET.Приведенный ниже код скрывает точный URL-адрес, ключ API и параметр, но вы поймете идею.Я также добавил вызовы к отладчику как в , затем , так и в catch функции, чтобы увидеть, куда идет код. 

async getAWS() {
  await axios.get('https://xxxxxxxxx.execute-api.us-west-2.amazonaws.com/development/api', {
    headers: { 'x-api-key': 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx' },
    params: {
      Param: 'Value',
    },
  })
    .then((resp) => {
      this.response = resp.data;
      debugger;
    }).catch((err) => {
      this.error = err.message;
      debugger;
    });
},

В результате код проходит через функцию catch с ошибкой Network error, что угодноэто означает.

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

Итак, мой вопрос: что я делаю не так?Почему я могу использовать API CoinmarketCap, а не API AWS, который у меня есть?Я знаю, что это не API AWS, и я знаю, что axios может делать вызовы CORS, поскольку он работает с coinmarketcap.Чего мне не хватает?

Ответы [ 2 ]

0 голосов
/ 08 ноября 2018

Я имел дело с той же самой ошибкой, используя vue js, axios и aws apigateway.Я смог заставить его работать, удалив заголовки в вызове axios, включив cors и повторно применив api.Надеюсь, это работает для вас.

0 голосов
/ 17 октября 2018

Вам необходимо разрешить запросы CORS в AWS для служб шлюза API.

Перейдите в консоль AWS, перейдите в консоль шлюза API и выберите свой ресурс.Здесь есть раскрывающийся список actions с возможностью Enable CORS.

Подробнее здесь .

...