jQuery + Safari for iPhone = Parse Error?å𱨿 嬿 ষ᳨

03.02.2012

В последнее время в ТЗ на разработку веб-сайтов все чаще встречается требование о поддержке Safari for iPhone / iPad.

Вот и один из постоянных клиентов компании itseedbed, находящийся в Германии, захотел, чтобы на его новом сайте, кроме прочего, была реализована поддержка этого самого Safari for iPhone / iPad.

После успешного окончания разработки мы перешли к стадии тестирования. Все работало отлично… но только не на iPhone клиента! Консоль ошибок устройства показывала Parse Error (см. скриншот), и, соответственно, весь основанный на jQuery интерфейс веб-сайта переставал работать. Проблема становилась еще более непонятной, учитывая тот факт, что на нашем iPhone все работало как часы. Мы начали искать причину и, признаться, некоторое время были в тупике. Однако в итоге наши усилия увенчались успехом.

Оказалось, что загвоздка не в относительных путях, генерируемых системой управления контентом, не в новой версии iOS (5.0.1) и даже не в Safari for iPhone. Проблема была в немецком операторе мобильной связи T-Mobile!!! Точнее не в нем самом, а в том, как соотносились его методы оптимизации трафика с кодом библиотеки jQuery.

Суть такова: мобильный оператор пытается оптимизировать трафик для того, чтобы сайты на телефонах его клиентов грузились быстрее. Один из методов такой оптимизации предполагает удаление всех комментариев из js-файлов для уменьшения их (файлов) «веса». Очевидно, оптимизатор  трафика ищет символы начала и окончания комментариев (соответственно /* и */) и, прежде чем грузить файл, удаляет все, что находится между ними. В то же время библиотека jQuery 1.4.1 (а именно с такой версией нам надо было работать) использует для своих внутренних целей символы */* в двух местах кода. Таким образом, содержимое, находящееся между парой */* (т.е. */* … */*), удачно вырезается по пути к пользователю. В результате «оптимизируются» не комментарии, а кусок рабочего кода. И все: библиотека jQuery теряет работоспособность, а интерфейс сайта становится статичным.

Зная причину, было несложно решить и саму проблему. В обоих местах, где она встречалась, последовательность */*  была заменена на ["*/"]+["*"]. После этих преобразований сайт начал правильно работать на iPhone клиента.

Полезные ссылки:
http://www.mysociety.org/2011/08/11/mobile-operators-breaking-content/ — в статье объясняется суть проблемы, а также говорится о том, что не только T-Mobile оптимизирует свой трафик таким образом.
bugs.jquery.com/ticket/9969 , bugs.jquery.com/ticket/10098 — обсуждение проблемы на баг-трекере jQuery.

По последним данным с того же баг-трекера можно сказать, что ошибка все еще имеет место быть. Пользователи сообщества jQuery советуют использовать hosted-версию библиотеки: code.jquery.com/jquery-1.7.1.min.js .

<- назад в: Технический блог


Работы

Социальная сеть для страховых агентов
Социальная сеть для страховых агентов
Социальная сеть — место встречи страховых агентов, хорошая возможность для агентов представить себя потенциальным клиентам. Через социальную сеть...
Сайт ипподрома
Сайт ипподрома
Основная цель сайта — поведать посетителям о проводимых на ипподроме соревнованиях, истории ипподрома, его современном функционировании. Также все...