Download as ODP, PPTX
![Пишем код 1: Копипаст сэмпла CGI::Ajax use strict; use CGI; # or any other CGI:: form handler/decoder use CGI::Ajax; my $cgi = new CGI; my $pjx = new CGI::Ajax( ' exported_func ' => \&perl_func ); print $pjx->build_html ( $cgi , \&Show_HTML); sub perl_func { my $input = shift; my $output = $input . " was the input! "; return( $output ); } sub Show_HTML { my $html = <<EOHTML; <HTML><BODY>Enter something: <input type="text" name="val1" id="val1" onkeyup=" exported_func( ['val1'], ['resultdiv'] ); "> <br> <div id="resultdiv"></div> </BODY></HTML> EOHTML return $html ; } Полная инкапсуляция в одном файле ! Модуль автоматизирует: - AJAX-вызовы - Инфраструру AJAX-вызовов - Paзделение Сallback'а и программы](https://image.slidesharecdn.com/saintperl2009cgiajax-091218160531-phpapp01/75/Saint-Perl-2009-CGI-Ajax-demo-10-2048.jpg)
![Пишем код 2: Клиентская часть sub Show_HTML { my $html = <<EOHTML; <HTML><BODY> <script language="JavaScript"> function js_process_func(content) { if (content != document.getElementById('val1').value) document.getElementById('val1').value = content; } </script> <h1>Wave on Perl:</h1> <textarea cols="30" rows="6" name="val1" id="val1" onkeyup=" exported_func( ['val1'], [js_process_func] ); "></textarea> </BODY></HTML> EOHTML return $html ; }](https://image.slidesharecdn.com/saintperl2009cgiajax-091218160531-phpapp01/75/Saint-Perl-2009-CGI-Ajax-demo-11-2048.jpg)
![Пишем код 3: Добавляем БД на сервер our $database = " /tmp/wave_db.txt "; ... # $file_content = get_db_value($file_name); sub get_db_value { open(IN, $_[0] ); my $result = join('', <IN>); close(IN); return $result ; } # save_db_value($file_name, $file_content); sub save_db_value { my ( $database , $content ) = @_; open(OUT, ' > ', $database ); # TODO: Add flock print OUT $content ; close(OUT); } ... sub perl_func { save_db_value( $database , $_[0] ); return (get_db_value( $database )); } Велосипеды и костыли](https://image.slidesharecdn.com/saintperl2009cgiajax-091218160531-phpapp01/75/Saint-Perl-2009-CGI-Ajax-demo-12-2048.jpg)
![Пишем код 4: Добавляем js-таймер my $pjx = new CGI::Ajax( ' exported_func ' => \&perl_func, ' update_func ' => \&update_func, ); ... sub update_func { return (get_db_value( $database )); } ... sub Show_HTML { my $html = <<EOHTML; <HTML><BODY onload=" setTimeout(internal_timer, 1000); "> <script language="JavaScript"> ... function internal_timer() { update_func( ['val1'], [js_process_func] ); setTimeout(internal_timer, 1000); } </script> ... Новое в серверном коде Новое в клиентском коде](https://image.slidesharecdn.com/saintperl2009cgiajax-091218160531-phpapp01/75/Saint-Perl-2009-CGI-Ajax-demo-13-2048.jpg)
More Related Content
Similar to Saint Perl 2009: CGI::Ajax demo
Saint Perl 2009: CGI::Ajax demo
- 1. Построение web-приложения припомощи CGI::Ajax Александр Котов
- 2. Лирическое отступление: чтотакое Perl и для чего он нужен Perl (Перл, тж.: Пёрл) — православный язык программирования, написанный Ларри Уоллом в 1987 году изначально для работы с текстовой документацией. Состоит из РегЭкспов чуть менее, чем полностью. http://lurkmore.ru/Perl Основные применения языка: Обработка данных (РегЭкспы, тексты, логи, ...), системные скрипты Внутренние проекты: Perl как язык-клей, автотестирование, ... Разработка Web-приложений Perl (как правило) не применяется для ...
- 3. Плавно переходим кдокладу Александр Котов – мы используем Perl для ряда внутренних проектов и автоматизации тестирования Это применение Perl №2) Цель доклада Демонстрация возможностей модуля CGI::Ajax А это – применение Perl №3) Целевая аудитория: Люди, имеющие отношение к веб-разработке Любители Google Wave
- 4. Скажите, а причёмздесь Google Wave?!
- 5. Wave на Perlза 20 минут Уже за 1Х минут :) Wave – это Web-приложение Общая БД, совместная работа, AJAX, все дела Вот она, совместная работа: ... Сервер Клиент 1 Клиент 2
- 6. Архитектура AJAX-приложения СерверБаза Данных Главное приложение HTML + JS + ... AJAX engine AJAX callback
- 7. Реализации AJAX наPerl Можно реализовать AJAX ”Классическим” путем Это полезно для понимания технологии AJAX Можно воспользоваться одним из готовых фреймворков Можно воспользоваться одним из модулей CPAN Есть один качественный модуль – CGI::Ajax Нет, это не я его написал, а Brent Pedersen CGI::Ajax должен быть установлен из CPAN Последняя версия на CPAN – это 0.707, октябрь 2008 Главное преимущество модуля – он простой!!! Главный недостаток модуля – он слишком простой...
- 8. Преимущества CGI::Ajax СерверБаза Данных Главное приложение HTML + JS + ... AJAX engine AJAX callback CGI::AJAX
- 9. Архитектура ”Wave Perl0.0001” Сервер CGI::Ajax /tmp/database.txt print <<END; База Данных Wave Браузер Таймер
- 10. Пишем код 1: Копипаст сэмпла CGI::Ajax use strict; use CGI; # or any other CGI:: form handler/decoder use CGI::Ajax; my $cgi = new CGI; my $pjx = new CGI::Ajax( ' exported_func ' => \&perl_func ); print $pjx->build_html ( $cgi , \&Show_HTML); sub perl_func { my $input = shift; my $output = $input . " was the input! "; return( $output ); } sub Show_HTML { my $html = <<EOHTML; <HTML><BODY>Enter something: <input type="text" name="val1" id="val1" onkeyup=" exported_func( ['val1'], ['resultdiv'] ); "> <br> <div id="resultdiv"></div> </BODY></HTML> EOHTML return $html ; } Полная инкапсуляция в одном файле ! Модуль автоматизирует: - AJAX-вызовы - Инфраструру AJAX-вызовов - Paзделение Сallback'а и программы
- 11. Пишем код 2:Клиентская часть sub Show_HTML { my $html = <<EOHTML; <HTML><BODY> <script language="JavaScript"> function js_process_func(content) { if (content != document.getElementById('val1').value) document.getElementById('val1').value = content; } </script> <h1>Wave on Perl:</h1> <textarea cols="30" rows="6" name="val1" id="val1" onkeyup=" exported_func( ['val1'], [js_process_func] ); "></textarea> </BODY></HTML> EOHTML return $html ; }
- 12. Пишем код 3:Добавляем БД на сервер our $database = " /tmp/wave_db.txt "; ... # $file_content = get_db_value($file_name); sub get_db_value { open(IN, $_[0] ); my $result = join('', <IN>); close(IN); return $result ; } # save_db_value($file_name, $file_content); sub save_db_value { my ( $database , $content ) = @_; open(OUT, ' > ', $database ); # TODO: Add flock print OUT $content ; close(OUT); } ... sub perl_func { save_db_value( $database , $_[0] ); return (get_db_value( $database )); } Велосипеды и костыли
- 13. Пишем код 4:Добавляем js-таймер my $pjx = new CGI::Ajax( ' exported_func ' => \&perl_func, ' update_func ' => \&update_func, ); ... sub update_func { return (get_db_value( $database )); } ... sub Show_HTML { my $html = <<EOHTML; <HTML><BODY onload=" setTimeout(internal_timer, 1000); "> <script language="JavaScript"> ... function internal_timer() { update_func( ['val1'], [js_process_func] ); setTimeout(internal_timer, 1000); } </script> ... Новое в серверном коде Новое в клиентском коде
- 14. Оно работает!!! Естькуда расти: Блокировка записи Авторизация Добавление WaveID Мультимедийный контент Свистелки ... PROFIT!
- 15. Бонус: граф вызововСерверный код Клиентский код textarea.onKeyUp() exported_func exported_func js_process_func() internal_timer() update_func update_func js_process_func() textarea.onKeyUp exported_func exported_func js_process_func
- 16. Ссылки http://search.cpan.org/~bpederse/CGI-Ajax-0.707/lib/CGI/Ajax.pm http://cpanratings.perl.org/dist/CGI-Ajaxhttp://2009.yapcrussia.org/saintperl/talk/53 Идея для модуля CPAN: Написать автогенератор графа вызовов для CGI-Ajax Ссылки Спасибо!!!