Веб-технології та веб-дизайн

#6Уставляння додатків з зовнішніх джерел

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

API визначає функціональність, яку надає програма (модуль, бібліотека), при цьому API дозволяє абстрагуватися від того, як саме ця функціональність реалізована. Якщо програму (модуль, бібліотеку) розглядати як чорний ящик, то API - це множина «ручок», які доступні користувачеві даного ящика, які він може повертати.

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

API для сайту - це скрипт, який приймає запити (за методами GET (site.ru / api.php? A = b), POST) і повертає не звичайний HTML для браузерів, а результат запиту у певному форматі (XML , JSON, php serialize ()-ed).

АРІ призначений не для користувачів, а для скрипта зі стороннього сайту / сервісу / програми, який посилає ці GET / POST запити, отримує результат і використовує дані. Запити скріпт надсилає щоб виконати певну дію (наприклад, як дію, яку виконують користувачі сайту через браузер).

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

Онлайнові картографічні сервіси

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

Мультимедійні сервіси

Відео-сервіс YouTube

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

YouTube

Перегляд та поширення відеоматеріалів YouTube

  • На сайті YouTube.com: користувачі можуть завантажувати відео в кількох поширених форматах, в тому числі. Mpeg і. Avi. YouTube автоматично конвертує їх у Flash Video і робить доступними для перегляду в онлайн.
  • За межами YouTube.com: кожне відео супроводжується готовою HTML-розміткою для вставки відео на інші веб-сторінки. Проста техніка CopyPaste зробила поширення відео з YouTube надзвичайно популярним, адже посилання на відео може бути впроваджено в HTML-код любої веб-сторінки.
  • Скачування відео: крім спеціальних сайтів, перетворюють посилання на сторінку з відео в посилання на файли, це дозволяють робити ряд сторонніх додатків (напр., SaveTube) і розширень для браузера (напр., UnPlug або інші розширення для Firefox або доповнення для Opera). Деякі менеджери завантажень також можуть зберігати відео з цього порталу (наприклад Download Master). Є також ряд спеціальних сайтів, які можуть завантажувати відео з YouTube.

Відео-сервіс Vimeo

Vimeo

Vimeo video - це онлайн сервіс, що надає безкоштовні і платні послуги відіохостінгу. Основною перевагою є можливість завантажувати відео ролики високої якості. Сайт належить корпорації InterActiveCorp (IAC), є основним конкурентом YouTube. Не зареєстровані користувачі на сайті можуть лише переглядати відео, додавати і коментувати відеозаписи дозволено після проходження процедури реєстрації.

HTML5 <audio>. Відтворення музики на сайті

Поява тегУ <audio> в HTML5 надало можливості легко відтворювати звук.

На тепер існує 3 вживаних формати для <audio> - оgg, .mp3, wav. Файл з розширенням .оgg буде програватися в Firefox, Opera и Chrome, формат .mp3 або .wav для Internet Explorer і Safari.

HTML5 <video>. Відтворення відео на сайті

Віджети та гаджети

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

Віджети також називають гаджетами, інформерамі, а англійською gadget, badge, module, webjit, capsule, snippet, mini або навіть flake.

Виджеты для сайта: задачи и функции

Веб-віджет (web widget) - це фрагмент коду, який може бути вбудований користувачем в HTML сторінку і використовуватися без значної модифікації. Як правило, при створенні веб-віджетів використовуються технології DHTML, JavaScript і Adobe Flash.

Веб-віджети можна умовно розділити на:

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

Кнопки соціальних мереж

Інформери

Порядок роботи

  1. Ознайомитися з наведеними картографічними та мультимедійними сервісами та можливостями їх АРІ.
  2. Користуючись сервісом Google Maps втілити карту, що відповідає певному місцю: будинок студента, навчальний корпус Львівської політехніки, улюблене кафе чи пімТятка. На карті проставити мітки, прокласти маршрути, змінити фон, схему відображення. Додатково розмістити панорамний перегляд цієї або іншої місцевості.
  3. Ознайомитися з наведеними мультимедійними ресурсами. Відредагувати засобами YouTube власне чи довільне відео. Додати звукове супроводження, зробити нарізку, додати субтитри. Втілити відредаговане відео у відповідну сторінку сайту.
  4. За допомогою тегу <audio> або audio.js додати музичний файл на сайт.
  5. Ознайомитися з іншими технологіями - Vimeo, Онлайн ТВ та кінотеатри. За бажанням додати до сайту відео чи віджет.
  6. Поставити на сторінку кнопки соціальних мереж та інформери.
  7. Протестувати сторінку на різних браузерах та пристроях.
  8. Розмістити тестову сторінку на хостингу. Результат виконання демонструвати в Інтернеті.
  9. Під час виконання роботи робити скріншоти основних етапів роботи. Оформити звіт.

Зміст звіту

  1. Назва та мета виконання лабораторної роботи.
  2. Скріни етапів виконання роботи та результати втілення карт на сторінки. HTML код, що було вставлено на сайт.
  3. Короткий опис редагування відео зі скрінами. HTML код, що було вставлено на сайт.
  4. Короткий опис уставляння аудіо зі скрінами. HTML код, що було вставлено на сайт.
  5. У висновку оцінити зручність використання АРІ картографічних та мультимедійних сервісів та різні можливості уставляння.

Контрольні питання

  1. Для чого розробляються АРІ додатків, яку функціональність вони надають?
  2. Яким чином можна використати сторонній сервіс з доступним АРІ на власному сайті?
  3. В чому переваги картографічних сервісів? Яким чином можна вставити онлайн карту на сайт?
  4. В чому проявляються відмінності різних картографічних сервісів?
  5. Які обмеження у використанні накладено картографічним сервісом GoogleMaps?
  6. Назвіть вагомі відмінності відеохостингів Youtube та Vimeo. Яким чином можна вставити відео з сервісу на користувацький сайт?
  7. На які особливості відтворення аудіо файлів на сайті слід вважати: спосіб уставляння, формати файлів, режими відтворення?
  8. Які особливі елементи присутні в мові HTML5, для уставляння аудіо та відео. Чи цей підхід є зручним?
  9. Особливості уставляння віджетів соціальних мереж на користувацький сайт. Які переваги надає їх наявність
  10. Які послуги надають інформери, як їх можна підключити?
TOP