Справочник функций

Ваш аккаунт

Войти через: 
Забыли пароль?
Регистрация
Информацию о новых материалах можно получать и без регистрации:

Почтовая рассылка

Подписчиков: -1
Последний выпуск: 19.06.2015

Как лучше сделать виджет?

422
25 марта 2011 года
Dimarik
181 / / 12.02.2005
Добрый день!
Есть сайт, для которого требуется сделать возможность размещения, например, ленты новостей на других сайтах. При этом на других сайтах должна быть возможность оценивать эти новости (т.е. добавлять/убавлять баллы).

В голове два варианта:
1. Тупо сделать страницу, на которой выводить этот виджет. И давать сайтам партнерам html-код фрэйма (iframe), у которого в качестве адреса будет страница с новостями.
2. Сделать через script, как написано здесь http://forum.hivext.ru/podkljuchenie-servisov/javascript-krossdomenye-zaprosy-k-servisam/
386
27 марта 2011 года
newcss
297 / / 05.04.2005
Посмотри как реализовано АПИ вконтакте...
1) Виджет при помощи JavaScript делается (глянь как на баше сделан, по тому же принципу сделан)
2) Генерируй нужным сайтам готовый PHP скрипт.... В котором будет уникальный SecretCode. На основе секретного кода скрипт будет подписывать свои запросы. На основе этого у тебя получится защищенный канал связи для
- получения новостей сайтом
- возможности оценивать новости через виджет с сайта
369
28 марта 2011 года
Kesano
451 / / 09.10.2007
Вариант сложный, но, наверное, достаточно красивый... Похож на GoogleAnalytics:
<script type="text/javascript">
var client_id="ID-123456";
var widget_width="300";
var widget_height="400";
(function() {
var widget = document.createElement('script'); widget.type = 'text/javascript';
widget.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.your-domain.com/script.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(widget, s);
})();
</script>

Далее делаете скрипт, который считывает client_id высоту, ширину, url страницы и AJAX-ом отправляет на ваше сервер для генерации виджета.
со стороны сервера принимаете параметры и на их основе генерите виджет. Например, в зависимости от ширины и высоты, можно менять количество выводимых новостей, размеры шрифтов и т.д.
Сгенерили.
Возвращаете данные клиенту, создаете div (или пусть он встраивается клиентом) и пихаете в него ответ сервера.
Технически может показаться сложным, но это не так...
386
28 марта 2011 года
newcss
297 / / 05.04.2005
Цитата: Kesano

your-domain.com/script.js


А не проще script.PHP ... который бы сгенерил ДжаваСкрипт сразу со всеми новостями? и в строке передать все параметры?
1 запросом будет меньше.

422
28 марта 2011 года
Dimarik
181 / / 12.02.2005
Цитата:
А не проще script.PHP ... который бы сгенерил ДжаваСкрипт сразу со всеми новостями? и в строке передать все параметры?
1 запросом будет меньше.


Дак вот в этом-то и дело. Т.е. проще всего в этом случае использовать наверное iframe. У iframe можно ведь задавать высоту и ширину + параметры отображения (например, цвет текста, цвет фона) можно передавать в параметрах url'а.

Есть ли подводные камни при использовании iframe для этой задачи?

369
28 марта 2011 года
Kesano
451 / / 09.10.2007
Цитата: Dimarik

Есть ли подводные камни при использовании iframe для этой задачи?



Есть.
1. Его содержимое не будет видно поисковикам (как и в случае с JS).
2. Нужно не забывать к ссылкам в этом фрейме добавлять target="_parent"
3. Задавать цвет фона и т.д. из родительского фрейма нельзя (насколько я знаю). Фрейм лишь отображает содержимое другой страницы. Если менять - то именно в ней, т.е. в станице вывода. Зависеть может от переданных в GET параметрах (при указании SRC фрейма).

я бы использовал iframe только в самых крйних случаях. рекоммендую еще раз посмотреть в сторону JS и DIV

386
28 марта 2011 года
newcss
297 / / 05.04.2005
Цитата: Dimarik
Дак вот в этом-то и дело. Т.е. проще всего в этом случае использовать наверное iframe.


Вот что Вам приелся этот iframe?
yourdomane.ru/news/fast/generate.php?font=12&color=c0c0c0&headerfont=FFFFFF&serverid=1265
при обращении по такому адресу ВАШ сервер сгенерирует уже нужный JavaScript с отображением всего всего всего того, что Вам нужно.
Я бы на свой сайт iframe блок ставить не стал бы. Не люблю я ифреймы, считаю что это прошлый век.

369
28 марта 2011 года
Kesano
451 / / 09.10.2007
Цитата: newcss
Вот что Вам приелся этот iframe?
yourdomane.ru/news/fast/generate.php?font=12&color=c0c0c0&headerfont=FFFFFF&serverid=1265
при обращении по такому адресу ВАШ сервер сгенерирует уже нужный JavaScript с отображением всего всего всего того, что Вам нужно.
Я бы на свой сайт iframe блок ставить не стал бы. Не люблю я ифреймы, считаю что это прошлый век.



Тогда реализацию я вижу так:
(взяты простые примеры, не претендуют на красоту кода, но на стабильность)

script.js
[HTML]
function getXmlHttp(){
var xmlhttp;
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (E) {
xmlhttp = false;
}
}
if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
xmlhttp = new XMLHttpRequest();
}
return xmlhttp;
}

var xmlhttp = getXmlHttp()
xmlhttp.open('GET', '/generator.php', true);
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4) {
if(xmlhttp.status == 200) {
document.writeln(xmlhttp.responseText);
}
}
};
xmlhttp.send("cliendid="+clientid+"&color="+color+"&format="+format);
[/HTML]

Содержимое generator.php думаю понятно...

index.html
[HTML]
<script type="text/javascript">
var clientid="ID-123456";
var color="c0c0c0";
var format="4";
(function() {
var widget = document.createElement('script'); widget.type = 'text/javascript';
widget.src = 'http://www.your-domain.com/script.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(widget, s);
})();
</script>

[/HTML]

Ну, что-то в этом роде )

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

422
29 марта 2011 года
Dimarik
181 / / 12.02.2005
Спасибо за ответ! Но я не уверен что XmlHttpRequest будет работать с кроссдоменными запросами.
369
29 марта 2011 года
Kesano
451 / / 09.10.2007
Цитата: Dimarik
Спасибо за ответ! Но я не уверен что XmlHttpRequest будет работать с кроссдоменными запросами.


Таки да... Хотя есть примеры кроссдоменного XHR...

Тогда вариант лайт:
[HTML]<script type="text/javascript" src="http://domain.com/script.php?cid=1234&style=5"></script>[/HTML]

а script.php генерирует вам следующее:
[HTML]
document.write("<style type=\"text/css\"> .div_style {param:value px; } </style> <div class=\"div_style\">Какой-то текст</div> ");
[/HTML]

Просто, кроссдоменно... Главное соблюдение кодировок и экранированные кавычки в теле document.write

422
30 марта 2011 года
Dimarik
181 / / 12.02.2005
т.е. делать как написано туто http://forum.hivext.ru/podkljuchenie-servisov/javascript-krossdomenye-zaprosy-k-servisam/ ....
369
30 марта 2011 года
Kesano
451 / / 09.10.2007
Цитата: Dimarik



Не совсем (хотя право ваше).
Описанный в предыдущем посте способ не требует танцев с бубнами, Ajax-запросов и чего-то сложного... Вам нужно стандартно подключить скрипт (который генерируется сервером), так что проблем с кроссдоменностью не возникнет абсолютно...

Реклама на сайте | Обмен ссылками | Ссылки | Экспорт (RSS) | Контакты
Добавить статью | Добавить исходник | Добавить хостинг-провайдера | Добавить сайт в каталог