API javascript不会返回结果答案

【问题标题】：API javascript will not return resultAPI javascript不会返回结果
【发布时间】：2020-04-22 23:51:09
【问题描述】：

根据从@rkosegi 获得的帮助，我尝试通过 js.fiddle 运行我的页面和 javascript 进行测试，但无法在测试页面上显示任何结果。当我在 MS Edge 中运行页面检查时，我没有收到任何错误。

我检查并再次检查，但找不到阻止数据显示的错误。我错过了什么？

$.getJSON("https://<username>:<password>@api.meteomatics.com/todayT05:00Z--today+2DT05:00Z:PT24H/wind_speed_10m:kmh/40.014994,-73.811646/json",

  function(data) {
    console.log(data);

    var mtwnsd24 = data.data[0].coordinates[0].dates[1].value;

    $(".mtwnsd24").append(mtwnsd24);
  });

<head>
  <meta http-equiv="X-UA-Compatible" content="IE=Edge" />

  <meta charset="utf-8" />
  <title>API TEST</title>
  <script src="https://code.jquery.com/jquery-3.4.1.js" integrity="sha256- 
      WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU=" crossorigin="anonymous"></script>

  <script src="meteomatics.js"></script>


</head>

<body>

  <p class="mtwnsd24"></p>

</body>

【问题讨论】：

当我访问该链接时，它要求进行身份验证。您是否提供了身份验证、API 密钥或其他内容？
对不起，我最初省略了。我已将用户 ID 和密钥放回上面的脚本中。
您可以在任何浏览器提供的开发者控制台中的network tab中查看请求状态。
看起来数据源不允许 CORS 访问：CORS 策略已阻止来自源“null”的“usr:passwd@api.meteomatics.com/…”处的 XMLHttpRequest 访问：没有“Access-Control-Allow-Origin” ' 请求的资源上存在标头。
一般来说，需要 API 密钥的 API 不允许直接从浏览器使用，因为这样用户可以获得您的密钥。您必须从服务器调用 API。

标签： javascript jquery json ajax

【解决方案1】：

API 工作正常，但是您不能像您尝试那样通过 URL 进行身份验证，而是通过 set the auth via headers。使用 fetch for example 将如下所示：

var headers = new Headers();

headers.append('Authorization', 'Basic ' + btoa(username + ':' + password));
fetch("https://api.meteomatics.com/todayT05:00Z--today+2DT05:00Z:PT24H/wind_speed_10m:kmh/40.014994,-73.811646/json", {headers: headers})

正如其他人提到的那样，存在 CORS 问题，因此您需要从服务器/代理请求 API。我通过 Postman 进行了尝试，并在刚刚注册后成功获得了 API 的响应。

【讨论】：

【解决方案2】：

运行你的snipplet，检查请求：找不到meteomatics.js，404，并且静默失败......所以也许它是一个远程脚本，你应该完成url？

<script src="[**COMPLETE URL HERE**]meteomatics.js"></script>

与请求本身有关，也许你应该使用 JSONP 请求，因为如果没有设置 CORS 标头，那么它是合乎逻辑的选择。您可以启用 JSONP 添加到 url 回调参数（检查 JSONP https://api.jquery.com/jQuery.getJSON/ ）

【讨论】：