Разработка интернет-приложений.-2

Министерство наукивысшего

образованияРоссийскойФедерации

Методическиеуказания

выполнениюлабораторныхработ

иорганизациисамостояработыельной

длястудентов

АхтямовЭ

Камильевич

СеменовЕвгенийВалериевич

Разработкаинтернет

-приложений:Методическиеуказания

по

выполнениюлабораторныхработ

иорганизациисамостояработыельной

длястудентовнаправления«

Бизнес-информатика» уровень(

бакалавриата) /

Э.К.

Ахтямов,Е.В .Семенов . – Томск, 2018.

– 37 с.

© АхтямовЭ.К

., 2018

© СеменовЕ.В

., 2018

2

Оглавление

1

Введение ..............................................................................................

4

2

Содержлабораторныхниебот

........................................................

5

2.1.

ЛабораторнаярабП« тастроениеинтернет

- приложения . Разбор

запросаользоватприиспользованииметодовPOSTляGET»

...............

5

2.2.

ЛабораторнаяработаИспользование« гипертпр процесскстовогора

PHP с web-сервером» ...................................................................................

8

2.3.

ЛабораторнаярабС« вебтаздание

- прил с о мощьюжений «1 С

-

Битрикс:Упра»йтомвление

....................................................................

11

2.4.

ЛабораторработаНастройки« информационныхаяблоков»

.. 13

2.5.

ЛабораторнаяработаВерстка« под«1С

- Битрикс : Управлен

иесайтом»и

создшаблонание

– особенности,проблемы» ...........................................

15

2.6.

ЛабораторнаяработаРабота« свключаемымирекламнымиобластями.

Применениешаблонадизайна»

..................................................................

19

2.7.

ЛабораторнаярабС« компонентаздание.Настройкамодуля

универсальногосписка»

.............................................................................

22

2.8.

Лабораторнаяработа«

Переводсайтана«1С

- Битрикс » натехнологию

композитногосайта»

..................................................................................

28

3

Методичеуказаниядляоргансамостояиезацииработыельной

32

3.1.

Общиеположения

..............................................................................

32

3.2.

Прораболекционногоматкаериала

..................................................

32

3.3.

Подготовкалабораторнымработамиофотчетоврмлениек

лабораторнымработам

...............................................................................

33

3.4.

Подготовкаэкзамену

.......................................................................

36

4

Рекомендуемаялитература

................................................................

37

ЦелиизучендисцРазработкаи«яплиныинтернет

-приложений»

состоятвформзнанийпрактрованиинавыкспользованияческих

соврепротоколовтевыхменных,проект,разработкирования

тестировпрограния

ммныхприложен,функционирующихвсетий

Интернет.

Вкачествеклиентскогоприложения

используется

браузер,

установленныйоперационнсистеме.Выполняялаб раторныей

работы,не

используютсякакие

-либоспецифическиеэлементы

разметки

илистилей,поэтому

граничкбраузеруний

предъявляется.

Вкачтекстовогоствередактора

используетсяпрограмма

«Notepad++». Скачатьпоследнверсипрочитатьеюю

ё

описание

можнонасайтеhttp://notepad

-plus-plusМожно.использоватьorg/.

аналогичнуюпрограмму.Еслив

оцессевыполнениялабораторных

работпонадобятсядругиепрограммные,одуктытообэтомбудет

сказано.

файл,сименемemailпользователя,

атакже реализуемпроверкуна

верностьвведенногоemail

.

Порядвыполненияк

лабораторнойработы

Создадгостевуюкнсохримгуказаждойнением

писивотдельный

файл,сименемemailпользоват,реализуемпроверкунаверностьля

введенногоemailобязательноезнакаличие( точки@,также

минимумодс домвол@,ежду@и2точкой,иот2

-хдосимвола6

послезнакаточки).

Рисунок1

– Отрывок php-кода

Здесьмыдобавляемновуюзаписьфайлреагируем( нажатие

кнопкиДобавить« »).

Перваястрокаговорит,чтодаследуетphp

-код,затеммы

присваиваемпеременнойactionзначениеPOST

-запросаараметраaction.

Строкис 4

-йповыполняются28 толькоеслиусненяетсяовие

пустотыпеременнойactionстьамогоPOST(

-запроса).

Строки4, 5, 6

– получениеизPOST

-запросаимени,почтытекст

а

сообщенияпользователя.

8, 10, 12 – обрезаемимя,почтусообщениедо50,102450

симвсоответственнолов.

9, 11, 14 – преобразуемспецимволальнHTMLые

-сущности

(своегородазащита,чтобыликвидироваозможностьредак ирования

кодачерезсообщ

ение),кпримерузнакзаменит< на<

6

nl2br (15-ястрока)

– передкаждымразрывомстрокивставляет

символ<br />

16, 17 – удаляемразрывыст( окезультатесообщбудидтиние

однойстрокойтега<brвместахразрываи/>строк).

19 – создаемфайлв

папкеrecoсименемrвремяdsecсекундах. [,

прошедшеес01.01.1970 00:00].txt

20, 21, 22 – записываемэтотфайлимя,почтусообщение,на

первую,втои строкиуюсоответственноью,затемзакрываемфайл

(23).

25, 26, 27 – обновляемстраницу.

Далеееслизапросactionпу(30т

-ястрока).е.мы(простозашлина

страницу,безотправкиPOST

-запроса),выполнитсяосновнойHTMLкод

самойгостевойкниги.Заканчиваемphp

-код(31 -ястрока),ипишемhtml

38-52строки

–

скриптдляпроверкипра ильностивода

email,

вызываетсяприотпусканкнопкисобыт( onKeyUp)вполеввода

почты(59

-ястрока),вкачествепарамперто,ечтодаетсяужеравведено

вкачествеemail.

Строка40

– присваиваемпеременнойэлементIDдляудобства1 (

обращениякнему, 1

– idкно пкиДобавить« »)

Строка41

– присваиваемпеременнойreрегулярноевыражение.

42 – еслитрокаemailнашпереданныйпараметр()соответствует

регулярномувыражению,делаемкнопкуДобав«»актиивнойть

элементус ID=asdменяемсвойство

CSS рамкинастандартну

ю,иначе

(еслинесоответствуетрегулярномувыраже)деакнтиопкувируемю

«Добавить»сделкрраснуюемвополяквводаругemail.

Рисунок2

– Продолжениеотрывка

php-кода

Дляобязательноговводаименисообщенияспользупараметрся

requiredстр ( оки56, 58, 60).

Дадвыводалееявсехранеедобавленныхсообщенийнеобходимо

организоватьциклдля(повторенияhtml

-кодавыводаодногосообщения).

2.2. Лабораторнаяработа

«Использованиегипертекстового

препроцессора PHP с web-сервером»

Цель работы

Научитьсянапримереконкретнойсистемыупрсавлениятом

использоватьгипертпрепроцессоркстовый

PHP с web-сервером.

Порядвыполненияк

лабораторнойработы

СточкизренияС1

-Битриксшаблон

– этовнешнийвидсайта,

котоопррасположеомеделяетсяразличныие

хэлеменнасайте, ов

художественныйстильспособотображениястраниц.Включаетсявсеб

программныйhtml

-код,графичеэлементы,таблск,илейцы

дополнительфайлыдляотображенияконтента.Можетыевключать

себяшаблоныкомпонентов,шаблготовных

страницсниппеты.

Длятого,чтобыинтегриршаблонвCMS,перделоватьпапкеым

/bitrix/templates/раздел,названиекоторогобудиспользоваться

качествешаблонаID.Например, MyTemplateДалеевкачествеID .

шаблонабудетиспользименноэт ваться

название.Тепапкуерь

MyTemplateнеобхперенеобщиедиморесурсы,такиетикак

изобр, фcssа. женияфайлыjs,шрифты.Есливва аблонеем

используютсяспецифическиешрифты, файлыjs,тоихпереносить

нужно.

Послеподготовительныхперациймож

ноперейтиксозданию

HTMLкаркасашабл.Шсостоитблоннаизнесколькихчастей,такихкак

header,иfooter#WORK._AREA#

Поокончанформструктурыи,рованияювасдолжнополучиться

папкефайла3. Header.php

- внемнаходитсяшапкашаблона, footer.php

–

подвалшабиIndexона.php

– оставшийсякод,.е.контентшаблона.

ДобавлэлементовС1 ие

-Битрикс

Дляначаланужнодобавитьп дключениепрологаязыковых

файл.Этонужнодлятогов,чтобыпользователь,неявляющийся

администраторомсайта,несмп лучиг

тьдоступкфайлам.Это

необходимосделатькаквheaderтаквfooter.php,.php:

Посленеобходимозадатьотноситпутьквсфайламельный

шаблонакартинкам(, css

-файлам, js

-файлам,шрифтам)Функция.

<?=SITEзадаетпуTEMPLATE_PATH?>

тькшаблонуотносительно

корнясайта.

Добавимвызовфункции$APPLICATION

->ShowHead();,к

оторая

служитсразунескоцелямвчастностиькдинам(

ческому

подключенCSSибиблиотекJ ,объявленныхюкомпонентахтеле

страницпомощьюотложенныхфункцийвзаголовке,так

объедисжэтибняблиотекима, слииспользуется

соответствующаянастройкаС1

-Битрикс).