为什么我的 API 调用在 chrome 中有效，但在我的代码中无效？答案

【问题标题】：Why does my API call work in chrome but not in my code?为什么我的 API 调用在 chrome 中有效，但在我的代码中无效？
【发布时间】：2019-09-10 14:50:06
【问题描述】：

我正在尝试调用 Binance API 以获取 BTC 中的 LTC 价格，并在我的浏览器“https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC”上测试了链接我如何从该链接获取 json 文件到我的 javascript 文件中？

$(document).ready(function() {

var url = 'https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC';

$.ajax( {
    url: url,
    dataType: 'jsonp',
    type: 'GET',
    success: function(data) {
            console.log(data); //returns nothing
        }
});

})

【问题讨论】：

在我的浏览器中jsonp 抱怨blocked due to MIME type (“application/json”) mismatch，json 抱怨CORS
你在使用 api 密钥吗？

标签： javascript ajax api call

【解决方案1】：

如其他答案所述，存在 CORS 问题。因此，您可以尝试从客户端使用 proxyURL，如下所示，

$(document).ready(function() {

var url = 'https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC';

const proxyURL = "https://cors-anywhere.herokuapp.com/";
$.getJSON(proxyURL + url, function(playerData) {
  console.log(playerData);
});
});

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;

希望对你有帮助。

【讨论】：

【解决方案2】：

对https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC 的请求提供了使用 CORS 策略的 json 数据

{"symbol":"LTCBTC","price":"0.01520100"}

JSONP 看起来像

myCallback({"symbol":"LTCBTC","price":"0.01520100"})

这看起来和工作起来就像一个 Javascript / PHP 函数。

jsonp 的 URL 在 URL 中包含一个回调 ...https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC&callback=myCallback

但本站不支持

{"code":-1101,"msg":"参数太多；预期为 '1' 并收到 '2'。"}

它可能可以在您的网站上使用 php 打开？我无法从我所在的系统进行测试我的平板电脑上没有套接字传输“ssl”设置来测试。

是的，它通过 PHP 包装器工作。

myJSONP(<?php echo file_get_contents('https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC');?>);

【讨论】：

【解决方案3】：

如果您在将 dataType: 'jsonp' 更改为 dataType: 'json' 后检查控制台，您将获得以下内容，因为您的代码及其脚本不在同一主机上，并且需要启用 Access-Control-Allow-Origin 以从其他域访问。如果你使用 php，你可以使用 cur。

跨域请求被阻止：同源策略不允许读取位于https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC 的远程资源。（原因：CORS 标头“Access-Control-Allow-Origin”缺失）。

【讨论】：

stackoverflow.com/questions/31276220/… 这是关于此的帖子。

【解决方案4】：

从浏览器或邮递员或提琴手执行请求时，您将得到结果

但是在执行来自应用程序的请求时，您将失败并显示错误消息

Access to XMLHttpRequest at 'https://api.binance.com/api/v1/ticker/price?symbol=LTCBTC' from origin 'http://127.0.0.1:5500' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这个问题必须从你的服务器端解决。

请参考

Cors understanding

此外，如果您使用 C# .Net 作为后端，请找到问题的解决方案

Solution for cors

【讨论】：