Технологія AJAX на основі інформаційної системи обміну даних

дипломная работа

2. ОГЛЯД ЛІТЕРАТУРНИХ ДЖЕРЕЛ

Інформаційні технології сьогодення дозволяють нам створювати надсучасні системи обміну інформацією в мережі інтернет при цьому заощаджуючи значні зусилля програмістів. Інформаційна система обміну інформацією це сукупність різноманітних web технологій що дозволяють оперувати значними обсягами даних використовуючи при цьому зручний інтерфейс для користувачів. Для оцінки сучасного стану інформаційних джерел за темою дипломного проекту використано інтернет сервіси такі як google.com, Wikipedia.org. У результаті загальної оцінки сучасного стану щодо публікацій по темі дипломного проекту , усі веб ресурси надали актуальну і достовірну інформацію сьогодення, зокрема інформація постійно оновлювалась останніми роками ,що свідчить про активне використання ресурсів по даній темі дипломного проекту та актуальність цієї теми. Для оцінки актуальності даної теми було здійснено пошук веб ресурсів які активно впроваждують та використовують ajax підхід у своєму проектуванні. Головною проблемою мого дипломного проекту є ajax технологія яку я впроваджував у розробку свого власного веб сайту, тому для порівняння власного проектування я розглянув готові рішення які повністю підтримуються ajax підхід.

Для того щоб краще зрозуміти суть мого дипломного проектування розглянемо головне визначення технології ajax із інформаційного ресурсу Wikipedia. JAX (Asynchronous JavaScript And XML) -- підхід до побудови користувацьких інтерфейсів веб-застосунків, за яких веб-сторінка, не перезавантажуючись, у фоновому режимі надсилає запити на сервер і сама звідти довантажує потрібні користувачу дані. AJAX -- один з компонентів концепції DHTML.[3]

Про AJAX заговорили після появи в лютому 2005-го року статті Джесі Джеймса Гарретта (Jesse James Garrett) «Новий підхід до веб-застосунків». AJAX -- не самостійна технологія. Отже як бачимо ajax досить широко застосовується у сфері програмування веб ресурсів і це свідчить про значне вдосконалення а сама концепція використання є дуже простою з точки зору програміста.

2.1 Суть ajax підходу

AJAX -- це не самостійна технологія, а швидше концепція використання декількох суміжних технологій. AJAX підхід до розробки призначених для користувача інтерфейсів комбінує кілька основних методів і прийомів:

· Використання DHTML для динамічної зміни змісту сторінки;

· Використання XMLHttpRequest для звернення до сервера «на льоту», не перезавантажуючи всю сторінку повністю;

· альтернативний метод -- динамічне підвантаження коду JavaScript в тег <SCRIPT> з використанням DOM, що здійснюється із використанням формату JSON);

· динамічне створення дочірніх фреймів.

Використання цих підходів дозволяє створювати набагато зручніші веб-інтерфейси користувача на тих сторінках сайтів, де необхідна активна взаємодія з користувачем. AJAX -- асинхронний, тому користувач може переглядати далі контент сайту, поки сервер все ще обробляє запит. Браузер не перезавантажує web-сторінку і дані посилаються на сервер без візуального підтвердження (крім випадків, коли ми самі захочемо показати процес зєднання з сервером). Використання AJAX стало найпопулярніше після того, як компанія Google почала активно використовувати його при створенні своїх сайтів, таких як Gmail,Google Maps і Google Suggest. Створення цих сайтів підтвердило ефективність використання даного підходу.[4]

Порівняння класичного підходу та AJAX

Класична модель веб-застосунку:

· Користувач заходить на веб-сторінку і натискає на який-небудь її елемент;

· Браузер надсилає запит серверу;

· У відповідь сервер генерує повністю нову веб-сторінку і відправляє її браузеру і т. д.;

· З боку сервера можлива генерація не всієї сторінки наново, а тільки деяких її частин, з подальшою передачею користувачу.

Модель AJAX:

1. Користувач заходить на веб-сторінку і натискає на який-небудь її елемент.

2. Браузер відправляє відповідний запит на сервер.

3. Сервер віддає тільки ту частину документа, яка змінилася.

2.2 Інтернет проекти на основі AJAX технології

Технологію ajax широко використовують провідні інтернет гіганти такі як google ,Wikipedia, yahoo, meta.Це свідчить про те що інноваційний підхід до створення потужних інтернет проектів не обходиться без використання технології ajax.Нижче наведені основні проекти провідних компаній ,що активно розвивають та використовують ajax підхід.

· Google suggest та Google Maps -- проекти, які показали можливості Ajax;[5]

· Protopage -- гарний приклад сайту на Ajax (особисті замітки);[6]

· eyeOS -- online-робочий стіл на Ajax;[7]

· BIM -- online-аггрегатор новин на Ajax;[8]

· Браузер по Wikipedia.org -- оболонка для навігації по Wikipedia.org на ajax.[9]

Google Suggest.

Google Suggest (англ. suggest -- пропоную) це сучасний сервіс пошукового запиту який автозаповнює рядок запиту на основі декількох введених символів. Коли користувач для прикладу вводить декілька букв у рядковому запиті google тоді автоматично за допомогою фонових запитів із бази даних підставляється готове слово яке відповідає умові запту користувача. Даний сервіс повністю працює на основі технології AJAX.

Protopage.

Хороший приклад сайту оновлення новин ,що активно використовує ajax технологію для динамічного інтерфейсу користувача є ролект Protopage. Даний сайт створений як rss система оновлення ,тобто користувач у фоновому режимі без перевантаження веб сторінки бачить список свіжих новин для свого профілю.

eyeOS.

eyeOS -- веб-десктоп з відкритим кодом що будується на концепції хмарних обчислень що дозволяєють співпрацю та звязок між користувачами. Більша частина проекту написана на PHP, XML, та JavaScript. Працює як платформа для веб-застосунків написаних з використанням eyeOS Toolkit. Включає в себе середовище робочого стола з 67 застосунками та системними утилітами. Доступна для портативних пристроїв через мобільний фронт-енд. Для розробників eyeOS надає eyeOS Toolkit -- набір бібліотек для розробки застосунків для цієї ОС. Використовуючи інтегроване систему eyeSoft, що базується наPortage, кожен може створити власний репозиторій для eyeOS та поширювати застосунки через нього.Кожна частина робочогу столу -- це окремий застосунок, що активно використовує технологію AJAX для відправки команд користувача в форматі XML на сервер. На сервері eyeOS теж використовує XML для зберігання інформації. Кожному користувачу на сервері виділяється окремий XML файл. Отже як бачимо даний веб за стосунок повністю побудований на основі технології ajax.

BIM.

Потужний та сучасний онлайн генератор інформації. Використовується як генератор новин для сайту. Активно використовує технологію фонового за стосунку ajax. Веб сайт сервісу.

Браузер по Wikipedia.org

Веб інформаційний ресурс працює повністю із підтримкою ajax системи обміну даних, що свідчить про потужний інтерфейс для користувачів веб сайту. Веб сайт із вбудованим у нього браузером працює у фоновому режимі без перевантаження веб сторінки. Отже вся оболонка навігації Wikipedia працює на основі технології ajax.

На сьогоднішній день сучасні та потужні веб сервіси у мережі інтернет проектуються із використанням останніх тенденцій інформаційних технології у сфесі веб прогамування. Технологія що дозволяє користувачам користуватись надсучасним і зручним інтерфейсом взаємодії це AJAX. За допомогою цієї концепції вдалось значно просунути практично до інноваційного рівня веб ресурси та проектування інформаційних систем.

2.3 Публікації на тему систем спілкування

Система обміну даних основною своєю функціональністю подібна до систем спілкування типу “чат” що використовується на даний час в усіх соціальних мережах ,веб чатах спілкування, поштових сервісах та онлайн системах спілкування. Всі ці системи працюють за одним схожим принципом: автоматичним оновленням контенту без перевантаження веб сторінки, це ї є основою моєї задазі дипломного проектування та аналізу прикладів публікацій.

phpBB Simple Chat v2.1

Аналогом проектування за темою мого дипломного проекту є публікація по темі ajax Simple Chat v2.1. Розробка російких програмістів що дозволяє обмінюватись повідомлення в мережі інтернет та використовувати інтеграцію у свій веб ресурс. Простий чат Підходить як для phpBB, так і для phpBBex. Даний чат поширений з відкритим кодом , тому є можливість його редагувати або доповнювати. Широко використовується у форумах та сайтах де є велика кількість клієнтів і потрібно організувати принцип обміну повідомленнями між зареєстрованими користувачами. Чат повністю спроектований на основі технології ajax.[10]

Можливості phpBB Simple Chat v2.1

· Повністю із підтримкою ajax технології ;

· Приватний повідомлення;

· Звукове сповіщення;

· Вибір кольору повідомлень;

· Підтримка смайликів;

· Автовизначення посилань;

· Автоблокування флуду,

Порівнюючи його структуру роботи та функціональність можу зробити висновки, що алгоритм роботи є типовий як для веб проектів такого типу. Розробка використовує подібний алгоритм роботи системи, тупу - чат, яка проектувалась подібною у темі мого дипломного проектування. Використання phpBB Simple Chat v2.1 не є ліцензійним та дозволяється використання відкритого коду як для своїх цілей так і для модифікації продукту.

Аглоритм роботи phpBB Simple Chat v2.1.

1.Аутенфікація у системі користувача.;

2. Вхід у профільну частину користувача;

3 Перевірка наявності флуду повідомлення;

3.1 Система оповіщення повідомлень ;

3.2 Відправка повідомлень;

3.3 Видалення повідомлень;

3.4 Редагування повідомлень;

4.Розлогування у системі(підтримка сесії якщо чат інтегрований у сайт).

Алгоритм роботи phpBB Simple Chat системи дуже простий та схожий із алгоритмом роботи додатку що проектується в даному дипломному проекті. Є можливість редагування повідомлень та видалення ,відправка здійснюється повністю у автономному режимі без перевантаження веб сторінки. Суттєвою різницею буде те що прихід нових повідомлень інформується через звукове оповіщеня, що не підтримується у додатку проектування дипломного проекту. Інтегрувати phpBB Simple Chat у власний сайт дуже просто так само як і використовувати як окремий модуль для форума чи то для власного сайту. Прогресивною частиною буде те що є можливість адаптації практично під різноманітну веб систему яка створюється чи проектується з використанням ajax підходу. Головною особливістю phpBB Simple Chat є використання ajax підходу та фонова відправка даних на сервер.

AjaxChat - чат для joomla.

AjaxChat це компонент додатку для joomla , що використовується як система обміну повідомлення між користувачами сайту. Є можливість відправляти повідомлення, редагувати, видаляти та створювати окремі кімнати для користувачів що мають різні права доступу. Система повністю адаптивня для веб сайту, тобто з легкістю підключається у веб ресурс без зміни частин коду. Є можливість змінювати мову інтерфейсу на фронтенді та налаштовувати колір повідомлень. Повністю із підтримкою ajax технології, повідомлення обновлюються асинхронно без перевантаження веб сторінки, що засвідчує подібність цієї розробки до дипломного завдання.

Алгоритм роботи компоненту.

1.Реєстрація, авторизація у системі;

2. Профіль користувача;

2.1.Відправка, видалення ,редагування повідомлень;

2.2 Розлогування системи;

2.3 Очистка історії.

Порівнюючи роботу цієї системи із проектованою мною у дипломному проекті я прийшов до висновку, що весь функціонал та алгоритм роботи дуже подібний та використання ajax підходу нічим не відрізняється. Для порівняння функціоналу роботи було використано тестову відправку повідомлень між двома користувачами у мережі кожний із яких був авторизований у системі. Результат роботи проектованого мною у дипломному проекті додатку та AJAX CHAT був подібний, повідомлення надсилались без затримок у системі обміну повідомлення та ідентифікувались у базі даних одразу після їх відправки, оповіщення були організовані з допомогою ідентифікаторів стану повідомлень що аналогічно у моєму додатку проектування. Повністю адаптивна версія ,некомерційна та з відкритим кодом. Прогресивною особливістю є те що програмна розробка повністю підтримує ajax підхід і це є раціональне рішення для застосунку до свого веб ресурса, системи спілкування.

SmZchat vioo (AJAX).

Аналогічний веб чат створений командою розробників проекту joomla на основі php mysql та підтримкою ajax технології. Використовується як модуль для підключення до веб ресурсу , не має ліцензії та поширюється у відкритому коді. Основна функція це обмін повідомлення між користувачами сайту та створення кімнат спілкування.

Алгоритм функціонування SmZchat vioo (AJAX)

1.Реєстрація та авторизація користувача;

2.Профільна частина користувача;

3.Кімната спілкування;

3.1 Відправка повідомлень;

3.2. Видалення повідомлень;

3.3 Редагування повідомлень;

4. Розлогінення.

Алгоритм роботи системи дуже простий та розбитий по модулях. Частина модулів відповідає за користувацький інтерфейс а інша частина за профіль користувача. Зручний принцип управління профільною частиною користувача. Є можливість вибору кольору для повідомлень, все це створює зручну та просту модель спілкування для веб сайту.

Universal ajax chat.

Універсальний чат для системи управління контентом joomla. Використовується для організації системи спілкування користувачів у сайті, підключається як окремий модуль. Класичний приклад веб додатку що спроектований на php 5 з підтримкою mysql бази даних та повністю з підтримкою ajax інтерфейсу користувача. Алгоритм роботи нагадує звичайну систему спілкування типу чат із веденням діалогу користувача окремо по кімнатах спілкування.

Алгоритм функціонування Universal ajax chat

1.Реєстрація та авторизація користувача;

2.Профільна частина користувача;

3.Кімната спілкування;

3.1 Відправка повідомлень;

3.2. Видалення повідомлень;

3.3 Редагування повідомлень;

4. Розлогінення.

Як бачимо існує безліч готовий рішень для вирішення завдання дипломного проектування. Враховуючи всі проектні та компонентні рішення можна зробити висновок про те , що системи обміну інформацією ,тобто системи спілкування для веб сайту ,використовують спільний інтерфейс користувача та принцип обміну даними. Використовуючи алгоритм роботи Universal ajax chat можемо побачити ,що першочерговою ланкою є авторизація користувачів а після вже йде обмін повідомленнями. Алгоритм роботи звичайної системи обміну повідомленнями для сайту нічим не відрізняється від наведених вище прикладів додатків що дає змогу інтегрувати їх абсолютно під будь який веб сайт чи додаток. Для прикладу Universal ajax chat являє собою звичайну системі обміну повідомленнями між користувача проте реалізація програмної частини значно відрізняється від SmZchat vioo (AJAX) за рахунок модульного принципу побудови програмного коду. Додаток що проектується у даному дипломному проекті буде мати модульну програмну структуру. Програмна реалізація всіх вище наведених додатків являє собою використання технологій php ,javascript, xml та mysql останніх версій , це дозволяє адаптувати додаток абсолютно під будь який веб ресурс що проектується де потрібно використання ajax системи обміну даними.

Отже для нашого проектування інформаційної системи обміну даних буде використано як приклад програмну реалізацію phpBB Simple chat. Алгоритм роботи phpBB Simple chat за своєю структурою нагадує алгоритм роботи додатку який проектується у даному дипломному проекті а також функціональна частина ,що відповідає за обмін даними між користувачами , ілюструє готовий результат роботи додатку що проектується. Серед інших особливостей можна виділити простоту інтерфейсу для користувачів та систему авторизації, що для прикладу ,у SmZchat vioo (AJAX) та Universal ajax chat спроектовано досить ускладнено на програмному рівні та алгоритмі роботи. Використовуючи готові рішення додатку ajax chat -чат для joomla(ajax chat joomla) я спроектував модель поведінки інтерфейсу користувача що дає змогу на цьому півні проектування висвітлити основні функції при роботі користувачів, які працюватимуть із веб ресурсом.

Основна інформація що стосувалась теми дипломного проектування сфокусована у пошукових системах таких як google та Wikipedia. Користуючись пошуковими інтерфейсами було знайдено безліч публікацій та матеріалів щодо теми дипломного проектування. Теоретичні основи та спекти теми дипломного проектування були доступні сервісом Wikipedia, що дало змогу розглянути сучасний стан публікацій щодо теми дипломного проектування. Було розглянуто основні визначення та джерела інформації що постійно оновлюються останнім часом. Існує безліч готових додатків та рішень, реалізацій проектів що використовують технологію ajax в основі систем обміну інформацією. Використовуючи готові рішення для вирішеня завдання дипломного проектування, як за приклад було взято алгоритм роботи phpBB Simple chat. Цей варіант є чудовим прикладом ,який демонструє роботу системи обміну інформацією користувачів веб сайту. Основна частина полягає у тому що потрібно організувати систему обміну інформації, тобто створити веб додаток типу “чат” як для прикладу у соціальних мережах. Орієнтація саме на такі готові рішення дала змогу оцінити phpBB Simple chat як чудовий аналог для проектування сласного веб додатку. Готові рішення phpBB Simple chat можна побачити у мережі інтернет, де після початкової реєстрації можемо переходити до тестування чату.

3. СИСТЕМНИЙ АНАЛІЗ

Обгрунтування проблеми вирішення завдання полягає у детальному системному аналізу проблеми. Це дає змогу розробити певний та чіткий алгоритм розвязку та в свою чергу приводить до правильного моделювання завдання. За допомогою аналізу складаємо послідовність дій з установлення структурних звязків між змінними або елементами досліджуваної системи. Для системного аналізу потрібно чітко визначити основну проблему завдання. У нашому випадку потрібно створити аналіз системи обміну інформації у для веб сайту. Потрібно чітко створити алгоритм роботи системи, проаналізувати структуру роботи та виділити основні аспекти розвязку завдання. Найголовнішою метою цього розділу є аналіз проблеми та побудова дерева проблеми. Після висвітлення матеріалу цього розділу, поєднюємо словесну аргументацію із математичними та структурованими моделями. Вкінці даного розділу буде створено критеріальні , алгоритмічні оцінки роботи системи. В загальному випадку характеризуємо опрацювання цього розділу як дослідження з метою розяснення шляхів вирішення проблеми. Єдиної методики системного аналізу у наукових дослідженнях поки що немає.

3.1 Аналіз проблеми

Система обміну інформації в рамках даного дипломного проектування представляється,як веб додаток для обміну інформації між користувачами веб сайту. Система обміну інформації має бути побудована на основі технології ajax, що створює принципово нову проблему проектування даного розділу. Обмін інформацією має здійснюватись між користувачами інтернет сайту, тобто мають існувати певні діалоги за допомогою яких буде взаємодія між користувачами веб ресурсу. В результаті реалізується інтерфейс відправки повідомлень в системі, тобто всі повідомлення надсилаються в діалозі користувачів адже це дуже зручно особливо коли повідомлень дуже багато. На цьому етапі проектування система обміну інформації буде представлятися як діалогова система обміну повідомленнями між користувачами, саме діалогова тому що реалізація обміну повідомлень має бути у вигляді діалогів як для прикладу у соціальній мережі “Вконтакте”. Транзакція повідомлень у системі повинна відбуватись миттєво без затримок, тобто безпосередньо після того як користувач надіслав запит на відправку. Всі повідомлення якими оперує користувач повинні зберігатись у системі обміну повідомленнями. Система обміну повідомлення представляє собою веб орієнтовану базу даних. Відповідно це буде основним вибором для збереження всіх повідомлень у системі для кожного користувача конкретно. Повідомлення не повинні одразу видалятись після того як користувач прочитав. Повідомлення стають не актуальними і зберігаються у системі обміну повідомлення. Формулювання проблеми на даному етапі проектування є досить розпливчасте тому кінцевий результат проблеми може суттєво відрізнятись від початкового. Для збереження інформації про всі повідомлення що є у системі обміну база даних реляційного типу підходить найкраще. Основною проблемою цієї частини проектування є використання технології ajax. Використання технології ajax дозволяє відправляти запити користувача у так званому “тихому режимі”. При відправці повідомлення із діалогу повинна бути зреалізована відправка даних на сервер без перевантаження сторінки щой дозволяє зробити ajax. Адже без використання ajax підправка на сервер здійснюється лише коли веб сторінка оновлюється, це дуже поширений випадок при класичній моделі створеня веб додатків без використання ajax підходу. В такому разі всі поля та форми що заповнені втрачаються і це дуже незручний спосіб проектування для нашого прикладу. Ця проблема являє собою ключовий принцип аналізу на даному етапі.

Делись добром ;)