Виджеты Javascript для захвата внешнего JSON / XML ... Как?

Question

Я хотел бы создать небольшой встраиваемый виджет для веб-страниц, который будет иметь доступ к API, обслуживающему XML или JSON (я могу выбирать между этими двумя форматами).Я хотел бы, чтобы пользователь просто выделил блок кода и вставил его на веб-сайт, подобно виджетам Twitter

Из-за проблем с междоменной безопасностью я могуне просто вызов ajax для загрузки этих внешних наборов данных, так что я должен просто использовать iFrame?Я предпочел бы что-то с немного большей гибкостью в выводе, чтобы пользователи могли изменить это с помощью CSS.

Есть ли что-нибудь, что можно сделать, кроме открытия междоменных привилегий на хост-сайте?

Answer 1

Читать о jsonp .

Как правило, упрощенная реализация, просто чтобы объяснить, как она работает, будет:

на клиенте:

  var s = document.createElement("script");
  s.src = "http://yoursever.com/path/to/server/page?r=mySpecialCallback"
  document.body.appendChild(s);

  function mySpecialCallback(data){
      //do stuff with data that server returned 

  }

на сервере, например в aspx

  <%=Request["r"]%>({name: "Don-Joy", age: 34 } );

или в Php

  <?php $_GET['r']?>({name: "Don-Joy", age: 34 } );

Ограничения:

1 - нет сообщения. только ПОЛУЧИТЬ. данные, отправляемые на сервер, ограничены тем, что помещается в URL

2 - ответ сервера не является чистым JSON - его необходимо обернуть в функцию обратного вызова, чтобы клиент давал серверу свое имя - в этом примере - используя строку запроса r параметр.

Развлекайся

Answer 2

JSONP ваш друг.Просто отправьте данные обратно в динамически добавленном связанном скрипте.

Во-первых, запрос данных отправляется клиентом на ваш сервер через что-то вроде:

var script = document.body.appendChild(document.createElement("script"));
script.type = "text/javascript";
script.src = "http://yourserver/yourhandler?parameters=values";

Затем запросите сервер данных-сторона на вашей машине.Вернуть ответ как JavaScript.Что-то вроде:

DataResponse({ /* data here */ });

Этот скрипт загружается в созданный ранее элемент скрипта.DataResponse() вызывается запрашивающим клиентом.