javascript - 加载时出现四方请求错误

Question

大家好，当我尝试访问 foursquare api 以查找有关我正在搜索的特定餐厅的信息时，我遇到了一个小错误。

Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

我看到的另一件事是，当我将搜索放在他的 url 中以查看出现的内容时，我在页面上出现了一些疯狂的代码..

the http request results from the browser

这是我现在拥有的代码...

var fourSquareMain = 'https://api.foursquare.com/v2/venues/search';
var clientID = '?client_id=5LHFTY54EP5VLMYIIVZ0OQGMNZQEM2FUKDPFFA2OJHMO0AVI';
var clientSecret = '&client_secret=2TN3GQBAX4U2GPHGMCUZWS35Y2E5E2Y4NG0YWGVGNMXEPHAW';
var fourSquareVersion = '&v=20130815';
var fourSquareLL = '&ll=' + pointItem.lat() + ',' + pointItem.lng();
var fourSquareQuery = '&query=' + pointItem.name;

var fullFourSquareQuery = fourSquareMain + clientID + clientSecret + fourSquareVersion + fourSquareLL + fourSquareQuery;

var finalFSQuery = fullFourSquareQuery.replace(/ /g, '-');

console.log(finalFSQuery);

Answer 1

1. 您得到的疯狂代码是“您所请求的”，它是来自 foursquare api 的原始 json 响应。

2.它适用于 URL 但不适用于脚本，因为当您在客户端站点上运行脚本时，您正在尝试跨源资源共享 (CORS)，出于安全原因，某些 API 不允许这样做。要解决此问题，您需要使用 JSON-P，这是一种允许跨域请求的独特技巧。一种简单的方法是使用 jQuery 创建 AJAX 请求。在您的情况下，尝试从搜索结果中获取第一个地点的名称

var fourSqrUrl = "https://api.foursquare.com/v2/venues/search?ll=40.7,-74&client_id=XXX&client_secret=YYY&v=20160128"
       $.ajax({
              url: fourSqrUrl,
              success: function(data) {
                $(div1).html('FourSquare Response : ' + data.response.venues[0].name);
                }
              });

`您可能需要阅读一些有关 AJAX 的内容才能更好地了解其工作原理以及如何读取 json 数据。