Получить JSON по URL на Javascript, аналог функции $.getJSON
Пример кода на jQuery, для получения JSON данных по URL, недостаток - посторонние зависимости
$.getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys&callback', function(data) {
//data is the JSON string
});
Два варианта кода, аналогичных данной jQuery функции. Данные запрашиваются с помощью GET запроса, в синхронном режиме.
function getJSONP(url, success) {
var ud = '_' + +new Date,
script = document.createElement('script'),
head = document.getElementsByTagName('head')[0]
|| document.documentElement;
window[ud] = function(data) {
head.removeChild(script);
success && success(data);
};
script.src = url.replace('callback=?', 'callback=' + ud);
head.appendChild(script);
}
getJSONP('http://soundcloud.com/oembed?url=http%3A//soundcloud.com/forss/flickermood&format=js&callback=?', function(data){
console.log(data);
});
Второй пример
var getJSON = function(url, callback) {
var xhr = new XMLHttpRequest();
xhr.open('GET', url, true);
xhr.responseType = 'json';
xhr.onload = function() {
var status = xhr.status;
if (status == 200) {
callback(null, xhr.response);
} else {
callback(status);
}
};
xhr.send();
};
// использование
getJSON('http://query.yahooapis.com/v1/public/yql?q=select%20%2a%20from%20yahoo.finance.quotes%20WHERE%20symbol%3D%27WRC%27&format=json&diagnostics=true&env=store://datatables.org/alltableswithkeys&callback',
function(err, data) {
if (err != null) {
alert('Something went wrong: ' + err);
} else {
alert('Your query count: ' + data.query.count);
}
});
Политика безопасности по умолчанию CORS не позволяет получать данные с других доменов, или другого порта данного устройства.
Для разрешения необходимо использовать специальный заголовок, Access-Control-Allow-Origin
Пример корректного заголовка для json, с разрешением доступа с любого адреса
header('Content-Type: application/json');
header('Access-Control-Allow-Origin: *');