Обновить
  • по релевантности
  • по времени
  • по рейтингу

Практический AJAX: что делать с закладками

Разработка веб-сайтов *
Примечание: ниже перевод статьи «Ajax Best Practices: Don't Break Bookmarks», посвященной решениям, позволяющим пользователям корректно добавлять в закладки страницы сайта, сделанного при помощи AJAX-методов. Я постарался дополнить ее по мере сил, опираясь на обсуждение предыдущей статьи из серии.

Статья является второй из серии (здесь первая), посвященной устранению критики, которую сейчас так много адресуют использованию AJAX, и обзорам методов, которые помогут сделать ваш сайт чуточку лучше.
Читать дальше →
Всего голосов 11: ↑10 и ↓1 +9
Просмотры 2.6K
Комментарии 16

Web-Безопасность: iframe'ы — зло

Чулан
Отличная заметка опубликована в блоге The Spanner под названием iframes are evil. Основная идея вот в чем: так как iframe'ы являются большим риском для интернет-безопасности, но исключение их не возможно — сделать нечто аля

<html security=«iframe»>


для страничек, использующих эти самые iframe'ы.
имхо, отличная идея, только следует сделать как раз наоборот disableiframe :)

Идея взята: www.thespanner.co.uk/2007/09/09/iframes-are-evil
Всего голосов 3: ↑2 и ↓1 +1
Просмотры 3.6K
Комментарии 8

Практический AJAX: что делать с кнопкой «назад» в браузерах

Разработка веб-сайтов *
Перевод
Примечание: статья посвящена обзору проблемы неработающей кнопки «назад» в браузере при использовании AJAX-методов для передачи содержания страниц от сервера к клиенту. В статье рассматриваются основные принципы работы AJAX и возможные пути решения заявленной проблемы. Курсивом даны мои комментарии.

Эта статья является первой из ряда материалов (вторая статья посвящена работе с закладками), направленных на устранение части критики, которую адресуют сейчас AJAX, и предоставляющих обзор полезных методов, которые помогут сделать ваши приложения и веб-страницы, использующие технику AJAX, немного лучше.
Читать дальше →
Всего голосов 34: ↑28 и ↓6 +22
Просмотры 16K
Комментарии 27

Подсветка текста в «TextArea»

JavaScript *
Эта статья покажет, как в современных браузерах можно сделать подсветку текста в поле редактирования (WYSIWYG).
Пример можно посмотреть, в google.docs или на некоторых продвинутых форумах.

Уверен, многим это будет интересно.

Атрибут contentEditable и параметр designMode


Именно contentEditable или designMode и делает для нас всю основную «грязную» работу.

Если этот атрибут поставить в тег, то всё, что внутри тега, становится автоматически редактируемым.

<html><head></head><body>
  <div contentEditable="true"><b>C</b>ontent<u>!!!</u></div>
</body></html>
работающий пример

Этот атрибут не поддерживается сейчас некоторыми старыми браузерами (например, FireFox 2.0). Но есть более «глобальный» параметр страницы, который сейчас поддерживают все браузеры, который нам может помочь —
designMode
Всего голосов 64: ↑55 и ↓9 +46
Просмотры 18K
Комментарии 28

Создание HTML формы при помощи web-интерфейса

Чулан

Применяющиеся термины


HTML — Он же XHTML, язык разметки гипертекста, для создания веб-страниц, интерпретируется браузером и отображается в виде документа, в удобной для человека форме.
FORM — Тег <FОRM> устанавливает форму на веб-странице. Форма предназначена для обмена данными между пользователем и сервером. Область применения форм не ограничена отправкой данных на сервер, с помощью клиентских скриптов можно получить доступ к любому элементу формы, изменять его и применять по своему усмотрению.

Превью


В ближайшее время, отведенное Вами на прочитку данного топика, я познакомлю Вас с сервисом предлагающим автоматическое создание исходного кода различного вида форм, для Вашего ресурса. Будь то: обратная связь, корзина, баг трэкер, и многое другое. В том числе имеется возможность создания своей формы, не по шаблонному макету. Сервис имеет статус: freeware, но даже в этом режиме он предоставляет его пользователям все возможности, которые требуются для Вас! Имеется определенное количество стилей, некоторые из них Вы сможете увидеть в следующем разделе. Для полноценного использования сервиса, от Вас потребуется всего лишь регистрация, не требуемая активации через почтовый адрес. Все данные отправленные пользователями при помощи созданной Вами формой, будут отправлены Вам на почтовый адрес, указанный Вами в настройках формы (см. раздел «Панели»).
Читать дальше →
Всего голосов 26: ↑14 и ↓12 +2
Просмотры 705
Комментарии 23

Оригинальный баг с iframe и DOM в IE

Разработка веб-сайтов *
Некоторое время назад обнаружил интересный баг в IE, успешно доживший и до восьмой версии. Суть бага заключается в том, что при уходе со страницы содержащей несколько iframe-ов и последующем возврате при помощи кнопки back, содержимое этих самый фреймов может перемешаться.

UPD: Говорят FF и Opera на этом коде тоже косячат, но по-другому :)
Читать дальше →
Всего голосов 40: ↑38 и ↓2 +36
Просмотры 3.1K
Комментарии 10

Роботы — внедрятели вирусного кода стали портить сайты

Чулан
Раньше как правило они просто дописывали iframe в код сайта. Что лечилось методом «search and destroy», то есть простым поиском включения текста в файлы и удалением оного.

За последнюю неделю произошли некоторые тревожные изменения в поведении злоумышленных роботов. Сначала я обнаружил, что в одном из файлов cms (распространенной платной отечественной) пропали строки, отвечающие за вывод макета. Первый раз подумал — случайность или кто-то из имеющих доступ случайно удалил, когда встретил второй раз подумал, что робот обучен удалять строки из файлов конкретной cms (натравлен на нее).

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

Резюме. Новое поколение роботов анализирует php код (не знаю про другие языки) и удаляет строки, в которых распознает вывод макета. В моем случае из разных cms-ок были удалены строки:

eval(«echo \»$Template->header\";");
eval(«echo \»".$template_header."\";");

Такие дела.
UPD: Забыл написать, что происходит это по такой схеме.
Троян ворует с вашего компа данные фтп доступа, сохраненные чаще всего в total commander. Еще я слышал, что воруют из FAR но не знаю правда или нет. Отсылает на свой сервак. А сервак уже после того, как в каком-нибудь браузере обнаружена уязвимость, резким ударом прописывает на всех доступных сайтах iframe, заставляющий пользователя выполнить эксплоит.

Самое простое решение, которое я вижу — через ПУ хостинга ограничивать доступ к фтп. По айпи, по региону. Но пока насколько я знаю такого нет. Не сохранять фтп пароли это слишком геморройно. Вытаскивать каждый раз из текстового файлика…
Всего голосов 11: ↑8 и ↓3 +5
Просмотры 454
Комментарии 63

55 тыс сайтов в Интернете оказались заражены одним и тем же iframe

Информационная безопасность *
Как сообщает компания ScanSafe в своем блоге, сегодня в Интернете была проведена массированная XSS-атака. На более, чем 55 тыс сайтов медицинских услуг и благотворительных организаций, а также на такие ресурсы, как feedzilla.com, был внедрен вредоносный iframe. Специалисты ScanSafe вычислили, что он ведет на ресурс a0v.org, с которого подгружаются еще несколько эксплойтов. При этом, как отмечают в ScanSafe, количество зараженных ресурсов продолжает расти: на момент распространения новостей в западных СМИ (TechRepublic, ZDNet), количество зараженных доменов перевалило за 55 тыс.

PS: собственно вот каким iframe заразили столько сайтов:
“script src=http://a0v.org/x.js”

В Рунете таких ресурсов довольно-таки мало, Google (чем и пользуются ScanSafe) видит этот код, например, на поддоменах product.ru
Всего голосов 52: ↑44 и ↓8 +36
Просмотры 1.3K
Комментарии 65

Авторесайз IFRAME и безопасный способ передачи информации с одного домена на другой

JavaScript *
Как известно, при работе с фреймами для обеспечения безопасности браузеры не позволяют JavaScript-коду обращаться со страницы одного домена на страницу другого домена. В этой краткой статье мы рассмотрим аспекты кросс-доменной работы в JavaScript, опишем один из «хороших» частных случаев, а в конце — я надеюсь в хабракомментах получить ответы на оставшиеся вопросы.

UPD1: те, кто здесь впервые, — обязательно читайте комментарии к этой статье, в них очень много интересного накидали (как я и надеялся). Спасибо!

UPD2: найдено решение задачи авторесайза для всего, кроме Opera < 10.

UPD3: полностью кроссбраузерное решение задачи с ресайзом приводится ниже. Его особенности: а) не портится history, б) работает даже в Опере 7 и IE6, в) для ускорения работы высота фрейма всегда делается кратной N=30 пикселям. Фактически, там 2 алгоритма — для IE (через location.hash) и для «не-IE» (через window.name и «простукивание» возможных высот в цикле). См. также комментарии к статье, там разъяснения, почему так, а не иначе.

UPD4: статья начала принимать черты монументальной, посему она переехала ко мне в Наблы на dkLab: dklab.ru/chicken/nablas/58.html — там же все примеры кода самой последней актуальности. Но, конечно, в случае изменений я буду их и тут тоже анонсировать, добавляя UPD5, UPD6 и т.д.
Всего голосов 39: ↑28 и ↓11 +17
Просмотры 10K
Комментарии 71

Мой авторесайз IFRAME

Чулан
Прочитав статейку Дмитрия Котерова о ресайзе ифрэймов решился поделиться своим решением.

Этим решением пользуемся на продуктивном сайте.

Итак, дано:
1. Нужно показывать в ифрэйме страницы с других доменов без скроллбара
2. Внутри ифрэйма могут совершаться переходы
3. Сайты в ифрэйме могут менять высоту без перегрузки (AJAX или просто раскрытие каких-нибудь невидимых элементов)
4. Во включаемые страницы должно включаться кода по минимуму
5. Решение не должно портить историю посещение браузера и должно работать в актуальных версиях популярных браузеров
6. Решение должно работать в обоих случаях master.site и www.master.site

Читать дальше →
Всего голосов 8: ↑7 и ↓1 +6
Просмотры 2.6K
Комментарии 7

Заражение сайтов по FTP

Чулан
Добрый вечер, уважаемые хабравчане!

У меня сложилась неприятная ситуация. Сделал сайт клиенту. Он доволен, деньги получены.
Но через месяц я обнаружил что при заходе на сайт начинает ругаться антивирус Avira. Говорит, что страница заражена WebGen. Просмотрев index.php обнаружил, что в конце файла стоит iframe который загружает вредоносный код. Вроде бы дело ясное — полечил машину ( Avira, Avast затем cureit! ), сменил пароль на хостинге. Пароль никому не сообщал.

Читать дальше →
Всего голосов 15: ↑10 и ↓5 +5
Просмотры 637
Комментарии 51

Cookies внутри iframe — проблема при создании приложения ВКонтакте/Facebook

Браузеры
Из песочницы
Управление сессиями при помощи посылки cookies на сайтах стало настолько распространено, что без этого не обходится, наверное, ни один проект, требующий авторизации пользователей. Казалось бы, механизм настолько изучен, что проблемы с ним просто немыслимы.

Так считали и мы при разработке iframe-приложения для ВКонтакте.
Но после того, как приложение было разработано (разработка велась в основном в Mozilla Firefox и Google Chrome), выяснилось, что оно неработоспособно в Internet Explorer, к которому позднее присоединились последние версии Opera и Safari.

Под катом подробное описание проблемы и вариантов её решения.
Читать дальше →
Всего голосов 59: ↑54 и ↓5 +49
Просмотры 25K
Комментарии 45

CSS Pivot: платформа для совместного дизайна веб-сайтов

CSS *
Многие пользуются различными плагинами, чтобы улучшить внешний вид любимых сайтов: избавить их от рекламы, поменять дизайн и т.д. Например, есть хороший плагин Stylebot для Google Chrome. Всё это замечательно, но только одна проблема: результатами своей работы по изменению дизайна сайта вы не можете легко поделиться с другими. Сервис CSS Pivot (от разработчиков Stylebot) призвана решить эту проблему.

CSS Pivot позволяет применить собственные стили CSS к любому сайту — и поделиться этим URL с другими людьми. Не требуется ни установка расширений к браузеру (то есть работает в любом браузере), ни регистрация в сервисе. Сайты грузятся в iframe.
Читать дальше →
Всего голосов 28: ↑23 и ↓5 +18
Просмотры 3K
Комментарии 14

Запускаем сторонний код в песочнице

JavaScript *
Как гласит статья из Википедии, Песочница — механизм для безопасного исполнения программ. Песочницы часто используют для запуска непротестированного кода, непроверенного кода из неизвестных источников, а также для запуска и обнаружения вирусов.

Представим, что у нас стоит задача: есть какой-то проект и пользователи могут под него писать свои скрипты (виджеты, дополнения, плагины). Мы хотим, чтобы пользовательские скрипты не делали ничего плохого (кража кук это меньшее, что они могут сделать).

В статье пойдет речь об атаках, которые могут совершать злоумышленники и о методах безопасного выполнения стороннего кода.
Читать дальше →
Всего голосов 97: ↑92 и ↓5 +87
Просмотры 4.5K
Комментарии 25

Разработка IFrame приложения для ВКонтакта

Django *
Несмотря на то, что данная социалка «горячо любима» аудиторией хабра, я всё же решил рискнуть и опубликовать небольшие заметки посвящённые разработке приложений на Джанге под неё.

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

Под катом:
  • django-vkontakte-iframe и vkontakte
  • Загрузка приложения на стену
  • Флеш-заглушка
  • Сессия в горячо любимом IE
  • Все «flashVars» передаются GET запросом
  • Работа во фрейме
  • Доступ к информации пользователя
  • Проверка валидности вёрстки
  • JSLint ваш друг и товарищ
  • Генерирование миниатюр
  • Модерация через прокси-модель
  • Импорт настроек
  • Оптимизация

На правах рекламы: Приложение называется «Коллекционер» и предназначено для людей занимающихся коллекционированием монет, марок, карт и других предметов. В данный момент наполнен лишь каталог карт MTG, но в будущем будут созданы и наполнены каталоги для других предметов. Разумеется, мы с радостью выслушаем все ваши предложения и конструктивную критику.
Читать дальше →
Всего голосов 46: ↑36 и ↓10 +26
Просмотры 18K
Комментарии 16

Microsoft не считает кукиджекинг серьёзной угрозой

Информационная безопасность *
На недавней хакерский конференции в Швейцарии итальянский исследователь Розарио Валотта (Rosario Valotta) продемонстрировал интересный баг в IE 7/8/9, позволяющий скопировать кукисы с компьютера пользователя.

По аналогии с кликджекингом, метод работает через прозрачный iframe, куда выводится список файлов из папки с кукисами. Над ним размещается ещё один элемент, который пользователь перетягивает на другой фрейм с минимальными настройками безопасности (Security Zones в IE), фактически добровольно отдавая файлы злоумышленнику. В своём блоге Розарио Валотта выложил красивый паззл c полуобнажённой девушкой, где кусочки мозаики нужно убирать в сторону — и за несколько дней он получил кукисы от 80 из 150 своих френдов на Facebook. Сайт Валотты на хостинге Google уже отключен за нарушение ToS.
Читать дальше →
Всего голосов 54: ↑46 и ↓8 +38
Просмотры 707
Комментарии 15

Выезжающая панель на CSS3 с iframe внутри

CSS *

Здравствуйте, уважаемые Хабро-CSS3-люди!
Хочу поделиться маленьким опытом создания выезжающей панельки на CSS3 с iframe внутри и тем, как побороть неприятные сюрпризы от IE. Это решение мне кажется хорошо подойдет для добавления на сайт формы обратной связи, чата с консультантом и т.п.
На всякий случай напомню, что у iframe есть свои минусы, и при создании сайта с iframe необходимо их учитывать. Есть и плюсы, однако топик не об этом.
Добро пожаловать под хабракат
Всего голосов 41: ↑36 и ↓5 +31
Просмотры 13K
Комментарии 62

Автоматическая кросс-доменная установка высоты Iframe

Разработка веб-сайтов *JavaScript *
Tutorial
Думаю, многие, кто сталкивался в своей работе с iframe, сталкивались и с задачей установки высоты этого самого айфрейма.

Это может быть необходимо, например, когда ты хочешь дать возможность пользователям ставить виджеты с вашего сайта на их сайт, и хочется, чтобы размер контейнера (iframe) виджета соответствовал размерам содержимого этого виджета.

В яндексе можно найти множество решений этой проблемы, но большинство из них обладают одной проблемой: они не поддерживают возможность менять размеры окна когда содержимое iframe и родительский элемент находятся на разных доменах.

Есть одно неплохое кросс-доменное решение, но оно было написано в 2007 году, а с тех пор многое изменилось. Поэтому пришлось разрабатывать решение этой проблемы самостоятельно, основываясь на приведенном решении.

Читать дальше →
Всего голосов 34: ↑32 и ↓2 +30
Просмотры 34K
Комментарии 45

Велосипед: альтернатива iframe на jQuery.ajax как инструмент разработки mash-up приложений. Есть ли смысл?

Разработка веб-сайтов *JavaScript *
альтернатива iframeВсем привет! Хочу предложить вниманию сообщества технический механизм, позволяющий без лишних усилий сделать iframe-подобное приложение, работающее на ajax. В качестве основы использованы jQuery и easyXDM.

Техническое описание, прототип, предположения о возможных вариантах использования и сомнения под катом.

Читать дальше →
Всего голосов 10: ↑8 и ↓2 +6
Просмотры 23K
Комментарии 5

Загрузка файлов в AngularJS

Разработка веб-сайтов *JavaScript *Angular *
Давно писал модуль для загрузки файлов и всё он был не идеальным. И тут подумал, если сейчас не опубликую, то никогда не опубликую, идеал-то не достижим!

При составлении АПИ руководствовался принципом — как можно проще. Поэтому сначала несколько мыслей о загрузке файлов:

Загрузка только методом POST. Как показала практика, сам по себе файл почти никогда не бывает отдельной сущностью и всегда привязан к каким-то другим данным в базе, поэтому создавать запись вместе с загрузкой файла — плохая идея. Правильно: сначала создать запись, потом отдельным запросом добавить туда файл. Такой подход снимает кучу вопросов, связанных с отменой загрузки, параллельным редактированием описания файла и проч. Так же, создавая запись предварительно, мы можем получить в ответ данные о количестве свободного места на сервере и использовать их для валидации на клиенте.

Загрузка каждого файла отдельным запросом. На любом хостинге существует ограничение на максимальный размер POST-запроса (напр., 10 МБ). Если мы грузим одновременно 10 файлов, значит их вес в сумме не должен превышать 10МБ. В 99% случаев проще пожертвовать производительностью и не иметь проблем с такими ограничениями.

Никаких отложенных загрузок. Файл должен загружаться сразу после добавления (не в 2000 году, чай, живем), поэтому никаких методов работы с очередью — выбрал файл, выбрал еще 5 штук, удалил один, нажал «отправить» — не будет. Зато будет отмена загрузки.

Не стоит разделять загрузку файлов по кнопке и перетаскиванием. В моем случае любая область, помеченная директивой позволяет перетаскивать на нее файлы, а если это инпут с типом file, то еще и в проводнике можно выбрать. Очень удобно знать, что на кнопку можно перетаскивать, когда потянул в браузер 10 файлов, а дизайнер забыл подсветить поле перетаскивания, и гадаешь перетащатся ли они или откроются в новом окне.
Читать дальше →
Всего голосов 44: ↑44 и ↓0 +44
Просмотры 57K
Комментарии 29
1