Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Вывод json на сайт (https://javascript.ru/forum/misc/72088-vyvod-json-na-sajjt.html)

Nik_Dev 08.01.2018 02:10

Вывод json на сайт
 
Здравствуйте.
Прошу прощение, но в java не силен, поэтому прошу помощи.
Заранее благодарю.

Есть json на стороннем сайте - https://api.privatbank.ua/p24api/pub...ange&coursid=5

Как мне его вывести на страницу сайта?
То есть к примеру мне нужно вывести курс евро к гривне.

Вот описание параметров в json - https://api.privatbank.ua/#p24/exchange

рони 08.01.2018 02:34

getJSON получение и вывод json jquery
 
Nik_Dev,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
 $(function() {
    $.getJSON("https://api.privatbank.ua/p24api/pubinfo?json&exchange&coursid=5", function(data) {
        var items = [];
        $.each(data, function(key, val) {
            var html = "";
            Object.keys(val).forEach(function(key) {
                if (typeof val[key] != "object") html += key + " : " + val[key] + "<br>"
            });
            items.push('<li id="' + key + '">' + html + "</li>")
        });
        $("<ul/>", {
            "class": "my-new-list",
            html: items.join("")
        }).appendTo("#list")
    })
});
  </script>
</head>

<body>

<div id="list"></div>


</body>

</html>

Aetae 08.01.2018 02:36

Ещё можно так:
<script>function success(data){
  data = data.find(e => e.ccy == "EUR" && e.base_ccy == "UAH");
  alert(
    'Евро к гривне'
    + '\nПокупка: ' + parseFloat(data.buy)
    + '\nПродажа: ' + parseFloat(data.sale)
  );
}</script>
<script src="https://api.privatbank.ua/p24api/pubinfo?jsonp=success&exchange&coursid=5"></script>

Только jsonp я нащупал вручную, на сайте с описанием api с первого взгляда не нашёл, так что использовать с осторожностью)

Nik_Dev 08.01.2018 05:32

Благодарю вас, всё работает.

А как сделать выбор конкретной строки?
К примеру мне нужно только евро вывести.

Как на этом примере, только чтобы был не алерт, а вывод в блок.

<script>function success(data){
data = data.find(e => e.ccy == "EUR" && e.base_ccy == "UAH");
alert(
'Евро к гривне'
+ '\nПокупка: ' + parseFloat(data.buy)
+ '\nПродажа: ' + parseFloat(data.sale)
);
}</script>
<script src="https://api.privatbank.ua/p24api/pubinfo?jsonp=success&exchange&coursid=5"></script>

Цитата:

Сообщение от рони (Сообщение 474458)
Nik_Dev,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
 $(function() {
    $.getJSON("https://api.privatbank.ua/p24api/pubinfo?json&exchange&coursid=5", function(data) {
        var items = [];
        $.each(data, function(key, val) {
            var html = "";
            Object.keys(val).forEach(function(key) {
                if (typeof val[key] != "object") html += key + " : " + val[key] + "<br>"
            });
            items.push('<li id="' + key + '">' + html + "</li>")
        });
        $("<ul/>", {
            "class": "my-new-list",
            html: items.join("")
        }).appendTo("#list")
    })
});
  </script>
</head>

<body>

<div id="list"></div>


</body>

</html>


Nik_Dev 08.01.2018 05:36

Спасибо Вам )

Цитата:

Сообщение от Aetae (Сообщение 474459)
Ещё можно так:
<script>function success(data){
  data = data.find(e => e.ccy == "EUR" && e.base_ccy == "UAH");
  alert(
    'Евро к гривне'
    + '\nПокупка: ' + parseFloat(data.buy)
    + '\nПродажа: ' + parseFloat(data.sale)
  );
}</script>
<script src="https://api.privatbank.ua/p24api/pubinfo?jsonp=success&exchange&coursid=5"></script>

Только jsonp я нащупал вручную, на сайте с описанием api с первого взгляда не нашёл, так что использовать с осторожностью)


рони 08.01.2018 21:31

Nik_Dev,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
 </head>

<body>
<div id="out"></div>
<script>function success(data){
  data = data.find(e => e.ccy == "EUR" && e.base_ccy == "UAH");
  document.querySelector("#out").innerHTML = `Евро к гривне <br>Покупка:  ${data.buy}<br>Продажа: ${data.sale}`
}</script>
<script src="https://api.privatbank.ua/p24api/pubinfo?jsonp=success&exchange&coursid=5"></script>

</body>
</html>

Nik_Dev 08.01.2018 23:01

Спасибо огромное :dance:
Вы очень сильно мне помогли!
Как поставить + в репутацию, у меня почему-то кнопка неактивна?

Я прошу прощение за наглость, но возможно Вы мне сможете помочь еще раз?
Написал в этой теме - https://javascript.ru/forum/showthread.php?p=474501


Цитата:

Сообщение от рони (Сообщение 474504)
Nik_Dev,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
 </head>

<body>
<div id="out"></div>
<script>function success(data){
  data = data.find(e => e.ccy == "EUR" && e.base_ccy == "UAH");
  document.querySelector("#out").innerHTML = `Евро к гривне <br>Покупка:  ${data.buy}<br>Продажа: ${data.sale}`
}</script>
<script src="https://api.privatbank.ua/p24api/pubinfo?jsonp=success&exchange&coursid=5"></script>

</body>
</html>


рони 08.01.2018 23:59

Nik_Dev,
поробуйте так ...
<script>
window.addEventListener('DOMContentLoaded', function() {
var indx = localStorage.getItem('indx');
[].forEach.call(document.querySelectorAll('.drop li'), function(item,i) {
        item.addEventListener('click', function() {
         localStorage.setItem('indx',i);
        });
        if(i == indx) {
        jQuery(item).trigger('click')
        jQuery('.slct').text(item.textContent)
        }
    });
    });
  </script>

Nik_Dev 09.01.2018 01:17

Вложений: 1
Просто идеально, всё работает как нужно.
Вы просто гуру в своем деле )
Скажите как Вас отблагодарить можно? После праздников сделал бы небольшое пожертвование за помощь.


Возвращаюсь к первоначальному вопросу, по поводу вывода курса с json.
Вывод работает корректно только в главном разделе сайта, а когда пытаюсь добавить в админку или же в другие разделы, то он не выводит результаты.
Вложение 3735

Возможно конфликт с другим скриптом, я не знаю как проверить...

Я подключал скрипт - Курсы валют ЦБ РФ в XML, JSON/JSONP
Он выводит корректно.

Вот скрипт:

<div id="EUR">Евро € — 00,00 руб.</div>


<script>
function CBR_XML_Daily_Ru(rates) {
	
  var EURrate = rates.Valute.EUR.Value.toFixed(4).replace('.', ',');
  var EUR = document.getElementById('EUR');
  EUR.innerHTML = EUR.innerHTML.replace('00,00', EURrate);
}
</script>
<script src="//www.cbr-xml-daily.ru/daily_jsonp.js"></script>



Подскажите, пожалуйста, как сделать тот скрипт, что Вы написали, по типу скрипта ЦБ РФ.
И как сделать, чтобы выводило только 4 цифры, то есть к примерку оно выводит 34.15000, а мне нужно 34.15





Цитата:

Сообщение от рони (Сообщение 474506)
Nik_Dev,
поробуйте так ...
<script>
window.addEventListener('DOMContentLoaded', function() {
var indx = localStorage.getItem('indx');
[].forEach.call(document.querySelectorAll('.drop li'), function(item,i) {
        item.addEventListener('click', function() {
         localStorage.setItem('indx',i);
        });
        if(i == indx) {
        jQuery(item).trigger('click')
        jQuery('.slct').text(item.textContent)
        }
    });
    });
  </script>


рони 09.01.2018 02:14

Цитата:

Сообщение от Nik_Dev
всё работает как нужно.

это всё костыли ...
Цитата:

Сообщение от Nik_Dev
а мне нужно 34.15

document.querySelector("#out").innerHTML = `Евро к гривне <br>Покупка:  ${(+data.buy).toFixed(2)}<br>Продажа: ${(+data.sale).toFixed(2)}`
Цитата:

Сообщение от Nik_Dev
не выводит результаты.

смотрите ошибки в консоли

Magomed 17.04.2018 15:18

Вывод статистики с api
 
Всем привет. увидел как тут быстро решили вопрос с API
У меня тоже есть небольшая проблема с выводом. много методов попробовал, Был бы рад помощи

нужно с https://api.nicehash.com/api?method=...multialgo.info
с массива
{"paying":"0.00530817","port":3353,"name":"daggerhashimoto","algo":20}

вытащить результат переменной «paying»
что бы вывелось только один параметр 0.00672334
для страниц html
Заранее благодарю

Dilettante_Pro 17.04.2018 15:22

Цитата:

Сообщение от Magomed
много методов попробовал

???
var data = {"paying":"0.00530817","port":3353,"name":"daggerhashimoto","algo":20};
alert(data.paying);

Magomed 18.04.2018 14:23

Цитата:

Сообщение от Dilettante_Pro (Сообщение 483485)
???
var data = {"paying":"0.00530817","port":3353,"name":"daggerhashimoto","algo":20};
alert(data.paying);

мне нужно что бы из массива контента https://api.nicehash.com/api?method=...multialgo.info
вытащить переменную
пробовал так

<script type="text/javascript">
$.getJSON("https://api.nicehash.com/api?method=simplemultialgo.info").done(function(da ta) {
btc_etc = data.result.simplemultialgo[20].paying;
document.getElementById('BTC').innerHTML = btc_etc;
});
</script>

Nexus 18.04.2018 14:30

Magomed, проксируйте запрос к api через свой сервер.
Других вариантов я не вижу.

Magomed 18.04.2018 15:32

Цитата:

Сообщение от Nexus (Сообщение 483541)
Magomed, проксируйте запрос к api через свой сервер.
Других вариантов я не вижу.

Спасибо за совет, придется попробовать.
кстати на php друг смог вытащить инфу, но вот мне именно java нужно

Nexus 18.04.2018 15:43

Magomed, Java или JavaScript?
С java проблем не должно возникнуть, второму политика безопасности не позволит отправлять кроссдоменные запросы.

Magomed 10.05.2018 17:00

Всем привет.
нужна была еще одна помощь.
есть сервис с API
http://exp.mole-pool.net/api/account...1e77b79f914cf9

в самом внизу есть параметр
stats":{"balance":0,"blocksFound":207,"immature":0 ,"lastShare":1525957232,"paid":772888710939,"pendi ng":0}

как их этого массива вывести paid?
пробовал так.
<script type="text/javascript">
        $.getJSON("http://exp.mole-pool.net/api/accounts/0xbb0899fbb7060a137196a1abbe1e77b79f914cf9").done(function(data) {
            totalexp = data.stats.paid;
            immexp = data.stats.immature;
            balexp = data.stats.balance;
            document.getElementById('expTOT').innerHTML = totalexp(3);
            document.getElementById('expIMM').innerHTML = immexp(3);
            document.getElementById('expBAL').innerHTML = balexp(3);
        });
</script>

не получается.

Nexus 10.05.2018 17:04

Может так?
$.getJSON("http://exp.mole-pool.net/api/accounts/0xbb0899fbb7060a137196a1abbe1e77b79f914cf9").done(function(data) {
    alert(data.stats.paid);
}).fail(function(xhr, textStatus) {
    alert(textStatus);
});

laimas 10.05.2018 17:10

Magomed,
вы вместо переменной определенной запрашиваете функцию.

рони 10.05.2018 17:12

Цитата:

Сообщение от Magomed
document.getElementById('expTOT').innerHTML = totalexp(3);

красное лишнее

Magomed 10.05.2018 18:04

Спасибо ребята, сейчас попробую так Nexus написал

Magomed 11.05.2018 14:10

Цитата:

Сообщение от Nexus (Сообщение 485021)
Может так?
$.getJSON("http://exp.mole-pool.net/api/accounts/0xbb0899fbb7060a137196a1abbe1e77b79f914cf9").done(function(data) {
    alert(data.stats.paid);
}).fail(function(xhr, textStatus) {
    alert(textStatus);
});

как полученный результат вывести на сайт?

делал так
<strong id="USD-ETC"></strong>

но тут id не назначен. как назначить?

Nexus 11.05.2018 14:45

$('#USD-ETC').text(data.stats.paid);

Magomed 11.05.2018 18:25

Ребята спасибо за помощь. оказывается все было просто. я не обратил внимание на ответ что (3) лишнее. все было банально просто. Забыл указать до (3) .toFixed(3)

в итоге
<script type="text/javascript">
        $.getJSON("http://exp.mole-pool.net/api/accounts/0xbb0899fbb7060a137196a1abbe1e77b79f914cf9").done(function(data) {
            totalexp = data.stats.paid * 0.000000001;
            document.getElementById('expTOT').innerHTML = totalexp.toFixed(3);
        });
</script>

И скрипт заработал

Magomed 11.05.2018 18:34

Есть еще один вопрос.

$.getJSON("http://etps.mole-pool.net/api/stats").done(function(data) {
            etpssh_r = data.hashrate;
            etpsminer = data.minersTotal;
            etpsexp = etpssh_r * 0.000001;
            document.getElementById('etpsHR').innerHTML = etpsexp.toFixed(3);
            document.getElementById('etpsMR').innerHTML = etpsminer;
        });

        $.getJSON("http://vic.mole-pool.net/api/stats").done(function(data) {
            vich_r = data.hashrate;
            vicminer = data.minersTotal;
            vicexp = vich_r * 0.000001;
            document.getElementById('vicHR').innerHTML = vicexp.toFixed(3);
            document.getElementById('vicMR').innerHTML = vicminer;
        });

        $.getJSON("http://aura.mole-pool.net/api/stats").done(function(data) {
            aurach_r = data.hashrate;
            auraminer = data.minersTotal;
            auraexp = aurach_r * 0.000001;
            document.getElementById('auraHR').innerHTML = auraexp.toFixed(3);
            document.getElementById('auraMR').innerHTML = auraminer;
        });

таких скриптов с выводом статистики много.
мне нужно с каждого скрипта сложить все строки
aurach_r = data.hashrate;

где "aurach_r" переменные разных скриптов

laimas 11.05.2018 18:40

Magomed,
и зачем трижды запрашивать у сервера одни и те же данные?

Magomed 11.05.2018 18:51

Там же не одни и те же. сервисы с которых апи тяну разные. ссылки с статой

рони 11.05.2018 19:01

Magomed,
http://api.jquery.com/jQuery.when/

laimas 11.05.2018 19:07

Да, я только на хвосте url сосредоточился, так как обрабатываются одни и те же данные. Получается у всех трех структура одна и тот же.

Для того чтобы оперировать данными от трех ответов нужно использовать promise, запросы то асинхронные. Известно такое?

рони 11.05.2018 19:25

Magomed,
$(function() {
var a = $.getJSON("http://etps.mole-pool.net/api/stats").done(function(data) {
            etpssh_r = data.hashrate;
            etpsminer = data.minersTotal;
            etpsexp = etpssh_r * 0.000001;
            document.getElementById('etpsHR').innerHTML = etpsexp.toFixed(3);
            document.getElementById('etpsMR').innerHTML = etpsminer;
        });

var b = $.getJSON("http://vic.mole-pool.net/api/stats").done(function(data) {
            vich_r = data.hashrate;
            vicminer = data.minersTotal;
            vicexp = vich_r * 0.000001;
            document.getElementById('vicHR').innerHTML = vicexp.toFixed(3);
            document.getElementById('vicMR').innerHTML = vicminer;
        });

var c = $.getJSON("http://aura.mole-pool.net/api/stats").done(function(data) {
            aurach_r = data.hashrate;
            auraminer = data.minersTotal;
            auraexp = aurach_r * 0.000001;
            document.getElementById('auraHR').innerHTML = auraexp.toFixed(3);
            document.getElementById('auraMR').innerHTML = auraminer;
        });

$.when( a, b, c ).done(function( a, b, c ) {
  var data = a[0].hashrate + b[0].hashrate + c[0].hashrate;
  alert( data );
});
});

Malleys 11.05.2018 21:10

Если много и однотипно, то можно так:
Promise.all([{
	url: "http://etps.mole-pool.net/api/stats",
	id: "etps"
}, {
	url: "http://vic.mole-pool.net/api/stats",
	id: "vic"
}, {
	url: "http://aura.mole-pool.net/api/stats",
	id: "aura"
}].map(
	({url, id}) => fetch(url)
		.then(response => response.json())
		.then(data => {
			let r = data.hashrate;
			let miner = data.minersTotal;
			let exp = r * 1e-6;

			document.getElementById(id + "HR").textContent = exp.toFixed(3);
			document.getElementById(id + "MR").textContent = miner;

			return r;
		})
)).then(rates => {
	alert(rates.reduce((m, v) => m + v));
});

Magomed 12.05.2018 14:58

Оба варианта заработали. Сасибо.
есть просьба.
когда ставлю
alert(rates.reduce((m, v) => m + v));
то на странице отдельным баннером как бы высвечивает ответ. а как сделать что бы вывести на страницу в конкретном месте.
обычно я выводил посредством строки
document.getElementById(HR).textContent = exp.toFixed(3);


и на сайте указывал в нужном месте строку
<strong id="HR"></strong>

в данном случае не работает такой принцип

Magomed 12.05.2018 15:30

А все. разобрался
alert(rates.reduce((m, v) => m + v));
document.getElementById('HR').innerHTML = rates.reduce((m, v) => m + v).toFixed(3);
});
var obj=document.getElementById('HR');

Zufarro 30.05.2018 18:56

Подскажите, пожалуйста, в чем моя ошибка?

$.getJSON('http://moonwalk.co/api/videos.json?kinopoisk_id=4561&api_token=d10a8f4368bc3a6e26b11477ad939da1').done(function(data) {
 alert(data.iframe_url);
}).fail(function(xhr, textStatus) {
 alert(textStatus);
});

рони 30.05.2018 19:48

Zufarro,
Пожалуйста, отформатируйте свой код!

Для этого его можно заключить в специальные теги: js/css/html и т.п., например:
[js]
... ваш код...
[/js]


О том, как вставить в сообщение исполняемый javascript и html-код, а также о дополнительных возможностях форматирования - читайте http://javascript.ru/formatting.

рони 30.05.2018 19:56

Цитата:

Сообщение от Zufarro
Подскажите, пожалуйста, в чем моя ошибка?

на сайте свой код проверяли?
если и там не работает, гуглить «Отсутствует заголовок CORS «Access-Control-Allow-Origin»

Zufarro 31.05.2018 18:02

спасибо


Часовой пояс GMT +3, время: 06:49.