создать виджет для извлечения и отображения данных через ajax

Question

Я попробовал классический подход ajax, но он выдает исключение javascript, в котором отказано в доступе при попытке добавить скрипт, хранящийся в другом домене. Теперь я уверен, что это возможно, поскольку Google заполняет объявления Google только через js; как и твиттер, и список можно продолжить.

Как я до сих пор думал об этом:

<div id="divId"></div>
<script type="text/javascript" src="http://mysite.com/script.js"></script>

Скрипт в script.js должен был изменить атрибут innerHTML элемента div выше. Вместо этого я получаю следующее сообщение в fireBug: Доступ к запрещенному коду URI запрещен: 1012

Я немного погуглил, но нашел только обходные пути, которые бесполезны, такие как php-прокси и тому подобное, тогда как я хочу, чтобы этот виджет был скопирован на сайты других людей, в блоги, форумы и т. Д.

Заранее спасибо за любые полезные ответы. :)

Answer 1

Поведение, которое вы видите, предназначено и существует по соображениям безопасности. Вы не хотели бы, чтобы сторонний скрипт вносил какие-либо изменения в вашу страницу, так как он может быть сильно использован.

Вместо этого дайте своим пользователям фрагмент JavaScript для вставки на их страницу.

<script>
    // do stuff here
</script>

Обратите внимание, что внутри этого фрагмента вы можете динамически создавать тег сценария, устанавливать атрибут src и загружать реальный JavaScript. Этот фрагмент, который ваши пользователи вставляют на свою страницу, имеет доступ ко всему DOM, но загруженный извне скрипт - нет.

Вот пример виджета профиля, который Twitter выдает для встраивания в веб-страницы:

<!-- external js, can't access or change the DOM -->
<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<!-- local js, does that -->
<script>
new TWTR.Widget({
  version: 2,
  ..
  ..
}).render().setUser('hulu').start();
</script>

Первый скрипт-тег загружает библиотеку, а второй, который фактически манипулирует страницей, добавляется как код напрямую.

Answer 2

Я наконец-то нашел решение, которое не включает ajax.Я просто использую

<div id="objectId"></div>
<script type="text/javascript" src="http://mysite.com/getAndDisplayData.php"></script>
<script type="text/javascript">getAndDisplayData();</script>

И в getAndDisplayData.php я генерирую JS-скрипт, который создаст мой виджет внутри div выше.Файл php также подключается к базе данных и получает все необходимые данные виджета.Видимо, это то, как работает реклама Google, хотя я не уверен.Впрочем, наверняка они не используют ajax.