Використання сучасних Javascript фреймворків для розробки Web-модулів CRM-систем обслуговування авіарейсів

Размещено на http://www.allbest.ru/

Размещено на http://www.allbest.ru/

Курсова робота

на тему: Використання сучасних Javascript фреймворків для розробки Web-модулів CRM-систем обслуговування авіарейсів

Анотація

В даній дипломній роботі були розглянуті переваги та проблеми дистанційної освіти в цілому та окремо на прикладі корпорації Microsoft. Було визначено важливість створення власного сайту та проаналізовано інформаційне наповнення для сторінок. Обраною технологією для створення сайту стала мова ASP.NET з використанням СКБД Microsoft SQL Server 2005. За чітко підібраною структурою були розроблені модулі сайту та дизайн сайту.

В ході виконання даної бакалаврської роботи був створений сайт ІТ Академії Microsoft при ВНТУ. За допомогою якого студенти та зацікавленні особи могли б дізнатись про можливості навчання, існуючі курси та тренерів академії. Сайт було розроблено за допомогою програми Microsoft Visual Studio 2008.

Зміст

Вступ

1. Розробка та обґрунтування технічного завдання

1.1 Постановка завдання

1.2 Суть технічної проблеми

1.3 Існуючі способи вирішення технічної проблеми

1.4 Порівняння з існуючими аналогами

1.5 Розробка технічних умов програмної системи

1.6 Висновки

2. Розробка програмної реалізації

2.1 Вибір мови програмування

2.2 Використання javascript фреймворків

2.3 Розробка інтерфейсу

2.4 Опис робочого циклу модулів

2.5 Налаштування програмного модуля

2.6 Інтеграція модуля з сайтом

Тестування

Висновок

Література

Вступ

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

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

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

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

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

- задачі перетворення опису ситуації (розрахункові задачі, задачі моделювання);

- задачі прийняття рішень (в тому числі і оптимізаційні).

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

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

· засоби фіксації і збору інформації;

· засоби передачі відповідних даних та повідомлень;

· засоби збереження інформації;

· засоби аналізу, обробки і представлення інформації.

Різноманітність інформаційних систем з кожним роком все зростає. В залежності від функціонального призначення можна виділити такі системи: управляючі (АСУТП, АСУВ), проектуючі (САПР), наукового пошуку (АСНД, експертні системи), діагностичні, моделюючі, систем підготовки прийняття рішення (СППР).

CRM-система є інформаційною базою для усіх даних про клієнтів і продажі. Усі дані добре структуровано, вся потрібна інформація завжди під рукою. За дві-три секунди можна підняти будь-які дані: про певного клієнта, про певний товар, про певного менеджера та результати його роботи. І не треба порпатись у клаптиках паперу, гортати старі зошити, чекати з відрядження ключового працівника. Уся інформація завжди у вашому комп'ютері. На багатьох підприємствах використовуються з цією метою табличні процесори, наприклад "Microsoft Excel". Що ж, буває і таке. Колись люди користувалися кам'яними сокирами. І лише згодом зрозуміли, що є кращі інструменти.

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

1. Розробка та обґрунтування технічного завдання

1.1 Постановка завдання

У даному дипломному проекті потрібно розробити web-модулі інформаційної CRM системи для отримання основних відомостей про авіарейси використовуючи сучасні javascript фреймворки. Функціонально розробляємі web-модулі повинні дозволяти вивести всю необхідну інформацію по рейсу, літаку, наявності на ньому пасажирських місць, іншої інформації, яка потрібна в процесі реєстрації. Безпосередньо при виконанні пошуку рейсу користувачеві надається вибрати оптимальний рейс, завдяки параметрам якими він орієнтується. Кожному користувачеві має надаватися можливість знайти у розкладі який вказується тип літака, рейс, дні вильоту, час вильоту і прильоту, маршрут (початковий, кінцевий і пункт пересадки), вартість квитка.

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

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

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

1.2 Суть технічної проблеми

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

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

Таким чином, можна виділити наступні основні переваги використання:

§ підвищення зручності пошуку і відбору даних з довідників зберігання статичної інформації і журналів виконаних операцій;

§ підвищення швидкості пошуку і відбору інформації;

§ швидкий друк результату пошуку;

§ забезпечення безпеки зберігання інформації;

§ забезпечення багатокористувацької роботи.

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

1.3 Існуючі способи вирішення технічної проблеми

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

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

§ виявлення інформаційних потреб;

§ добір джерел інформації;

§ збирання інформації;

§ введення інформації із зовнішніх або внутрішніх джерел;

§ опрацювання інформації;

§ виведення інформації для надання її споживачам або передачі в іншу систему;

§ організація використання інформації для оцінки тенденцій, розробки прогнозів, оцінки альтернатив рішень і дій, вироблення стратегії;

§ організація зворотного зв'язку інформації, переопрацьованої людьми такої організації, корекція вхідної інформації.

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

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

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

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

Інформаційні автоматизовані системи управління підприємствами (далі -- АСУП) -- це системи із застосуванням сучасних засобів автоматизованої обробки даних, економіко - математичних та інших методів для регулярного розв'язування завдань управління виробничо-господарською діяльністю підприємства.

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

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

1.4 Порівняння з існуючими аналогами

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

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

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

* забезпечення якісного обслуговування рейсів і пасажирів;

* ефективне використання всіх наявних ресурсів;

Рисунок 1.1 - інформаційна система «Аеропорт»



Рисунок 1.2 - інформаційна система «Аеропорт»

Рисунок 1.3 - інформаційна система «Авіакомпанія»

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

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

Основні функції:

· Ведення бази даних розкладу;

· Формування всього необхідного обсягу супровідних телеграм і їх автоматичне відправлення безпосередньо із системи;

· Автоматична обробка вхідних телеграм;

· Контроль стану узгодження слотів;

· Контроль стану узгодження з ЦРТ;

· Робота з необмеженою кількістю варіантів розкладу на один і той же сезон навігації;

· Автоматизована процедура узгодження проекту розкладу

· Ведення реєстру договорів Code Share;

· Формування рекламного розкладу з урахуванням трансферних стикувань і договорів Code Share;

· Динамічне побудова графіка обороту з можливістю ручного коректування;

· Організаційне забезпечення рейсів;

1.5 Розробка технічних умов програмної системи

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

Основні можливості програми:

1. Відображення зручного для користувачів інтерфейсу.

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

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

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

Програма моделювання може працювати під управлінням операційної системи Windows XP/7/8, які є найбільш поширеними серед операційних систем. Для обчислювальних операцій необхідно використання процесорів Intel Pentium ІV (або аналогічний) і вище. Ємність ОЗУ - не менша, ніж 512 Мбайта.

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

1.6 Висновки

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

2. Розробка програмної реалізації

2.1 Вибір мови програмування

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

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

World Wide Web (WWW) - це найвідоміша та найпопулярніша служба Iнтернета. Ця глобальна, розподілена по цілому світі інформаційна гіпертекстова мультимедійна система дозволяє з'єднати в одне ціле інформацію різних видів, яка зберігається на різних комп'ютерах. Нагадаємо, що інформація в WWW розповсюджується у вигляді Web-сторінок (Web-документів). Декілька Web-документів з однієї теми, що належать одному власникові чи є на одному комп'ютері, утворюють Web-вузол, який часто називають сайтом. Основним принципом використання Web-сторінок є активізація гіпертекстових посилань, за допомогою яких можна здійснити перехід в інші місця Web-сторінки або до інших Web-сторінок. В основі WWW лежать два поняття: гіпертекстові посилання та формат документів HTML. Завдяки гіпертексту Web-сторінки набувають властивості інтерактивності.

HTML (Hyper Text Markup Language) - це спеціальна мова форматування текстових електронних документів. HTML був ратифікований World Wide Web Consortium. Він підтримується декількома широко поширеними браузерами, і, можливо, стане основою майже всього що має відношення до Web програмного забезпечення.

Оскільки електронні Web-документи призначені для перегляду на екрані, причому наперед не відомо, на якому комп'ютері це буде робитися, а, отже, невідомі розміри вікна програми-переглядача, шрифти, які встановлені на комп'ютері, і т.д., то мова HTML призначена якраз для того, щоб оформляти електронні документи з розрахунку на те, що засоби, якими вони будуть переглядатися, наперед невідомі. Формування документів мовою HTML подібне до програмування. Вихідний текст документа складається з послідовності команд, які називають тегами (tag). Під час перегляду теги спрацьовують, і завдяки їм на екран виводяться запрограмовані елементи зображення. Наприклад, якщо на початку абзацу стоїть тег <p> з атрибутом align=center (<p align=center>…</p>), то весь абзац буде вирівняно по центру вікна, незалежно від того, в якому вікні здійснюється перегляд документа і яким шрифтом він зображується. Теги HTML дозволяють вирівнювати рядки документа, керувати кольором фону та кольором тексту, дозволяють вставляти в текст ілюстрації, задавати заголовки різних рівнів, будувати таблиці, створювати гіпертекстові посилання на інші документи тощо. Більш складні Web-документи містять фрейми (вкладені Web-сторінки), елементи керування та вводу інформації (кнопки, перемикачі, поля вводу тексту), динамічні об'єкти (Java Applet, Java Script, ActiveX).

Широке розповсюдження HTML-документи одержали завдяки різноманітним можливостям представлення інформації, легкістю написання та сумісністю з різними операційними системами. Всі програми, написані мовою HTML (HTML-файли) мають однакову структуру. Можна зекономити час при створенні своїх Web-сторінок, якщо використовувати цю структуру як еталон.

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

Звернемо увагу на те, що для створення Web-сторінок дизайнери використовують гіпертекстові редактори, наприклад, Macromedia Dreamweaver, Microsoft FrontPage та інші, хоча за достатнього володіння мовою HTML можна писати Web-сторінки в будь-якому текстовому редакторі, наприклад, Блокнот (NotePad). Проте код краще писати вручну. Це дозволить дуже швидко запам'ятати правильне написання тегів, атрибутів, властивостей, а також звільнить від непотрібних проблем. Після написання програм файл потрібно зберегти на диску з певною назвою та розширенням.html або.htm. Мова HTML існує в декількох варіантах і продовжує розвиватися, але конструкції HTML ймовірніше за все будуть використовуватися і надалі. У 2007 році була розроблена п'ята версія основної мови Web-сторінок. Версія мови, цілком відповідає стандарту XML, називається HTML5. Вперше вона стала доступною широкій громадськості в 2008р. Вивчаючи HTML і пізнаючи його глибше, створюючи документ на початку вивчення HTML і розширюючи його наскільки це можливо, Ви зможете створювати документи, які можуть бути переглянуті багатьма браузерами Web, як зараз, так і в майбутньому. Це не виключає можливості використання інших методів, наприклад, метод розширених можливостей, наданий Netscape Navigator, Internet Explorer, Opera, Mozilla Firefox або деякими іншими програмами. Робота з HTML - це спосіб засвоїти особливості створення документів у стандартизованому мовою, використовуючи розширення, тільки коли це дійсно необхідно.

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

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

Не для кожної мови програмування існує докладна та інформативна документація. Тому актуальним є доступність документації на багатьох мовах. Тут і виявляються не аби які переваги відкритих ліцензій GNU GPL, Apache License, BSD. Досвід показує, якими б досконалими не були власницькі реалізації всі вони застарівають. А їхнє оновлення завжди вимагає значних ресурсів: людських, фінансових, технічних. Закриті коди дуже часто базуються на власних стандартах. Тому до всіх недоліків виникають проблеми сумісності, з операційними системами, з форматами даних і т.д. При цьому розробники, які обрали власницьку платформу змушені користуватися шматками коду на форумі (І не допоможе ні купа документації, ні платна підтримка. Не зважаючи на їхню фаховість вони ніколи не підкажуть ідею.) в той час коли проекти з відкритим кодом вільно доступні в Інтернеті.

Для розробки програмних модулів на дипломну роботу було обрано мову програмування Javascript. Серед клієнтських мов веб-програмування почесне місце заслужено займає Javascript. Мова Javascript була розроблена на початку 90-х років минулого століття фірмою Netscape. Спочатку ця мова розроблялася для взаємодії винятково із браузером Netscape Navigator - продуктом компанії Netscape. Однак на сьогоднішній день ця мова веб-програмування одержала найширше розповсюдження і практично всі браузери його підтримують. Крім того, сценарії Javascript підтримуються в таких додатках як Adobe Photoshop, Adobe Dreamweaver, Adobe Illustrator або Adobe InDesign, які активно використовуються професіоналами для створення веб-дизайна.

Найпоширеніший приклад - заповнення реєстраційних форм. Клієнтський скрипт перевіряє дані у формі ще до відправлення на сервер і у випадку помилки вказує на неї. Інші дані при цьому зберігаються в динамічній пам'яті, і немає необхідності при помилці в одному полі введення ще раз повністю проходити процес заповнення. Інших подібних випадків, у яких застосування Javascript реалізує завдання, недоступні для статичних сторінок, ще безліч. Серед них: зміна вмісту сторінки у відповідь на дію користувача; створення спливаючих підказок; реагування на клацання миші, рух курсору.

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

JavaScript має C-подібний синтаксис, але в порівнянні з мовою Сі має такі корінні відмінності:

· об'єкти, з можливістю інтроспекції і динамічної зміни типу через механізм прототипів;

· функції як об'єкти першого класу;

· обробка винятків;

· автоматичне приведення типів;

· автоматичне прибирання сміття;

· анонімні функції.

JavaScript містить декілька вбудованих об'єктів: Global, Object, Error, Function, Array, String, Boolean, Number, Math, Date, RegExp. Крім того, JavaScript містить набір вбудованих операцій, які, строго кажучи, не обов'язково є функціями або методами, а також набір вбудованих операторів, що управляють логікою виконання програм. Синтаксис JavaScript в основному відповідає синтаксису мови Java (тобто, зрештою, успадкований від C), але спрощений порівняно з ним, щоб зробити мову сценаріїв легкою для вивчення. Так, приміром, декларація змінної не містить її типу, властивості також не мають типів, а декларація функції може стояти в тексті програми після неї.

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

2.2 Використання javascript фреймворків

програмний авіаквиток сайт фреймворк

Фреймворк - структура програмної системи; програмне забезпечення, що полегшує розробку і об'єднання різних компонентів великого програмного проекту. Вживається також слово «каркас», а деякі автори використовують його в якості основного, в тому числі не базуючись взагалі на англомовному аналогу. Можна також говорити про каркасному підході як про підхід до побудови програм, де будь-яка конфігурація програми будується з двох частин: перша, постійна частина - каркас, не змінний від конфігурації до конфігурації і несе в собі гнізда, в яких розміщується друге, змінна частина - змінні модулі (або точки розширення).

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

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

JQuery - бібліотека JavaScript, що фокусується на взаємодії JavaScript та HTML. Бібліотека JQuery допомагає легко отримувати доступ до будь-якого елементу DOM, звертатися до атрибутів і вмісту елементів DOM, маніпулювати ними. Також бібліотека JQuery надає зручний API для роботи з AJAX.

Можливості JQuery 1.6.1:

· Движок кросбраузерності CSS-селекторів Сіззле, що виділився в окремий проект;

· Перехід по дереву DOM, включаючи підтримку XPath як плагіна;

· Події;

· Візуальні ефекти;

· AJAX-доповнення;

· JavaScript-плагіни.

Точно так само, як CSS відокремлює візуалізацію від структури HTML, JQuery відокремлює поведінку від структури HTML. Наприклад, замість прямої вказівки на обробник події натискання кнопки управління передається JQuery, яка ідентифікує кнопки і потім перетворює його в обробник події кліка. Такий поділ поведінки і структури також називається принципом ненав'язливого JavaScript.

Бібліотека JQuery містить функціональність, корисну для максимально широкого кола завдань. Проте, розробниками бібліотеки не ставилося завдання суміщення в JQuery функцій, які підійшли б усюди, оскільки це призвело б до великого коду, більша частина якого не затребувана. Тому була реалізована архітектура компактного універсального ядра бібліотеки і плагінів. Це дозволяє зібрати для ресурсу саме ту JavaScript-функціональність, яка на ньому була б затребувана [2].

Роботу з JQuery можна розділити на 2 типи:

1. Отримання JQuery-об'єкта за допомогою функції $ (). Наприклад, передавши в неї CSS-селектор, можна отримати JQuery-об'єкт всіх елементів HTML, що потрапляють під критерій і далі працювати з ними за допомогою різних методів JQuery-об'єкта. У разі, якщо метод не повинен повертати якого-небудь значення, він повертає посилання на JQuery об'єкт, що дозволяє вести ланцюжок викликів методів згідно концепції даного інтерфейсу.

2. Виклик глобальних методів у об'єкту $, наприклад, зручних ітераторів по масиву.

Типовий приклад маніпуляції відразу декількома вузлами DOM полягає у виклику $ функції з рядком селектора CSS, що повертає об'єкт JQuery, що містить деяку кількість елементів HTML-сторінки. Ці елементи потім обробляються методами JQuery.

jQuery Templates - використовується для роботи з шаблонами, що працює на стороні клієнта як розширення JQuery. Цей плагін допомагає показати в браузері дані, які знаходяться в об'єктах і масивах JavaScript, позбавляючи вас від рутинних операцій по створенню HTML-коду, екрануванню спеціальних символів і т.п. Крім того, він володіє дуже цікавими можливостями - наприклад, дозволяє оновлювати створений з його допомогою HTML-код при зміні вихідних даних. jQuery Templates - не єдиний і не перший «движок шаблонів», але у нього є велика перевага перед альтернативними варіантами - підтримка з боку JQuery команди. Це дозволяє не боятися того, що цей плагін виявиться покинутим, і різні проблеми, що виникають при виході нових версій браузерів, доведеться вирішувати своїми силами, як працює jQuery Templates зображено на рисунку 2.1.



Рисунок 2.1 - Діаграма роботи jQuery Templates

jQuery Globalization Plugin - призначений для легкої обробки і відображенні дат. Плагін включає інформацію про глобалізації для понад 350 культур від шотландської кельтської, фризької, угорської, японської до канадського англійської. Цей пагін є для всієї спільноти з відкритим вихідним кодом. jQuery Globalization Plugin спрощує для вас парсинг і форматування чисел, валют і дат для різноманітних культур в JavaScript. Також можете використовувати плагін для форматування дат, так щоб день і місяць відображалися в правильному порядку і правильно переводилися.

Метод $ format. () використовується для форматування значень валют, дат і чисел. Другий параметр переданий в $ format.() - це покажчик формату. Наприклад, передача "с" означає, що значення має бути відформатовано як грошове. Коли ми відкриємо сторінку в браузері, все буде відформатовано так, як і належить за всіма вимогами, приклад зображено на рисунку 2.2.

jQuery Validate - бібліотека валідації введених даних. Для того щоб перевірити правильність введених даних додаємо до поля, яке потрібно перевірити, html атрибут «class», і це підключить перевірку.

При виклику метода Validate на формі, створюється об'єкт «Validator» з усіма правилами та опціями, приєднаними до форми. Метод «Validate» приєднує «Validator» використовуючи "$.data". Ми можемо отримати його вибравши форму і викликавши функцію JQuery "$.data" і передати її «Vaidator». Об'єкт «Vaidator» - це всі метадані для валідації, які дають нам можливість доступу до опцій валідації в будь-який час життєвого циклу сторінки.

Рисунок 2.2 - Приклад роботи jQuery Globalization

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

2.3 Розробка інтерфейсу

Сьогодні багато програмістів користуються для програмування користувацьких інтерфейсів набір класів Swing. Swing - на набір класів, що пропонують більш потужні та гнучкі GUI - компоненти, ніж AWT. Більшість сучасних графічних користувацьких інтерфейсів javascrpt побудовані на основі Swing.

На початку існування javascript класів Swing не було взагалі. Причино їх розробки було не велика частина у вихідних підсистемах GUI Java: AWT. AWT визначає базовий набір елементів управління, вікон і діалогів, які підтримують придатний до використання, але обмежений у можливостях графічний інтерфейс. Одною з причин обмеженості AWT є те, що AWT перетворює свої різні візуальні компоненти в відповідні їх еквіваленти, не залежні від платформи, що називаються рівноправними компонентами.

Використання рідних рівноправних компонентів породжує деякі проблеми. По-перше, в зв'язку з відмінностями, існуючими між операційними системами, компонент може виглядати або навіть вести себе по-різному на різних платформах. Така мінливість йшла врозріз з філософією Java: «Написано раз, працює всюди». З появою Swing були зняті ці обмеження. Але хоча Swing вирішує деякі проблеми, що виникали раніше, він не заміняє AWT, а більше його класи побудовані на основі AWT.

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

Для розробки графічного інтерфейсу на дипломну роботу було використано такі класи Swing:

· JFrame - компонент для відображення вікна;

· JPanel - контейнер, в який можна поміщати інші елементи;

· JButton - елемент для відображення та обробки подій кнопки;

· JDialog - компонент для відображення діалогових вікон;

· JLabel - компонент для текстових міток у вікні, відображення текстової інформації

Рисунок 2.3 - Інтерфейс головного модуля

2.4 Опис робочого циклу модулів

Mодуль пошуку та бронювання авіаквитків призначений для швидкого вбудовування модуля на туристичних сайтах, інтернет-порталах, а також рекомендований власникам відвідуваних сайтів туристичної тематики додатковий дохід з продажу авіаквитків. Модуль володіє ергономічним і інтуїтивно зрозумілим інтерфейсом, що дозволить користувачам без проблем самостійно знайти і забронювати авіаквиток на потрібну дату і рейс. Файли проекту містять тільки HTML і JavaScript і не вимагає серверного коду. Весь процес відбувається на стороні клієнта, в браузері користувача. Коли користувач заходить на сайт, то він завантажує зовнішній вигляд модуля з каталогу на сервері, а дані завантажує через спеціальний сервіс. Таким чином агентство може встановити модуль на своєму сервері і виправляти дизайном самостійно.

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

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

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

2.5 Налаштування програмного модуля

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

Вимога до веб-серверу:

1. Можливість зберегти папку з файлами модуля на веб-сервері;

2. Можливість відкрити доступ для скачування всіх файлів модуля з цієї папки;

3. Ви повинні мати доступ до редагування HTML-коду сторінок сайту.

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

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

Залежно від кодування в якій працює ваш сайт необхідно встановити відповідну версію модуля. Зараз підтримується два кодування: UTF-8 і Windows-1251. Якщо встановити неправильну версію, то в деяких браузерах не буде відображатися кирилиця. Далі вам потрібно налаштувати файл config.js. Цей файл оголошує глобальну змінну alpConfig, яка містить всі настроюються параметри. Нижче представлено опис цих параметрів:

clientCode - унікальний код клієнта.

flightJsonApi - змінна містить описи настройок підключення до JsonApi з бронювання авіаквитків.

officeJsonApi - змінна містить описи настройок підключення до JsonApi особистого кабінету.

DataRoot - змінна містить повний URL до папки alponline на вашому сервері.

site - змінна налаштовує значення імен кожній сторінці модуля. Кожна окрема секція модуля (рейси, офіс і т.д.) налаштовується у своїй змінної.

site.root - змінна містить повний URL до завантажувальних файлів на сайті.

searchResultItemsPerPage - кількість результатів пошуку на сторінку.

2.6 Інтеграція модуля з сайтом

При бажанні, можливо налаштувати модуль таким чином щоб він відображався всередині вже існуючих сторінок сайту, або вписувався в роботу вашої CMS. Для цього необхідно вставити код, що міститься у файлах flight.html і office.html на потрібні сторінки. На сторінку, де планується розмістити секцію бронювання квитків, додати наступний код в <head>:

<!-- Підключаем js біблиотеки -->

<script type="text/javascript" src="alponline/scripts/jquery/jquery-1.6.1.min.js"></script>

<script type="text/javascript" src="alponline/scripts/commons/alpEngine.js"></script>

<script type="text/javascript" src="config.js"></script>

<script type="text/javascript">

alpEngine.initialize();

jQuery(function ($) {

alpEngine.loadPage("flights", alpEngine.getParam("pageName"), $("#alpContent"));

});

</script>

Даний код підключить дві JavaScript-бібліотеки: JQuery і alpEngine. Команда alpEngine.initialize проініціалізірует модуль, і завантажить основні файли для його відображення. Після завантаження сторінки виконається команда aEngine.loadPage. Перший аргумент якої - назва секції модуля; другий - назва сторінки, передана в параметрах; третій - визначає елемент на сторінці для вставці модуля. Після цього в тілі HTML-документа досить визначити елемент <div> C ID рівним "alpContent". Модуль завантажиться всередину нього. Ви можете регулювати ширину контейнера для модуля стандартними засобами, проте пам'ятайте що модуль розрахований на роботу при ширині від 600 пікселів. Для секції особистого кабінету потрібно створити свою сторінку, яка буде відрізнятися тільки першим параметром функції alpEngine.loadPage: "office". Адреси сторінок пошуку і особистого кабінету не повинні містити параметрів.

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

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

Це робить неможливим застосування техніки "security through obscurity" (безпеку за рахунок приховування інформації) і підвищує вимога до стійкості коду. По-друге, що більш важливо з точки зору тестування на проникнення, вони обробляють дані, отримані із запитів HTTP-протоколу - протоколу, який може використовувати безліч способів кодування і інкапсуляції інформації.

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

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

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

Приступаючи до тестування web-додатків, необхідно враховувати все перераховане, і повинен застосовуватися методичний процес тестування введення / виведення за схемою "чорного ящика" в поєднанні (якщо можливо) з аудитом вихідного коду.

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

Web-додатки зазвичай взаємодію з користувачем за допомогою елементів форм і змінних GET або POST. У разі використання методу GET все значення, передані додатком можуть бути видні безпосередньо в URL, в той час як у випадку POST-запитів для визначення того, що вводить користувач, часто доводиться вивчити вихідний текст сторінки, що містить форму (або перехопити і декодіроватьзапрос).

HTTP-запит, переданий типовим web-додатком, виглядає наступним чином:

GET / sample.php? Var = val & var2 = val2 HTTP/1.1 | метод REQUEST-URI протокол / версія Session-ID: 361873127da673c | заголовок Session-ID Host: www.webserver.com | заголовок Host <CR> <LF> <CR > <LF> | два перекладу рядка.

Кожен елемент цього запиту потенційно може бути використаний web-додатком, його обрабативающіем. У REQUEST-URI знаходиться адресу програмної одиниці, яка буде запущена для обробки запиту, а також рядок зі списком параметрів - список пар & variable = value, що визначають вхідні параметри. Це основна частина вхідних даних web-додатки. Тема Session-ID містить ідентифікатор сесії, встановленої клієнтом в якості примітивної форми аутентифікації. Тема Host призначений для вибору одного з декількох віртуальних хостів, викорис один і той же IP-адресу, і зазвичай обробляється web-сервером, але може бути доступний і web-додатком.

Тестуючий повинен використовувати всі доступні методи введення даних для досягнення виняткових умов всередині програми. Тобто ви не повинні бути обмежені тим, що надає броузел чи автоматизовані засоби. HTTP-запити дуже легко генеруються за допомогою таких утиліт як curl, або скриптів оболонки, що використовують netcat. Процес вичерпного тестування за методом чорного ящика включає в себе дослідження кожного елемента даних, визначення очікуваного введення, спотворення його, і аналіз результатів роботи програми на предмет виявлення ознак несподіваного поведінки.

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

Проаналізувати відгук на HTTP-запити HEAD і OPTIONS

Заголовок і будь-яка сторінка, повернене запитом HEAD і OPTIONS зазвичай містить рядок SERVER: (або щось аналогічне), в якій міститься інформація про версії web-сервера і, можливо, інформація про оточення або використовуваною операційною системою:

OPTIONS / HTTP/1.0 HTTP/1.1 200 OK Server: Microsoft-IIS/5.0 Date: Wed, 04 Jun 2003 11:02:45 GMT MS-Author-Via: DAV Content-Length: 0 Accept-Ranges: none DASL: < DAV: sql> DAV: 1, 2 Public: OPTIONS, TRACE, GET, HEAD, DELETE, PUT, POST, COPY, MOVE, MKCOL, PROPFIND, PROPPATCH, LOCK, UNLOCK, SEARCH Allow: OPTIONS, TRACE, GET, HEAD, COPY, PROPFIND, SEARCH, LOCK, UNLOCK Cache-Control: private

Дослідити формат і текст інформації про 404-й помилку сервера (та інших)

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

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

Перевірити розпізнавані типи файлів / розширення / каталоги

Багато web-сервери (наприклад Microsoft IIS) по-різному реагують на запити файлів з підтримуваними і невідомими розширеннями. Тестує слід спробувати запросити файли зі стандартними розширеннями, такими як. ASP,. HTM,. PHP,. EXE, і стежити за появою якого-небудь незвичайного результату або кодів помилок.

GET / blah.idq HTTP/1.0 HTTP/1.1 200 OK Server: Microsoft-IIS/5.0 Date: Wed, 04 Jun 2003 11:12:24 GMT Content-Type: text / html <HTML> The IDQ file blah.idq could not be found.