时间戳

首页 > 解决方案 > 如何使用 axios 获取多个 api？

javascript - 如何使用 axios 获取多个 api？

问题描述

我想在同一页面中获取多个 api。使用以下代码，“apione”的所有返回数据都有效，但不知道为什么我从“apitwo”中一无所获。

async created() {

    let apione = "https://k67r3w45c4.execute-api.ap-southeast-1.amazonaws.com/TwitterTrends";
    let apitwo = "http://ec2-54-179-187-25.ap-southeast-1.compute.amazonaws.com/Test/?param1=HelloHanbinIsFREE"


    try {
      const res = await axios.get(apione);

      this.toptrends1 = res.data[0].Trends;
      this.toptrends2 = res.data[1].Trends;
      this.toptrends3 = res.data[2].Trends;
      this.toptrends4 = res.data[3].Trends;
      this.toptrends5 = res.data[4].Trends;

      this.tweet1 = res.data[0].TweetVolume;
      this.tweet2 = res.data[1].TweetVolume;
      this.tweet3 = res.data[2].TweetVolume;
      this.tweet4 = res.data[3].TweetVolume;
      this.tweet5 = res.data[4].TweetVolume;

      var thetime = res.data[0].retrievalDate
      thetime = thetime.split("T")[0];
      this.time = thetime

      // ----------------------------------API 2 -------------------------------------

      const res2 = await axios.get(apitwo);
      this.trend1fre = res2.data[0].Frequency;


    } catch (e) {
      console.errpr(e);
    }
  },

标签： javascriptapivue.jsgetaxios

解决方案

在浏览器中打开开发者工具。查看控制台。阅读错误信息。

当我测试你的代码时，我得到：

混合内容：“ https://jsbin.com/?html,js,console”处的页面是通过 HTTPS 加载的，但请求了不安全的 XMLHttpRequest 端点“ http://ec2-54-179-187-25.ap-southeast-1.compute.amazonaws.com/Test/?param1=HelloHanbinIsFREE”。此请求已被阻止；内容必须通过 HTTPS 提供。

您的一个 API 使用 HTTP，另一个使用 HTTPS。它们都应该使用与加载 HTML 文档时相同的方案（几乎可以肯定是 HTTPS）。

推荐阅读