Розробка веб-ресурсу з використанням технології асинхронного обміну даних (AJAX)

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

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

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

Програмна реалізація веб додатку буде здійснюватись такими технологічними засобами:

· Php

· JavaScript

· Html

· Jquery(бібліотека javascript)

· css

6.2.1 Побудова структури файлів

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



Малюнок 6.1 Структура файлів веб додатку

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

Уся javascript-програмна реалізація буде зберігатись у папці “javascript”. В цій папці будуть зберігатись файли javascript, які будуть використовуватись для підключення на веб сторінках.

Папка із назвою “jquery” буде містити в собі фреймворки ля роботи з Аjax. Файл add_user.php буде відповідати за реєстрацію нового користувача у системі а також за валідність введених даних користувача при реєстрації. Файл data_vaid.php буде містити в собі запрограмовані функції, які відповідають за приключення о бази даних, авторизацію користувача, реєстрацію, повірки сесії користувача, виводу повідомлень а також збереження повідомлень користувача у базі даних. Для видалення повідомлень користувача буде відповідати програмний код збережений у файлі delete.php. Файл який підключає інші функціональні частини веб-додатку має назву function.php. Запуск роботи веб додатку буде розпочинатись із файлу login.php, який дає можливість користувачеві авторизуватись або зареєструватись у системі. Для розлогінення у системі буде використовуватись файл logout.php, який дозволить кожному користувачеві здійснити вихід із свого профілю. Головна сторінка на якій буде знаходитись користувач під час роботи із веб додатком буде генеруватись файлом member.php, який дає можливість здійснювати обмін повідомлення між користувачами та повірку валідності даних користувача при вході. Файл member.php об'єднує в собі весь головний функціонал про роботі із веб додатком а саме обмін даними між користувачами, статуси повідомлень та користувачів у системі, кімнати спілкування та діалоги. Файл message.php відповідає за відображення всіх повідомлень які є для користувача а також відображає всіх користувачів у системі. Виводить із бази даних всі повідомлення ля користувачів файл message_user.php. За побудову веб сторінки що відображається у веб браузері користувача відповідає файл output.php, він містить готові функції виводу форм реєстрації користувача а також вивід системної інформації веб сторінки. За реєстрацію нового користувача у системі відповідає файл register_new.php, він аж можливість зробити запис про нового користувача у базу даних. Відправка повідомлень виконується програмним файлом send.php. Запис повідомлення користувача у базу даних здійснюється за допомогою файлу send_mes.php. Стилізація веб сторінки збережена у файлі stye1.css.Файли test.php та test_db.php використовуються для тестової повірки підключення до бази даних. Для показу всіх авторизованих або зареєстрованих користувачів веб сайту використовується файл update.php.

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

6.2.2 Структура таблиць бази даних

Оскільки у нашій системі будуть мати місце як користувачі так ї їх персональну інформацію доцільно буде спроектувати два масиву для збереження інформації. Назва бази даних буде мати ім'я Exchange. База даних буде мати 2 масиви, тобто таблиці, для збереження інформації,це таблиця message та register. Таблиця message буде відповідати за інформацію всі повідомлення користувачів а таблиця register за профільну частину користувача.

Таблиця 6.1 Структура таблиці message бази даних Mysql.

Назва поля	Тип даних	Розмір	Не пусте	Автоінкремент/ Інше значення
id	int	5	not null	auto_increment
to_mes	Int	5	Not null	-
From_mes	Int	5	Not null	-
text	Varchar	50	Not null	-
Status	int	2	Not null	-
data	Varcahr	50	null	Default null
Delete_to	int	10	Not null	-
Delete_from	int	10	Not null	-
Primary_key(id)

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

Поле “id” використовується індексації полів даних, тобто кожне повідомлення буде мати свій унікальний індекс. Цей індекс використовується для ідентифікації повідомлення у базі даних а також для звернення до цього повідомлення за його ідентифікатором. Це поле є унікальне і воно не може повторятись у таблиці. Максимальний розмір цього поля 5 знаків цілого тип, тобто на мові mysql це тип даних int.

Поле `to_mes' відповідає за збереження ідентифікатора користувача який надіслав повідомлення іншому користувачу. Тип даних цього поля `int' яке може містити 5знаків тобто п'ятизначне число. До цього поля звертаються за ідентифікатором користувача який надсилає повідомлення. Це поле не може бути пустим,тобто не може бути `null'.

Поле `from_mess' відповідає за збереження ідентифікатора користувача якому адресоване повідомлення іншому користувачу. Тип даних цього поля `int' яке може містити 5знаків тобто п'ятизначне число. До цього поля звертаються за ідентифікатором користувача якому надсилається повідомлення. Це поле не може бути пустим, тобто `null'.

Поле `text' буде містити текст самого повідомлення, яке користувач надсилає іншому користувачу. Це поле має тип даних `varchar' також воно не може бути пустим. Максимальний розмір цього поля 50 знаків,тобто повідомлення може складатись із 50-ти символів.

Поле `status' відповідає за статус повідомлення, тобто коли повідомлення було прочитано користувачем воно ставить статус прочитаного 1 а якщо повідомлення не було прочитано то його статус залишається 0. Це поле має тип даних `int' а також не може мати нульового значення,тобто воно є обов'язковим для використання у системі.

Поле `data' відповідає за дату повідомлення яке надсилається. Це поле є обов'язкове його тип даних є `varchar'. Поле по замовчуванню може бути пустим, тобто мати значення `null' а також має значення `default null' що означає початкове значення поля заповнюється датою коли було записано повідомлення.

Поле `delete_to' відповідає за видалення повідомлення користувача який видалив повідомлення першим, тобто повідомлення видаляється лише від того користувача який його видалив а у іншого користувача якому повідомлення адресувалось воно залишається. Поле буде містити ідентифікатор користувача який видаляє повідомлення першим. Це принцип використовується у всіх соціальних мережах та чатах. Тип даних цього поля `int' і це поле може містити максимум 10 знаків, тобто десятизначне число. Це поле не може бути обов'язковим.

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

Структура таблиці register бази даних Mysql.

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

Таблиця 6.2 Структура таблиці register бази даних Mysql.

Назва поля	Тип даних	Розмір	Не пусте	Автоінкремент/ Інше значення
id	int	5	not null	auto_increment
username	varchar	40	Not null	-
pasword	varchar	40	Not null	-
statys	int	5	Not null	-
Primary_key(id)

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

Поле `username' слугує для запису імені користувача що реєструється або авторизується у системі. Це поле має тип даних `varchar', тобто стрічковий тип даних із довжиною у 40 символів. Також це моле не може бути пустим.

Поле `password' слугує для збереження паролю користувача у системі. Тип даних `varchar' із довжиною у 40 символів. Поле не може бути пустим.

Для видання статусу користувачеві існує поле `statys'. У цьому полі зберігається статус користувача, тобто 1 коли користувач перебуває на веб сайті та 0 коли користувача немає на веб сайті.

База даних буде мати кодування типу `utf-8' яке є міжнародним стандартом який підтримують всі сучасні веб системи. UTF-8 (від англ. Unicode Transformation Format - формат перетворення Юнікоду) - кодування, що реалізовує представлення Юнікоду, сумісне з 8-бітовим кодуванням тексту. Бази даних такого формату кодування є сумісними у всі веб серверних базах даних.

6.2.3 Створення таблиць бази даних

Код створення таблиць бази даних продемонстровано в лістингу в додатку.

6.2.4 Програмування головного виконавчого файлу

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

<?

require_once('function.php');

do_html_header();

login_form();

do_html_footer();

?>

Отже як бачимо файл просто підключає головний функціональний файл веб додатку function.php а також формує заголовок за допомогою функції do_html_header та нижню частину веб сторінки за допомогою функції do_html_footer. У цьому файлі є вивід авторизації та реєстрації користувача за допомогою функції login_form.

6.2.5 Програмування авторизації користувачів

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

Алгоритм роботи авторизації користувача.

1.Введення користувацьких особистих даних, тобто логін та пароль.

2. Перевірка валідності введених даних користувача, тобто чи заповнені всі поля для вводу.

3.Перевірка існування користувача у базі даних та відповідність введених даних авторизації.(Розгалужена гілка алгоритму.)

4.Вхід у особистий профіль користувача.

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



Малюнок 6.2 Блок схема роботи авторизації користувача.

Програмний код авторизації користувача.

Авторизація користувача вимагається першочергово після запуску веб додатку. Стартовий файл роботи веб додатку login.php. Авторизація користувача розпочинається із роботи функції login_form(). Ця функція виводить поля які потрібно заповнити користувачеві для входу у його власний профіль. Файл login.php Користувач вводить пароль та логін який він при реєстрації вказував і ця інформація вважається конфіденціальною. Нижче наведений приклад коду функції login_form().

function login_form()

{

?>

<a href='register_new.php'>Не зареєстровані-??</a>

<form action="member.php" method='post'>

<p>Name:</p><input type='text' name='username'>

<p>Password:</p><input type='pasword' name='password'>

<input type='submit' value='Увійти' >

</form>

<?}

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

6.2.6 Програмування реєстрації користувачів

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

Алгоритм роботи реєстрації користувача.

1.Ввід особистих даних користувача, тобто логіну та паролю.

2.Перевірка валідності даних, тобто перевірка вводу логіна та паролю на присутність.

3.Перевірка введених даних на присутність у базі даних(розгалужена гілка).

4.Збереження даних користувача у базі даних.

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

Алгоритм роботи користувача продемонстрований на прикладі блок схеми. Нижче на малюнку 6.3 наведена блок схема реєстрації нового користувача у базі даних.

Малюнок 6.3 Блок схема реєстрації нового користувача у базі даних.

Програмний код реєстрації користувача.

Зареєструватись у системі дає можливість функція login_form(). Ця функція виконується при запуску веб додатку. Функція відображає форму авторизації та посилання на реєстрацію користувача:

<a href='register_new.php'>Не зареєстровані-??</a>

Файл register_new.php,на який посилається гіпертекст, дає можливість зареєструватись у системі.

<?

require_once('function.php');

do_html_header();

?>

<h1>Реєстрація нового користувача.h1>

<?

display_registration_form();

do_html_footer();

?>

Файл register_new.php містить у собі функцію display_registration_form, що відповідає за вивід діалогу реєстрації нового користувача а також стандартний опис структури веб сторінки що був розглянутий у попередньому розділі. Також відбувається підключення головного функціонального файлу веб додатку це function.php. Програмний код функції display_registration_form відсилає всі дані, які користувач заповнив у полях вводу, у файл add_user.php. Програмний код файлу add_user.php продемонстрований у лістингу додатку.

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

function register($name,$password){db_connect();

mysql_select_db("user");

$zaput="select * from register where username='$name' " ;

$result=mysql_query($zaput);

if(mysql_num_rows($result)>0){echo "Таке імя вже існує в базі даних ";exit; }

$zaput="insert into register (username,password,status) values('".$name."','".$password."','0')";

$result=mysql_query($zaput);

if(!$result){echo"Помилка запису даних";}

}

асинхронний обмін інтернет повідомлення

6.2.7 Програмування профільної частини користувача

Програмування профільної частини користувача буде здійснюватись на основі Аjax-технології. Для впровадження Аjax-технології буде використовуватись фреймворк jquery. Це дуже зручний фреймворк,який дозволяє використовувати всю потужність javascript для роботи із Аjax-технологією.

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

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

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

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

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

- Розлогування.

1. Програмування функціоналу відправки повідомлень.

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



Малюнок 6.4 Блок схема роботи функціоналу відправки повідомлення.

Програмний код функціоналу відправки повідомлень.

Відправка повідомлень здійснюється безпосередньо після реєстрації або авторизації користувача у системі. За обмін повідомлення між користувачами відповідає файл send.php. При відправці повідомлення спрацьовує javacript код у файлі output.js що знаходиться у папці javascript файлової структури веб проекту. Даний код наведений у лістингу додатку.

Відправка повідомлення розпочинається у випадку коли користувач натиснув кнопку “Відправити”, але перед відправкою відбувається повірка поля вводу повідомлення на непусте значення. Якщо повідомлення не було введене проте користувач намагається його відправити виникне помилка. Далі спрацьовує подія яка запрограмована javascript фреймворком jquery. Ця подія записується наступним чином $("#send_to").click(function(){}. Тобто спрацьовує подія при натисканні користувача на певні елемент веб сторінки. У нашому випадку це елемент “send_to” які ідентифікує кнопку відправки повідомлення. Подія викликає функцію відправки повідомлення sendMess., функція використовує асинхронний запит та відправляє дані на сервер у фоновому режимі, тобто не відбувається перевантаження веб сторінки як при класичній моделі. Функція sendMess має у собі використання Аjax функції `$.post()'. Функція `$.post()' надсилає введене повідомлення для обробки на сервер у файл send_mes.php. Цей файл відповідає за збереження повідомлення користувача у базі даних. Зміст файлу send_mess.php наведений у лістингу.

Отже файл send_mess.php використовує функції php для збереження нового повідомлення користувача у базі даних. Збереження повідомлення у базі даних виконується за допомогоб функції send_mess що э запрограмована у файлі send_mess.php. Цій функції передається у параметри текст повідомлення адресат та відправник. Дані вся ця інформація передається у базу даних де безпосередньо зберігається як масив даних користувача.

2. Програмування функціоналу видалення повідомлень.

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

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

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

$(document).ready(function(){

$(".delete").click(function(){

var id=$(this).parent().find(".id_message").text();

var delete_from=$("#delete_from").text();

$.post("delete.php",{id:id,delete_from:delete_from});});

Малюнок 6.5 Блок схема функціоналу видалення повідомлень користувачів.

Отже для виділення повідомлення використовується подія яка реагує на елемент веб сторінки який має ідентифікатор delete. Видалення відбувається за допомогою Аjax технології. Ajax функція $.post() відправляє асинхронно дані у файл delete.php. Цей файл видаляє повідомлення конкретного користувача за його ідентифікатором.

3. Програмування функціоналу редагування повідомлень

Редагування повідомлень відбувається шляхом перезапису існуючого повідомлення на оновлене. За оновлення повідомлення відповідає файл user_message.js. Коли користувач нажимає на кнопку “Редагувати” викликається подія із фалу user_mesage.js яка має назву rewrie. Повідомлення яке було обране для редагування переміщається у пол. Вводу повідомлень і далі користувач вже відправляє нове повідомлення на місце старого. Повідомлення яке було редаговане замінюється на нову у базі даних під тим самим ідентифікатором. Функція редагування повідомлень наглядно розглянута нижче.

$(".rewrite").live('click',function(){

var text=$(this).parent().find(".rewrite_2").text();

var id=$(this).parent().find(".id_message").text();

$("#text").text(text);$("#id_rewrite_message").text(id);});

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

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

Статус користувачів та повідомлень зберігається у базі даних. Кожний статус являє собою цифрове значення яке має певне значення. Користувач буде мати статус “on-line” якщо у базі даних у полі statys стоїть 1 і навпаки якщо 0 тоді статус “of-line”.

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



Малюнок 6.6 Блок схема функціоналу оновлення статусу користувача.

Отже якщо користувач авторизувався або зареєструвався у системі його статус у базі даних змінюється на 1 а в іншому випадку залишається по замовчуванню 0. За вивід статусу користувача відповідає файл output.js що знаходить у папці javascript. У даному файлі існує функція setinterval, яка дає змогу робити проміжкові за часом запити до вб сервера. У нашому випадку функція оновлює статус користувачів кожні 3секунди, тобто робить синхронний запит і повертає результат. Нижче представлений код функції для оновлення статусу користувачів.

setInterval('$("#vsi_korustuvachi").load("update.php",{user1:$("#user1").text()});',3000);

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

<?

require_once('function.php');

echo "Всі користувачі:";echo"<br>";?><META http-equiv=Content-Type content="text/html; charset=utf-8 "><?

$user=$_POST['user1'];

output_users_to_messages($user);?>

Файл update.php має в собі запрограмовану функцію output_user_to_messages. Дана функція робить звернення до бази даних та повертає вивід всіх користувачів у веб сайті. У лістингу 6.2.7.4 додатку 1, наглядно розглянуто код функції output_user_to_messages.

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

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

Функція оновлення індикаторів повідомлень слугує output _user_to_messages. Ця функція одночасно використовується для оновлення індикаторів повідомлень та статусу користувача. Код цієї функції що стосується оновлення індикаторів стану повідомлень наведений нижче.

if($row['status']==1){

?><font color=blue>

<?echo "Online ";?></font><?}else{echo "Ofline ";}

echo"<a href='send.php?to=".$row["id"]."'>".$row['username']."</a>";



Малюнок 6.7 Блок схем функціонування зміни індикатора повідомлення.

5 Програмування функціоналу розлогінення користувачів.

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

<?require_once('function.php');

session_start();@$username=$_SESSION['valid_user'];

unset($_SESSION['valid_user']);

$result=session_destroy();$status=0;status_user($status,$username);

do_html_header();echo "Ви успішно вийшли із системи.";

do_html_url('login.php','Ви можете знову увійти до системи.');

do_html_footer();?>

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

6.3 Оцінка працездатності

Перевірка працездатності програми полягає в основному у тестуванні всіх функціональних частин та системи в цілому. У нашому випадку тестування програми є доцільним у наступному:

- Тестування з'єднання із базою даних

- Тестування працездатності технології Аjax

- Робота сесії користувача.

- Тестування роботи таблиць бази даних.

- Тестування кросплатформенності веб додатку.

Тестування з'єднання із базою даних.

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

Тестування працездатності технології Аjax.

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

Робота сесії користувача.

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

Тестування роботи таблиць бази даних.

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

Тестування кросплатформенності ужитку.

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

7. ЕКОНОМІЧНА ЧАСТИНА

Темою мого дипломного проектування було створення системи обміну інформації на основі Аjax технології. У даному дипломному проекті буде докладно розглянуто та продемонстровано технологію AJAX на основі інформаційної системи обміну даних. Мною буде створено веб ресурс, який надає можливість обімну повідомлення між користувачами, які зареєстровані або аутентифіковані у системі, завдяки технології асинхронного обімну даних(AJAX), що дозволить відправляти, редагувати та видаляти повідомлення у асинхронному вигляді без пере загрузки сторінки. Користувач, перебуваючи на веб сторінці, буде продовжувати свою роботу в той час як запити будуть поступати на сервер без перезавантаження веб сторінки, яка відкрита у вікні браузера користувача в даний момент Оскільки дана тема на сьогоднішній день є актуальною та сучасною, підхід до створення економічної частини був спрямований на обрахунок впровадження інноваційних рішень та розробку проектного рішення з точки зору використання сучасних технологій. Проектований у даному дипломному програмний продукт повинен мати інноваційний ступінь розроблених рішень щодо розв'язку поставленого завдання. Суть проектування полягає у створенні програмного додатку що дає змогу обмінюватись інформацією між користувачами у веб системах та адаптуватись під розробку проектів де є необхідність використання систем обміну інформацією. Використання технології Аjax дасть змогу покращити обмін інформацією та зробити інноваційний підхід до створення веб ресурсу.

7.1 Розрахунок витрат на розробку та впровадження проектного рішення

1. Витрати на розробку і впровадження програмного засобу (К) визначаються як:

К = К₁+К₂ (1)

де К₁ - витрати на розробку програмного засобу, грн.; К₂ - витрати на відлагодження і дослідну експлуатацію програмного засобу на ЕОМ, грн.

Витрати на розробку програмного засобу включають в себе:

витрати на оплату праці розробників (В_ОП);

відрахування у спеціальні державні фонди (В_Ф);

вартість додаткових виробів, що закуповуються (В_Д);

транспортно-заготівельні витрати (Т_В);

витрати на придбання спецобладнання (В_СО);

накладні витрати (Н_В);

інші витрати (І_В).

Для проведення розрахунків витрат на оплату праці необхідно визначити категорії працівників, які приймають участь в процесі проектування, їх чисельність, середньоденну заробітну плату спеціаліста відповідної категорії та трудомісткість робіт у людино-днях (людино-годинах).

У проекті бере участь 4 осіб: керівник проекту, двоє інженерів-програмістів та консультант з економіки. Їх заробітна плата становить:

- керівник проекту - 2500 грн.;

- інженер-програміст - 2900 грн.;

- консультант з економіки - 2000 грн.;

Трудомісткість робіт над проектом становить: 20 людино-днів для керівника проекту, 80 людино-днів для інженера-програміста та 2 людино-дні для консультанта.

Середньоденна заробітна плата і-го розробника (ЗП_Ді) обчислюється за формулою:

(2)

де ЗП_і - основна місячна заробітна плата розробника і-ої спеціальності, грн.; Фм - місячний фонд робочого часу, днів (24 дні).

Розрахунок витрат на оплату праці усіх розробників проекту обчислюємо за формулою:

(3)

де n_i - чисельність розробників проекту і-ої спеціальності, чол.; t_i - час, витрачений на розробку проекту працівником і-ої спеціальності, дні; ЗП_Ді- денна заробітна плата розробника і-ої спеціальності, грн.;

Робота проводилась 4 спеціалістами, які витратили різну кількість днів на розробку системи, що наведені в табл. 7.1.

Розрахунок витрат на оплату праці розробників зводиться у таблиці 7.1.

Таблиця 7.1 Розрахунок витрат на оплату праці

№	Спеціальність розробника	Кількість розробників, чол.	Час роботи, дні	Денна заробітна плата розробника, грн.	Витрати на оплату праці, грн.
1	Керівник проекту	1	20	104,17	2083,4
2	Інженер-програміст	2	80	120,83	19332,8
3	Консультант з економіки	1	2	83,83	166,66
Всього	21572,86

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

Отже, відрахування на єдиний соціальний внесок становитимуть:

В_Ф = 21572,86*0,37 = 7981,96 грн.

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

4. Витрати на придбання спецобладнання (В_СО) для проведення експериментальних робіт розраховуються в тому випадку, коли для розробки та впровадження проектного рішення необхідне придбання додаткових технічних засобів. Вартість спецобладнання для виконання конкретного проекту визначається на основі специфікації в їх потребі та фактичних цін з урахуванням транспортно-заготівельних витрат (В_тр = 12,5%).

Вихідні дані та результати розрахунків оформлено у таблиці 7.2:

Таблиця 7.2 Розрахунок вартості спецобладнання

№ п/п	Найменування обладнання	Марка, тип	Кількість на проект, шт.	Ціна за одиницю, грн.	Сума витрат, грн.	Сума витрат з урахуванням транспортно-заготівельних витрат, грн.
1	Монітор	Philips 192EL2SB/01 DVI	4	833	3332	3748,5
2	Системний блок	HP 8100E SFF	4	5469	21876	24610,5
Всього	28359

5. Накладні витрати (Нв) проектних організацій включають три групи видатків: витрати на управління; загальногосподарські; невиробничі витрати. Вони розраховуються за встановленими 23% до витрат на оплату праці.

Н_В = 21572,86 * 0,23 = 4961,76 грн.

6. Інші витрати (Ів) складають видатки, які не враховані в попередніх статтях витрат. Вони розраховуються за встановленими 7% до витрат на оплату праці.

I_В = 21572,86 *0,07= 1510,10 грн.

7. Витрати на розробку проектного рішення обчислюємо за формулою:

К₁ = В_ОП + В_ф + В_Д + В_СО + Нв + Ів (4)

K₁ = 21572,86+ 7981,96 +0+28359+4961,76+1510,1 = 64385,68 грн.

8. Витрати на відлагодження і дослідну експлуатацію системи визначаємо згідно формули:

(5)

де S_м.г.- вартість однієї години роботи ПК, грн./год.; t_від- кількість годин роботи ПК на відлагодження програми, год.

Вартість однієї години роботи ПК - 0.04872 грн., тобто спожита електроенергія: 0.4 КВт / год. * 0.3648 грн. (тариф) = 0.14592 грн. На відлагодження системи було витрачено 30 днів (30*8 = 240 годин часу), тому:

К₂=0,14592*240=35,02 грн.

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

K =К₁+К₂= 64420,7+ 35,02 =64420,7 грн.

Результати розрахунків зведено у наступній таблиці 7.3:

Таблиця 7.3 Кошторис витрат на розробку проектного рішення

№ п/п	Найменування елементів витрат	Сума витрат, грн.
1	Витрати на оплату праці	21572,86
2	Відрахування у єдиний соціальний внесок	7981,96
3	Витрати на експлуатацію ПК	35,02
4	Витрати на додаткові вироби, що купуються	57913,82
5	Накладні витрати	4961,76
6	Інші витрати	1510,1
Всього	64420,7

7.2 Визначення комплексного показника якості

Комплексний показник якості (П_я) визначається шляхом порівняння показників якості проектованої системи і вибраного аналогу.

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

Для визначення П_я використовується система показників технічного рівня і якості, яка містить в собі наступні групи:

1. Показники призначення:

1.1. актуальність даного програмного забезпечення;

1.2. ступінь новизни;

1.3. продуктивність;

1.4. універсальність системи;

1.5. відкритість системи;

1.6. створення копій БД;

1.7. підтримання багатокористувацького режиму;

2. Показники надійності та безпеки:

2.1. ймовірність помилки;

2.2. надійність обчислення;

2.3. тривалість безвідмовної роботи;

3. Патентно-правові показники:

3.1. патентно-правовий статус;

4. Ергономічні показники:

4.1. легкість експлуатації;

4.2. гнучкість налаштування.

Комплексний показник якості проектованої системи визначаємо методом арифметичного середньозваженого з формули:

(6)

де m - кількість одиничних показників (параметрів), прийнятих для оцінки якості проектованої системи; q_і - коефіцієнт вагомості кожного з параметрів щодо їхнього впливу на технічний рівень та якість проектованої системи (встановлюється експертним шляхом), причому:

(7)

С_i - часткові показники якості, визначені порівнянням числових значень одиничних показників проектованої системи і аналога за формулами:

(8)

де П_прі, П_аі - кількісні значення і-го одиничного показника якості відповідно проектованої системи і аналога.

З попередніх двох формул вибирається та, в якій збільшення відповідає покращенню показника якості проектованої системи. Результати розрахунку зводимо в табл. 7.4.

Отже, комплексний показник якості дорівнює П_Я = 1,9643.

Таблиця 7.4 Визначення комплексного показника якості проектованої системи (аналога)

Показники	Числове значення показників, бали	Відносний показник якості, Сі	Коефіцієнт вагомості qі	Сі Ч qі
	Аналог	Проект. прогр. продукт
Актуальність даного ПЗ	5	10	2	0,06	0,12
Ступінь новизни	4	10	2,5	0,07	0,175
Продуктивність	7	9	1,29	0,04	0,052
Універсальність с-ми	5	10	2	0,05	0,1
Відкритість с-ми	2	8	4	0,005	0,02
Обчислення даних	4	9	2,25	0,145	0,33
Створення копій БД	5	10	2	0,04	0,008
Багатокорист. режим	4	10	2,5	0,09	0,225
Надійність обчислення	5	10	2	0,15	0,3
Тривалість безвідмовної роботи	9	3	3	0,07	0,21
Патентно-правовий статус	6	10	1,7	0,09	0,135
Легкість експлуатації	5	9	1,8	0,01	0,018
Ймовірність помилки	10-2	10-4	1	0,12	0,12
Гнучкість налаштування	6	10	1,7	0,06	0,102
Всього				1	1,9643

7.3 Визначення експлуатаційних витрат

При порівнянні програмних засобів в експлуатаційні річні витрати включають вартість підготовки даних (Е₁) і вартість годин роботи ПК (Е₂) і визначаються за формулою:

(9)

де Е_П(А) - одноразові експлуатаційні витрати на проектне рішення (аналог), грн.; Е_1П(А) - вартість підготовки даних для експлуатації проектного рішення (аналогу), грн.; Е_2П(А) - вартість машино-годин роботи ПК для проектного рішення (аналогу), грн.

Річні експлуатаційні витрати визначаються за формулою:

(10)

де - експлуатаційні річні витрати проектного рішення; - періодичність експлуатації проектного рішення (аналогу), раз/рік.

Вартість підготовки даних для роботи на ПК (Е₁) визначаються за формулою:

(11)

де і - номери категорій персоналу, які беруть участь у підготовці даних; n_i - чисельність співробітників і-ї категорії, чол.; t_i - трудомісткість роботи співробітників і-ї категорії, дні; - середньогодинна ставка робітника і-ї категорії з врахуванням відрахувань до державних цільових фондів, грн./год.

Середньогодинна ставка оператора визначається за формулою:

(12)

де - основна місячна зарплата працівника і-ї категорії, грн.; b - коефіцієнт, який враховує збори до спеціальних державних фондів (b=0,37); Фг - місячний фонд робочого часу, год.

Отже, для проектного рішення середньогодинна ставка становить:

Вартість підготовки даних для роботи на ПК дорівнює:

E_1П = (1*24*17,84)+(2*24*20,69) = 1421,28 грн.

Вартість машино-годин роботи ПК для проектного рішення становить 35,02 грн. Тоді одноразові експлуатаційні витрати на проектне рішення становлять:

E_П = 1421,28 +35,02 = 1456,3 грн.

А річні експлуатаційні витрати з урахуванням того, що періодичність експлуатації проектного рішення дорівнює 2 рази/рік, становлять:

В_(е)П=1456,3*2 = 2912,6 грн.

Вихідні дані та результати розрахунків витрат на підготовку даних для експлуатації на ЕОМ зводяться у таблицю 7.5.

Над проектом-аналогом працює 2 старший науковий співробітник та 3 інженера-програміста. Їх місячні заробітні ставки відповідно 26325 грн. та 11800 грн. Тоді середньогодинна ставка для кожного з них становить:

Таблиця 7.5 Розрахунок витрат на підготовку даних для роботи на ЕОМ

Категорія персоналу	Чисельність співробітників і-ої категорії, чол.	Час роботи співробітників і-ої категорії, год.	Середньогодинна ЗП співробітника і-ої категорії, грн.	Витрати на підготовку даних, грн.
Проектне рішення
Керівник проекту	1	24	17,84	428,16
Інженер-програміст	2	24	20,69	993,12
Всього				1421,28
Аналог
Старший наук. спів-к	2	20	187,84	7513,6
Інженер-програміст	3	16	84,2	4041,6
Всього				11555,2

грн.

грн.

Трудомісткість роботи за проектом-аналогом становить 30 днів для старших наукових співробітників і по 60 днів для інженерів-програмістів. Тоді вартість підготовки даних для роботи на ПК дорівнює:

грн.

Вартість машино-годин роботи ПК для проекту-аналогу становить 87,80 грн. Тоді одноразові експлуатаційні витрати на аналог становлять:

грн.

А річні експлуатаційні витрати з урахуванням того, що періодичність експлуатації аналогу дорівнює 12 разів/рік, становлять:

грн.

7.4 Розрахунок ціни споживання проектного рішення

Ціна споживання (Цс) - це витрати на придбання і експлуатацію проектного рішення за весь строк його служби:

(13)

де Ц_П - ціна придбання проектного рішення, грн.; - теперішня вартість витрат на експлуатацію проектного рішення (за весь час його експлуатації), грн.:

(14)

де П_р - норматив рентабельності (24,5%); К_о - витрати на прив'язку та освоєння проектного рішення на конкретному об'єкті, грн., К_о = 1000 грн.; К_К - витрати на доукомплектування технічних засобів на об'єкті, грн., К_К = 2000 грн.; С_ПДВ - ставка податку на додану вартість (20%).

Ц_П = 64420,7*(l+0,245)*(l+0,2)+1000+2000= 99244,5 грн.

Ціна придбання аналога відома і дорівнює:

Ц_П(а) = 100000,00грн.

Теперішня вартість витрат на експлуатацію проектного рішення розраховується за формулою:

(15)

де - річні експлуатаційні витрати в t-ому році, грн.; Т - строк служби проектного рішення, років; R - річна ставка проценту банків (22%).

Оскільки впродовж всього строку експлуатації , то:

(16)

де РV - ставка дисконту на період Т, яка визначається залежно від процентної ставки (R) і періоду експлуатації (Т).

При R = 0,22РV має такі значення:

T	0	1	2	3	4	5
РV	1,0	0,82	1,51	2,07	2,54	2,93

Оскільки термін експлуатації проектного рішення становить 3 роки, тоді РV = 2,07. Отже, теперішня вартість витрат на експлуатацію проектного рішення становить:

B_(E)NPV= 2,07 * 2912,6 = 6029,08 грн.

Таким чином ціна споживання проектного рішення становить:

Ц_С(П) = 99244,5 + 6029,08 = 105273,58 грн.

Аналогічно визначається ціна споживання для аналогу. Визначимо теперішню вартість витрат на експлуатацію аналогу. Термін експлуатації аналогу становить 3 роки, тоді РV = 2,07. Оскільки , то:

грн.

Отже, ціна споживання проекту-аналогу становить:

грн.

7.5 Визначення показників економічної ефективності

Оскільки базою для порівняння обрано відповідний програмний засіб, в даному розділі розраховуються такі показник

1) Показник конкурентоспроможності:

(17)

К_КС=244606,06 *1,9643/105273,58 = 4,56

2) Економічний ефект в сфері експлуатації:

(18)

Е_ЕКС = 69858 - 2912,6 = 66945,4 грн.

3) Економічний ефект в сфері проектування:

 (19)

E_ПР= 100000 - 99244,5 = 755,5 грн.

Оскільки Епр>0 та Еекс>0, то розраховуємо:

1. Додатковий економічний ефект в сфері експлуатації:

(20)

Е_{ЕКС Д} = 66945,4 *(1,22⁰+1,22¹+1,22²) = 263095,42 грн.

2. Додатковий економічний ефект в сфері проектування:

(21)

Е_{ПР Д} = 755,5 *(1+0,22³) = 1371,87 грн.

Термін окупності витрат на проектування рішення:

(22)

Т_ОК= 64420,7/ 66945,4 = 0,96 року

Результуючі показники економічної ефективності зводяться у таблиці 7.6.

Таблиця 7.6 Показники економічної ефективності проектного рішення

Найменування показників	Одиниці вимірювання	Значення показників
		Аналог	Проектне рішення
1 Капітальні вкладення	грн.	?	64420,7
2 Ціна придбання	грн.		99244,5
3 Річні експлуатаційні витрати	грн.		2912,6
4 Ціна споживання	грн.		105273,58
5 Економічний ефект в сфері експлуатації	грн.	?	66945,4
6 Додатковий економічний ефект в сфері експлуатації	грн.	?	263095,42
7 Економічний ефект в сфері проектування	грн.	?	755,5
8 Додатковий економічний ефект в сфері проектування	грн.	?	1371,87
9 Термін окупності витрат на проектування рішення	роки	?	0,96
10 Коефіцієнт конкурентоспроможності	?	?	4.56

Висновки по економічній частині

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

Ціна придбання проектного рішення становить 99244,5 грн., річні експлуатаційні витрати 2912,6 грн., економічний ефект в сфері експлуатації 66945,4 грн., економічний ефект в сфері проектування 755,5 грн. Наведені розрахунки доводять доцільність розробки, оскільки забезпечується економія капіталовкладень в розробку програмного продукту та значно покращується річний економічний ефект, який отримується користувачами розробленої системи. Економічна ефективність розробки програми підтверджує її доцільність, а універсальність та практичні результати підкреслюють необхідність подальшого розвитку. Серед вагомих показників, на які слід звернути увагу, є показники надійності, що перевищують аналог в два рази. Цього було досягнуто використанням генетичних алгоритмів.

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

ВИСНОВОК

Під час проектування задачі, яка була поставлена у даному дипломному проекті, я здобув навики та принципи вирішення завдань такого типу. У ході проектування завдання освоїв основні принципи та підходи щодо розробки автоматизації вирішення проблем поставленого завдання. Основною метою мого проектування було використання системного аналізу, декомпозиції проблеми, знаходження оптимальних шляхів вирішення проблеми а також використання Аjax при створені веб додатків такого типу. Судячи із кінцевого результату проектування, вирішення проблеми за темою дипломного проектування було здійснено в повному обсязі. Мною було засвоєно принцип інтеграції технології AJAX у веб ресурс та основні програмні реалізації роботи Аjax на стороні клієнтської машини. Вивчив методи декомпозиції проблем та складних ємкісних завдань. Вивчив основні підходи до побудови програмних структур мовою php, а також javascript. Розглянув сервісні функції роботи веб браузерів в різних операційних системах для побудови кросбраузерності веб ресурсу. Для використання бази даних мною було освоєно синтаксис mysql та основні функціональні можливості реляційних таблиць. Для роботи із Аjax технологією освоїв використання javascript фреймворка jquery. Для перевірки роботи системи вивчив підхід до створення тестового алгоритму для веб додатку.

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

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

Дипломний проект надав мені можливість вивчити новітні технології програмування Інтернет сайтів та освоїти сучасні методи та підходи до проектування веб додатків високо рівня складності.