jQuery + Safari for iPhone = Parse Error?å𱳿 嬿 屳볍

14.02.2012

Останнім часом технічні завдання на розробку веб-сайтів усе частіше містять вимогу щодо підтримки Safari для iPhone / iPad. Один з наших постійних клієнтів, який знаходиться в Німеччині, якраз і побажав, щоб була реалізована підтримка цього самого Safari для iPhone / iPad.

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

Виявилось, що проблема не у відносних шляхах, що їх генерує система управління контентом, не в новій версії iOS (5.0.1) і навіть не в Safari для iPhone. Помилка була зумовлена німецьким оператором мобільного зв’язку T-Mobile!!! Точніше не ним самим, а тим, як впливали його методи оптимізації трафіку на код бібліотеки jQuery.

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

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

Корисні посилання:
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.

<- Назад до: Технічний блоґ


Роботи

Перенесення B2B-магазину рекламного освітлення з платформи xt:Commerce на платформу Magento
Перенесення B2B-магазину рекламного освітлення з платформи xt:Commerce на платформу Magento
Клієнт зажадав перенести свій B2B-інтернет-магазин з платформи xt:Commerce на більш сучасну й розповсюджену платформу Magento. Платформу Magento...
Онлайн-служба відстеження відвідуваності веб-сайтів (аналог Google Analytics)
Онлайн-служба відстеження відвідуваності веб-сайтів (аналог Google Analytics)
Зареєструвавшись на інтернет-сторінці служби, користувач у режимі реального часу отримує інформацію про те, хто відвідує його веб-сайт. Зокрема,...