JavaScript і CGI

Оригінал: https://staff.washington.edu/larryg/Classes/R521/zz-cgi.html

JavaScript і CGI — це взаємодоповнюючі системи, які дозволяють створювати складні веб-сторінки та керувати ними. Ось порівняння їх властивостей:

• Що це таке: JavaScript — це особлива мова з визначеним синтаксисом, який особливо підходить для роботи з багатьма елементами, які складають веб-сторінку. CGI (Common Gateway Interface) на противагу — це взагалі не мова: скоріше це протокол, який забезпечує двосторонній зв’язок між клієнтом веб-сторінки та сервером. Для реалізації програми CGI можна використовувати майже будь-яку мову, наприклад Perl, сценарії оболонки, C, C++ або Java.
• Де вони знаходяться: хоча JavaScript може працювати будь-де, JavaScript, про який тут йдеться, є програмою на стороні клієнта. Зазвичай він міститься у вашому HTML-коді, укладеному в спеціальні теги, або обробники подій, приєднані до тегів HTML FORM. Програми CGI, з іншого боку, працюють на сервері і зазвичай активуються, при кліку на кнопку ВІДПРАВИТИ (SUBMIT), щоб надіслати форму для обробки програмою CGI.
• Для чого вони корисні: JavaScript чудово розроблений для навігації та керування вмістом і структурою веб-сторінок. Оскільки він знаходиться на стороні клієнта, відповідь надається негайно, без затримок. Якщо пов’язаний HTML є динамічним HTML, JavaScript може повністю та швидко контролювати майже кожен аспект цієї сторінки в реальному часі. Однак JavaScript суворо обмежений у джерелах і адресатах своєї інформації. Він не може нічого читати з сервера (за винятком зображень і програм JavaScript) або з клієнтської машини ПК (за винятком файлів cookie), а також не може нічого писати чи змінювати на серверних або клієнтських пристроях (крім файлів cookie).Навпаки, програми CGI можуть робити на сервері все, що може робити будь-яка інша програма користувача, за винятком певних обмежень, накладених веб-адміністраторами. Таким чином, він може отримати доступ до більшості змінних середовища на сервері, може читати, записувати, маніпулювати та знаходити інформацію про файли чи процеси, а також може запускати будь-які програми, такі як графічні програми або програми бази даних, які знаходяться на сервері.
• Як вони працюють: програми JavaScript майже завжди вбудовані в сценарій HTML. Вони зберігаються на сервері, доки їх не викликають через URL-адресу, яка завантажує HTML і пов’язаний код JavaScript у браузер на клієнтській машині. Відтоді вони діють виключно на клієнта. Якщо JavaScript міститься в заголовку чи тілі HTML і не складається виключно з функцій, він починає працювати одразу після завантаження. Це може спричинити проблему, якщо він посилається на змінні або функції, оголошені в областях, які ще не завантажено. У більшості випадків, однак, JavaScript в основному складається з функцій, які або викликаються після завершення завантаження, або запускаються обробниками подій у відповідь на певну дію користувача.Програми CGI, з іншого боку, завжди живі та працюють на сервері. Зазвичай вони викликаються надсиланням форми, наприклад: ...  < FORM METHOD="POST" ACTION="my.cgi" >  ...  < INPUT TYPE=submit >  < /FORM > користувач натискає кнопку ВІДПРАВИТИ, вміст форми надсилається програмі «my.cgi» на сервері. Як правило, програма CGI викликає бібліотеку та зчитує пари ім’я-значення форми в асоціативний масив, наприклад:#!/usr/local/bin/perl # require 'cgi-lib.pl'; &ReadParse(*in); . . . це початок типової CGI-програми, написаної на Perl, яка читає вихідні дані форми та зберігає пари ім’я-значення в асоціативному масиві з іменем «in» (у цьому випадку). Потім програма використовує ці значення для доступу до файлів чи інших об’єктів на сервері, зміни або маніпулювання ними, а потім зазвичай створює та надсилає вихідні дані HTML назад клієнту. Типовою послідовністю може бути:
  • HTML (можливо, із вбудованим JavaScript) завантажується з сервера на клієнт
  • Деякий код JavaScript може виконуватися на клієнті
  • Користувач заповнює форму та натискає «ВІДПРАВИТИ».
  • Інформація форми надсилається до програми CGI на сервері
  • Програма CGI аналізує інформацію форми та виконує будь-які необхідні операції, маніпуляції з файлами тощо
  • Потім програма CGI записує деякий HTML (можливо, із вбудованим JavaScript) у формі документа. HTML і JavaScript можуть бути або не збігатися з оригінальним HTML/JavaScript.
  • Потім ця інформація передається клієнту, а отриманий код HTML/JavaScript виконується на клієнті.
  • Таким чином, коли використовуються сценарії CGI, між клієнтом і сервером відбувається зворотний рух. Приклад: ось приклад, який поєднує програми JavaScript і CGI. Він дозволяє користувачеві додавати, змінювати або видаляти інформацію в дуже простій базі даних, що складається з імен і номерів телефонів, і працює таким чином:
    • Коли URL викликається, він зчитує HTML-файл, що містить код JavaScript, у клієнтському браузері
    • HTML містить форму, яку потрібно заповнити, і код JavaScript, який дає змогу перевірити імена та номери телефонів на дійсний синтаксис (у цій спрощеній моделі ми лише перевіряємо, чи імена складаються з двох або трьох рядків символів без пунктуації та телефонні номери мають вигляд: aaa-ppp-nnnn, де «aaa» — 3-значний код міста, «ppp» — 3-значний префікс, а «nnnn» — 4-значний номер).Якщо користувач натискає кнопку «радіо», щоб перевірити значення імені та телефону, він отримує підтвердження або повідомлення про помилку, яке видається на екрані «Попередження», створеному програмою JavaScript.
    • Якщо користувач натискає «ВІДПРАВИТИ», форма надсилається до програми CGI, яка виконує операції, зазначені у формі, наприклад додавання, видалення або змінення інформації в базі даних на сервері.
    • Коли це буде зроблено, програма CGI записує «тут документ», який містить оригінальні програми HTML і JavaScript, а також деякі додаткові JavaScript, які показують повідомлення «Попередження», яке показує, що особу/номер телефону було додано, видалено або змінено.
    • «Документ тут», якому передує спеціальний заголовок, який інформує браузер клієнта очікувати HTML-код, відображається та виконується.

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