Разобрать OpenClipArt api json на HTML

0

Я пытаюсь проанализировать этот json http://openclipart.org/search/json/?&query=christmas&page=1&amount=4 на моей странице html.

Мой код

<!doctype html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>jQuery.getJSON demo</title>
        <style>
            img {
                height: 200px;
                float: left;
            }
        </style>
        <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    </head>
    <body>
        <div id="images"></div>
        <script>
            (function() {
                var api = "http://openclipart.org/search/json/?";
                $.getJSON( api, {
                    query: "christmas",
                    page: "1",
                    amount: "4"
                }).done(function( data ) {
                    $.each( data.payload, function( i, item ) {
                        $( "<img>" ).attr( "src", item.svg.png_thumb ).appendTo( "#images");
                        if ( i === 3 ) {
                            return false;
                        }
                    });
                });
            })();
        </script>
    </body>
</html>

http://jsfiddle.net/2n8ax/, Но что-то не так.

  • 0
    В запрошенном ресурсе отсутствует заголовок «Access-Control-Allow-Origin».
  • 0
    Они исправили это: DDD Спасибо openclipart <3

1 ответ

0
Лучший ответ

Причина, по которой он не работает на jsFiddle, связан с политикой того же происхождения.

Это означает, что вам не разрешен доступ к ресурсам в другом домене (http://openclipart.org/) из jsfiddle.net.

Посмотрите эти два ресурса:

  1. Политика же происхождения
  2. Совместное использование ресурсов
  • 0
    Это не работает на моем компьютере (локальный), ни
  • 0
    Если вы открываете консоль, какую ошибку вы получаете?
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню