Делаем информационный виджет для Drupal сайта

Недавно передо мной возникла задача — сделать информационный виджет для одного сервиса, что бы размещать его на сторонних сайтах.
Коротко о сервисе — Сайт «Умное слово на каждый день» — это первый образовательный ресурс подобного рода. Неизвестные широким массам слова появляются каждый день и составляют крупнейший в рунете словарь «умных» слов. Заходи на Everydayword.ru каждое утро и повышай словарный запас.

Перед созданием видждета передо мной встал вопрос, каким образом мне получать данные и в каком формате. Мой выбор пал на AJAX в связке с JSON.

Приступим

PHP

Первым делом нужно создать страницу на которую будет идти ajax запрос. Поэтому в файле модуля объявляем hook_menu() и функцию в которой мы будем возвращать данные:

function mymodule_menu() { $items['output'] = array(   'page callback' => 'mymodule_output', //функция для вывода данных   'access callback' => TRUE, ); return $items; }  function mymodule_output() { $data = array(   'title' => t('Your title'),   'body' => t('Your body'), ); drupal_json_output($data); } 

Чистим кэш с помощью инструмента Drush "Drush cc all", переходим на страницу yoursite.ru/output
Вы должны увидеть вот такой текст и ничего кроме {"title":"Your title","body":"Your body"}

JS

Ну вроде json формируется и отдается по определенному url, все хорошо, можно и js начинать писать.

$(document).ready(function () {   $.ajax({     url: 'http://yoursite.ru/output',     dataType: "json",     success: function(data) {       console.log(data)     }   }); }); 

Разбор ошибок и временные правки

К сожалению, вместо наших данных в консоли нас поджидает вот такая вот ошибка:
XMLHttpRequest cannot load http://yoursite.ru/output. Origin http://your-test-site.ru is not allowed by Access-Control-Allow-Origin.
Можно конечно просто разрешить ajax для домена yoursite.ru, но это же не будет делать каждый кто хочет установить наш виджет.
Однако у метода .ajax есть такая настройка как crossDomain, но работает она только с типом данных jsonp (dataType: 'jsonp')
Модернизируем наш скрипт:

$(document).ready(function() {   $.ajax({     url: 'http://yoursite.ru/output',     crossDomain: true,     dataType: 'jsonp',     success: function(data) {       console.log(data)     }   }); }); 

На этом дело не заканчивается и мы встречаем новую ошибку:
Uncaught SyntaxError: Unexpected token :
Оказывается браузер подключает нашу страницу как JS и пытается её исполнить. Немого изучив теорию jQuery.ajax() модернизируем наш код.

Итоговый, рабочий вариант.

JS

  $.ajax({     url: 'http://yoursite.ru/output?callback=?',     crossDomain: true,     dataType: 'jsonp',     success: function(data) {       // your process with data.     }   }); }); 

PHP

function mymodule_output() {   drupal_add_http_header('Content-Type', 'application/x-javascript');   $data = array(     'title' => t('Your title'),     'body' => t('Your body'),   );   $json = drupal_json_encode($data);   echo $_GET['callback'] . "($json);";   exit; }