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

Організація системи контролю користувачів являє ключовий аспект проектування. Функціонування додатку неможливе без авторизації або реєстрації користувача. Створення профільної частини для користувача є обов'язковою складовою функціонування системи. Профільна частина користувача дає можливість санкціонованого доступу до системи, тобто лише після того коли користувач здійснив вхід у систему йому надається можливість оперувати його власними даними. Тобто потрібно створити можливість входу у систему та реєстрацію щоб відбувся санкціонований доступ. Інформація про користувачів у системі буде зберігатись у базі даних реляційного типу. Загальний аналіз цієї проблеми показує що потрібно розробити алгоритм роботи авторизації та реєстрації у системі.

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

3.2 Побудова дерева цілей

Слід зауважити, що на практиці, як правило, існує кілька цілей і тому важливо, окрім визначення головної мети, не упустити деякі з суттєвих серед інших. Для цього застосовують метод побудови дерева цілей, що був запропонований ще 1957 року групою американських учених та успішно використаний в ряді військових та промислових програм у США, а нині є повсякденним інструментом практично будь-якого сучасного менеджера. Метод побудови дерева цілей являє собою один із найрозповсюдженіших та найефективніших способів аналізу слабко структурованих завдань, що стоять перед економічними об'єктами. Він допомагає знаходити найкращі шляхи та засоби вирішення існуючих проблем. Деревоподібні ієрархічні структури використовуються і при дослідженні та удосконаленні організаційних структур.

Отже для побудови дерева цілей будемо використовувати поділ загальної цілі на під цілі, тобто визначимо які основні цілі будуть а які глобальні.

Головна мета(генеральна мета).

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

Підцілі першого рівня.

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

-Вибір середовища програмування;

-Авторизація та реєстрація користувачів у системі;

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

-Обмін повідомленнями;

-Крос браузерність.

Підцілі другого рівня.

Для висвітлення цих цілей потрібно чітко зрозуміти які основні розподіли цілей першого рівня існують у системі. Це зумовлено проектуванням на рівні деталізації цілей похідних рівнів. На цьому рівні деталізуються багатообіцяючі цілі які ми проектуємо. Серед таких цілей є:

-Побудова сесії підтримки користувача;

-Збереження сеансу користувача;

-Статуси користувачів;

-Статуси та прихід повідомлень;

-Розголінення користувачів;

-Організація діалогів на основі ajax;

-Використання універсального фреймворка для кросбраузерності java коду.

Підцілі третього рівня

- Захист профільних даних користувача;

-Автоматичне оновлення індекаторів вповідомлень. (впровадження ajax );

-Автоматичне оновлення індекаторів Користувачів. ( впровадження ajax);

-Створення кімнати спілкування для користувача;

-Використання фреймворка jquery.(Кросплатформенний);

-Використання js.

Після деталізації та розподілу загальної мети можемо побудувати дерево цілей. Дерево цілей показує які головні цілі нам потрібно виконати і дає змогу вирішити всі явні проблеми на різних етапах а це є оновною проблемою. Отже дерево цілей буде мати 4 лілки: головна мета(генеральна мета на цьому етапі проектування),підцілі першого рівня,підцілі другого рівня,підцілі третього рівня. На рисунку 3.2, нижче показане дерево цілей яке спроектоване на цьому етапі.



Малюнок 3.2. Діаграма цілей системного аналізу

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

3.3 Побудова дерева завдянь

Побудова дерева проблеми включає в себе необхідний етап побудови дерева завдань. Дерево завдань включає в себе висновки щодо правильної роботи системи, правильної роботи окремих функціональних складових та всіх гілок дерева цілей.[11]

Основні завдання, які повинні бути реалізовані у системі обміну інформацією на основі ajax технології,можна класифікувати за наступними критеріями:

-Іноваційний підхід

-Простота програмного коду

-Кросбраузерність додатку.

-Створення зучного інтерфейсу користувача

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

Іноваційний підхід.

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

Простота програмного коду.

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

Кросбраузерність додатку.

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

Попросту кажучи, таку характеристику дають сайтам, дизайн яких однаковий як в Internet Explorer, так і в Google Chrome. Відображення сайту при цьому може відрізнятися лише дрібними деталями (наприклад загругленими куточками, рівнем тіні, градієнтної або суцільною заливкою), але не кольоровою гамою, розташуванням елементів, а також, що найважливіше у визначенні даного поняття, структурою сайту, адже особливо багато проблем виникає з “блочною” версткою. Часто виникає багато проблем з версіями Internet Explorer нижче 10, тому багато розробників веб-сайтів не турбуються про кросбраузерність, а ставлять сторінку-загрушку, тобто користувач Internet Explorer може бачити лише одну сторінку, на якій йому рекомендується змінити браузер, без можливості перегляду контенту.

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



Малюнок 3.3 Діаграма дерева завдань.

3.4 Обгрунтування та агрегування критеріїв

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

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

· систему, в якій існуюча ситуація розглядається як проблема;

· систему, в рамках якої можна вплинути на проблему для її вирішення;

· зовнішнє середовище, в якому існують та з яким взаємодіють ці дві системи.

Формюлювання критеріїв потрібно якомога більш наблизити до цілей які ми побудували. Цілі являють собою якісний показник роботи системи. Для представлення критеріїв будемо опиратись на такі особливості як надійність, захищеність, швидкість опрацювання, середовище роботи, інноваційний підхід, користувацький інтерфейс . Як бачимо ці критерії найточніше характеризуються нашу проектну ціль при розробці. Серед дуже важливих картерів можемо виділити такі, як захищеність та інноваційний підхід.

Надійність системи.

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

Захищеність.

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

Швидкість опрацювання.

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

Середовище роботи.

Для повнофункціональної роботи системи потрібно середовище її виконання. Таким середовищем роботи системи є браузер користувача, тобто веб переглядач сторінок. Існує безліч нюансів роботи веб оглядача. Як було сказано раніше повинна бути підтримка роботи мови сценаріїв javascript, що зазвичай деякими користувачами відклюється, в такому випадку повнофункціональна роботи системи неможлива. Веб браузер у кожного користувача на його власному комп'ютері відрізняється тому постає проблема кросплатформенності. Потрібно зреалізувати роботу системи у всіх середовищах виконання одинаково, що дасть змогу.

Іноваційний підхід.

Побудова функціоналу роботи сиcтеми зосереджена на використанні сучасних версій мов програмування та синхронізації роботи користувача. Для програмування буде використовуватись мова php((англ. PHP: Hypertext Preprocessor -- PHP: гіпертекстовий препроцесор). Особливість вибору такого рішення є те що php створений для реалізації саме для таких цілей які нам потрібно і при цьому дуже зручний та простий у використанні. Для того щоб уникнути класної моделі поведінки веб додатку було прийнято рішення використання технології ajax,яка дасть змогу створити синхронізацію роботи користувача із системою, а саме уникнути перевантаження веб сторінок при відправці даних про що йшлось раніше.

Користувацький інтерфейс.

Робота користувача у системі повинна бути для нього прозора та зручна саме за це буде відповідати створюваний на даному етапі проектування інтерфейс. Основним принципом зручності інтерфейсу користувача буде використання технології ajax. Як говорилось раніше всі користувацькі запити будуть синхронно відправлятись на опрацювання і при цьому робота користувача не буде перериватись на час виконання обробки запиту.

Аналіз альтернативних шляхів вирішення завдання.

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

Використання альтернативних технологій.

Програмну реалізацію веб додатку було вирішено розробити трьома компонентами, а саме:

-PHP;

-Java Scrip;,

-AJAX.

Використання мови програмування php було зумовлене простотою та зручністю для програміста що дало можливість оцінити її як основний варіант для програмної розробки. Альтернативним шляхом вирішення може слугувати мова програмування Perl. Використовується як мова загального призначення для створення як веб додатків так і програмного забезпечення різного рівня складності. Perl запозичує можливості з багатьох інших мов програмування, як то C, shell scripting, AWK та sed.^] Мова надає потужні можливості для обробки тексту без довільних обмежень на довжину даних багатьох сучасних інструментів Unix, полегшуючи процес маніпуляції текстових файлів. Використовується для програмування графіки, системного адміністрування, у мережному програмуванні, у написанні програмного забезпечення, яке взаємодіє з базами даних, у програмуванні CGI для веб.

Отже доцільним альтернативним рішення програмного рівня буде використання мови perl що підтримує усі потрібні можливості для побудови веб додатку.

Для створення динаміки інтерфейсу користувача було прийнято рішення використання мови сценаріїв, що виконується на клієнтській машині, а сааме java script. Альтернативним рішенням щодо використання java script буде Rhino. Rhino -- рушій JavaScript з відкритим сирцевим кодом. Він написаний повністю на Java та підтримується Mozilla Foundation. Mozilla Foundation також підтримує іншу реалізацію рушія JavaScript, написану на C SpiderMonkey.

Rhino перетворює JavaScript скрипти в Java класи. Rhino працює і у компільованому,та інтерпретованих режимах. Він призначений для використання у веб застосунках на серверному боці, тому в ньому немає вбудованої підтримки для об'єктів браузера, які зазвичай асоціюються з JavaScript.

Rhino може використовуватися як зневаджувач при використанні Rhino Shell. Він також може використовуватися в застосунках при вбудовуванні Rhino. Використання ajax є основною метою проектної розробки нашого завдання дипломного проектування. Для використання цієї технології було об'єднання трьох суміжних ттехнології, а саме:

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

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

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

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

Щодо використання альтернативної заміни ajax тут можливо спроектувати використання концепції несинхронної обробки даних. Тобто по суті без фонового режиму роботи веб додатку.Ajax сам по собі існує як суміжність технології тому окремої заміни його в націоналі не існує. Для імітуваня принципу ajax можливе створення динамічного підвантаження коду JavaScript в тег <SCRIPT> з використанням DOM, що здійснюється із використанням формату JSON).[14]

3.5 Готові альтернативні рішення

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

· phpBB Simple Chat v2.1

· Universal ajax chat

· SmZchat vioo

Вищенаведі варіанти відрізняються від проектованого вданому дипломному проекі, прото його алгоритми роботи та структуру роботи можливо використати для власного проектування.

Отже враховуючи проведі всі вище системні аналізи та проектні дослідження можемо побудувати відобразити концептуальну модель розвязку завдання. Дерево проблем у нашому випадку буде складатись із трьох гілок ,а с аме:

· дерево цілей.

· дерево завдань.

· дерево альтернативних рішень.

3.6 Прийняття рішення системного аналізу

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

Технології програмування додатку.

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

Алгоритм роботи додатку.

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

Використання системи збереження даних.

Всі дані що приймають обіг у ситемі мають бути збережені у надійній базі даних. Як дані особистих профілів користувачів так і всі повідомлення що користувачі відправляли та отримували під час роботи веб додатку мають бути збережені у відповідній базі даних.Таким рішенням є база даних MySQL. Це база даних реляційного типу,що повністю відповідає птребам проектно розробки додатку. Доступність використання та простота використання бази даних mysql а программному рівні створює зручний спосіб її використання.

Висновок

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

4. КОНЦКПТУАЛЬНА МОДЕЛЬ

Даний розділ буде роглядати основні теоретичні шляхи вирішення проблеми дипломного проектування. Буде розглянуто концепрутальний алгоритм роботи додатку та його всі основні функціональні можливості,побудова діаграм uml для характеристики роботи додатку а також розглянуто спосіб інтеграції ajax технології та всі її особливості на програмному рівні веб додатку.

Концептуальний алгоритм роботи веб додатку.

Малюнок 4. Концептуальний алгоритм роботи веб додатку



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

Даний алгоритм роботи є класичним при створені веб додатків такого типу.

Концептуальні особливості ajax.

Програмна реалізація нашого веб додатку, що проектується, в основному залежить від інтеграції ajax технології. Основний підхід в цьому полягає що всі дані які потрібні користувачі будуть автоматично оновлюватись та синхронізуватись із роботою веб додатку.Користувач не повинен самостійно оновлювати дані які йому надсилаються у відповідь його запитів, все це буде виконувати ajax технологія. В цьому розділі буде доцільно розглянути ajax підхід та основні його особливості роботи для нашого веб додатку. Як говорилось раніше, ajax -- не самостоятельная технология, а концепция использования нескольких смежных технологий. AJAX базируется на двох основних принципах:

· Використання технології динамічного звернення до веб сервера на “льоту” без перевантаження всіє веб сторінки, наприклад :

· З використання XMLHttpRequest (основний обєкт);

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

· через динамічне створення тега <script>;

· Через динамічне створеня тега <img>, як це зреалізовано google analytics.

· Використання DHTML для динамічного методу оновлення веб сторінки.

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

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

Структура інтерфейсу веб сторінок нашого додатку буде побудована за принципом об'єктної моделі документа DOM. Все цестврюється для того, аби надати можливість комп'ютерній програмі доступу та динамічної модифікації структури, змісту та оформлення документа. Тобто структура нашої веб сторінки буде представлена у вигляді дерева DOM, де кожний елемент представляє собою окремий блок який може динамічно оновлюватись та змінювати свою структуру. Це досягається мовою гіпертекстової розмітки HTML а також каскадними таблицями стилів CSS. В єдності ajax та Document Object Model, створюють можливість динамічного методу оновлення контенту веб сторінок нашого веб додатку.

4.1 Модель роботи веб додатку на ajax

Робота веб додатку на основі моделі аjax буде складатись із таких частин:

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

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

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

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



передача даних

http

Передача

опрацьованих

даних від сервера

Малюнок 4.1. Робота додатку з використанням ajax.

Отже, як бачимо всі запити користувача спершу опрацьовуються через javascript обробник а потім уже надсилаються методом http у подальше опрацювання. Дані приходять та оновлюються у моделі DOM, що дає можливість бачити прихід інформації лише у тbх частинах веб сайту де це потрібно. Запит від користувачів проходить на веб сервер безпосередньо через ajax обробник, та далі передаються за сценарієм на відповідний порт веб сервера. Потрібно зауважити що DOM модель повністю спроектована на html розмітці та css стилях.

4.2 Використання бази даних

Для оперування всіма даними користувачів буде використано реляційну базу даних MySql. Збереження даних буде відбуватись у таблицях, тобто матрицях, де є рядки і стовпці. Дані будуть зберігатись у двох таблицях. Таблиця user буде відповідати за збереження даних про всіх користувачів у системі, тобто їх статуси у системі, аутенфікатори. За усі повідомлення, що є у системі обміну повідомленнями, буде відповідати таблиця message. Між цими двома таблицями буде існувати реляційний зв'язок, тобто дані із однієї таблиці відносяться до даних іншої таблиці. Зв'язок буде використовуватись по ідентифікаторах користувачів. Кожний користувач у таблиці буде мати свій власний ідентифікатор, який використовується для ідентифікації користувача у процесі роботи додатку. Після того як користувач зареєструвався у системі всі його дані ідентифікуються під окремим ідентифікатором користувача. При відправці повідомлення між користувачами створюється система обміну інформації , тобто всі повідомлення зберігаються за окремим ідентифікаторами у таблиці message.

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

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

4.3 Використання мови html

HTML (англ. HyperText Markup Language -- Мова розмітки гіпертексту) -- стандартна мова розмітки веб-сторінок в Інтернеті. Більшість веб-сторінокстворюються за допомогою мови HTML (або XHTML). Документ HTML оброблюється браузером та відтворюється на екрані у звичному для людини вигляді.[15]

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

Загальна структура веб сторінки.

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

Побудова веб сторінки буде складатись із таких частин:

1. Декларація типу документу (англ. Document type declaration, Doctype), на початку документа, в якій визначається тип документа (DTD).

2. Шапка документу (знаходиться в межах елементу head), в якій записано загальні технічні відомості або додаткова інформація про документ, яка не відтворюється безпосередньо вбраузері;

3. Тіло документу (може знаходитися в елементах body або frameset), в якому міститься основна інформація документа.

Отже загальна структура веб сторінки буде складатись із декларації ,шапки документу та тіла документа.

4.4 Використання php

Програмування веб додатку безпосередньо буде реалізовано мовою php. Як говорилось раніше , мова програмування php,є основним засобом створення динамічних веб сторінок.

Основні функціональні частини веб додатку :

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

· Авторизація користувачів;

· Підтримка сесій користувача;

· Розлогінення користувача;

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

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

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

· Індикатор повідомлень;

· Індикатор стану користувача.

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

4.5 Використання javascript

Для використання технології ajax у нашому веб додатку використано фреймворк jquery. Jquery сгулує хорошою бібліотекою java script яка даэ змогу кросплатформенно організувати використання технології ajax.

Технологія ajax буде використовуватись у таких частинах роботи веб додатку:

-Індикатор повідомлень;

-Індикатор користувача;

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

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

-Редагування повідомлень.

Будуть використовуватись синхронні запити до веб сервера і у відповідь буде оновлюватись контент веб сторінки у автономному режимі без перевантаження веб сторінки. Індикатор повідомлень буде автоматично оновлюватись у поєднанні використання javascript та jquery, тобто будуть робитися проміжкові запити до сервера за наявністю нових даних щодо статусу користувача у системі. Статус користувача буде online або offline. Тобто користувач що зареєструвався або авторизувався у системі має статус online , а користувач, який не зареєструвався або не авторизувався у системі має статус offline. Індикатор повідомлень є числове значення кількості приходу нових повідомлень для користувача що є у системі. Видалення, редагування та відправка повідомлень відбувається у синхронному режим роботи користувача та веб додатку, тобто користувач може видаляит повідомлення і в той же час буде прихід нового повідомлення без перевантаження веб сторінки. Всі ці запити будуть безпосередньо звертатись до бази даних за даними які розміщені у таблицях, пізніше із бази даних вони будуть оновлюватись вже на контенті веб сторінки.

4.6 Побудова діаграми сценаріїв користування(use case діаграма)

Для наглядної роботи функціонування веб додатку розглянемо нотацію uml діаграми сценаріїв користування. Для наглядності роботи системи відобразимо відношення прецендентів та акторів що будуть конфігурувати на цьому етапі концептуальної моделі. Малюнок 4.6 нижче показує спрощену модель роботи веб додатку.[17]

Малюнок 4.6 Спрощена модель роботи додатку на основі діаграми uml.

Висновок

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



5. ОБГРУНТУВАННЯ АПАРАТНИХ РІШЕНЬ

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

5.1 Формулювання вимог апаратного рішення

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

Для функціонування веб додатку потрібен повноцінний веб сервер. Веб-семрвер (англ. Web Server) - це сервер, що приймає HTTP-запити від клієнтів, зазвичай веб-браузерів, видає їм HTTP-відповіді, зазвичай разом з HTML-сторінкою, зображенням, файлом, медіа-потоком або іншими даними. Веб-сервер -- основа Всесвітньої павутини.[18] Веб-сервером називають як програмне забезпечення, що виконує функції веб-сервера, так і комп'ютер, на якому це програмне забезпечення працює. Веб сервер містить в собі встаовлене програмне забезпечення яке відповідає за роботу як протоколів зєднання так і самого функціонування веб додатку. Наш веб додаток буде функціонувати безпосередньо лише у середовищі веб сервера. Компютер сервер повинен містити в собі безліч налаштувань та підключених програмних засобів що забезпечують роботу веб сайтів. Оскільки наш веб додаток призначений для роботи у мережі інтернет , тому серверні програми будуть вимагати чималих апаратних ресурсів.

5.2 Оцінка програмного забезпеченя веб сервера

Для функціонування роботи веб додатку потрібне програмне забезпечення яке керує його роботою та дозволяє підєднюватись безпосередньо портативно або стаціонарно до веб ресурсу. Робота нашого веб додатку, як було сказано раніше, полягає у веденні переписки між користувачами що є у системі, тобто існує середовище обміну інформацією. Це відповідно вимагає середовища збереження даних. Функціонал роботи додатку створений мовою програмування php що безпосередньо вимагає інтерпретатора коду. Все це оперується та керується веб сервером та серверною операційною системою про що буде детально сказано нижче.

Для оперування роботою веб сервера,тобто комп'ютера віддаленого доступу, потрібний веб сервер. Найпоширенішим веб сервером сьогодення є Apache. Apache - відкритий веб-сервер Інтернет для UNIX-подібних, Microsoft Windows, Novell NetWare та інших операційних систем. Apache передусім використовується для передачі через HTTP статичних та динамічних веб-сторінок у всесвітній павутині. Багато веб-застосунків спроектовано, зважаючи на середовище і можливості, які надає цей веб-сервер. У нашому випадку буде використовуватись веб сервер apache версії 2.2.14.

Інтерпретатор мови програмування є обов'язковою складовою практично будь якого потужного та сучасного веб сервера. У нашому випадку для програмування веб додатку використовувалась мова програмування php версії 5.3.27. Тому для інтерпретації коду цієї мови програмування веб сервер повинен містити підключений та налаштований php.

Робота веб додатку неможлива без використання бази даних. Щоб мати можливість збереження даних та їх оперування потрібно щоб веб сервер мав можливість підтримки сервера бази даних. Найпоширенішим рішення щодо використання веб бази даних є MySql веб сервер бази даних.У нашому випадку буде використано MySql сервер версії 5.2.9.

Також функціонування веб сервера залежить від використання операційної серверної системи. Найчастішим випадком є операційна система сімейства unix це ubuntu або freebsd. У нашому випадку я обрав веб сервер що керується операційною системою freebsd версії 9.

Отже для повноцінного функціонування веб додатку потрібний веб сервер із наступними програмними характеристиками.

1. Операційна система freebsd версії 9.

2. Веб сервер apache версії 2.2.14

3. PHP інтерпретатор версії 5.3.27

4. Веб сервер баз даних MySql версії 5.2.9

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

5.3 Швидкодія веб ужитку

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

5.4 Спосіб використання

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

Невідмовність системи.

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

5.5 Характеристики апаратних рішень

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

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

Швидкість передачі передачі даних.

Сервер повинен підтримувати скоріть передачі даних 1000 мб/с. Всі сучасні веб сервери слугують цілому стандарту. Пропускна здатність трафіку визначає можливість навантаження роботи нашого веб додатку.

Обєм оперативної памяті(ОЗП).

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

Процесор.

Використання процесора відіграє чи не найважливішу роль при формуванні апаратних характеристик комп'ютера. Для повноцінного функціонування ею додатку та веб сервера потрібно щонайменше двох ядерний процесор , з можливістю розпаралелення потоків даних, що забезпечує подвійну швидкодію роботи системи. У нашому випадку доцільно обрати процесор марки intel тому, що ці процесори є найадаптивнішими для використання їх у веб серверній машині. Частота процесора не повинна розходить у межах 2 гігарегц. Такий процесор буде повністю задовольняти всі умови роботи машини сервера.

Жорсткий диск.

Жорсткий диск являє собою контейнер збереження всіх даних які потрібні для функціонування роботи веб сервера. Веб сервери зараз оснащуються RAID масивами. RAID (англ. redundant array of independent/inexpensive disks) надлишковий масив незалежних/недорогих дисків для комп'ютера. Дисковий масив -- це набір дискових пристроїв, що працюють разом, щоб підвищити швидкість і надійність системи вводу/виводу. Цим набором пристроїв керує спеціальний RAID-контролер (контролер масиву), який забезпечує функції розміщення даних по масиву; а для решти всієї системи дозволяє представляти весь масив як один логічний пристрій вводу/виводу. За рахунок паралельного виконання операцій читання і запису на кількох дисках, массив забезпечує підвищену швидкість обмінів в порівнянні з одним великим диском.

Для функціонування роботи веб додатку достаньо буде 50 мегабайт дискового простору. Це стосовно роботи додатку на звичайній основі без інтеграції його у веб сайт чи інший ресурс. Але для роботи веб додатку на сучасних веб серверах рекомендується обрати сучасні найшвидкісніші накопичувачі даних.

5.6 Доцільний варіант апаратного забезпечення

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

· Процесор - Intel Xeon Quad-Core E3-1225 v2 (3.2 ГГц);

· Обєм оперативної памяті - 4 ГБ;

· Тип оперативної памяті - DDR3 ECC 1600 МГц;

· Жорсткий диск - 2 х 500 ГБ SATAII RaidEdititon;

· Материнська плата - SuperMicro X7DAE (RTL) Dual LGA771< i5000X> ;PCI-E+2xGbL 3PCI-X SATA RAID E-ATX 8DDR-II FBDIMM< PC2-5300>;

· Блок живлення - Seasonic SS-300TFX 300W.

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



6. ДЕТАЛІЗАЦІЯТЕХНІЧНОГО РІШЕННЯ

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

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

6.1 Структура роботи веб ужитку

Розглянемо взаєморозміщення та певний взаємозв'язок складових частин цілого проекту. Як було наведено раніше структура роботи веб додатку складається із таких частин:

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

· Авторизація користувачів;

· Підтримка сесій користувача;

· Розлогінення користувача;

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

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

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

· Індикатор повідомлень;

· Індикатор стану користувача.

Для вирішення проблеми програмування всіх структурних частин веб додатку потрібно встанови взаємозв'язок між ними. В першу чергу взаємозв'язок відображається між такими складовими часинами:

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

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

2.Підтримка сесії користувача та розлогінення.

Після того як користувач зареємтрувавя у ситемі чи авторизувався йому надається певний зв'язок із веб сайтом.Цей зв'язок будується за допомогою сесії користувча. Сесія користувача та розлогіненя існують як дві складові частини за рахунок спільної роботи іх функцій. Коритсувач може у будь який момент роботи розірвати зв'язок із вебсайтом, тобто перервати виконання сесії користувача.[22]

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

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

4.Індикатор повідомлень та індикатор стану кортсувачів.

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

Отже після розглядання структури роботи веб додатку на функціональному рівні відбулося спрощення взаємозв'язку всіх часник роботи системи.



6.2 Програмна реалізація веб ужитку

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