"स्मार्ट होम" अपने हाथों से। भाग 4. हम वेब इंटरफेस को व्यवस्थित करते हैं

पिछले लेख में, हमने अपने "स्मार्ट होम" सिस्टम को यह सिखाने में सक्षम किया था कि हमने क्या कहा और Google का उपयोग करके ध्वनि प्रतिक्रियाओं को संश्लेषित किया।
आज मैं बताना चाहता हूं कि वेब इंटरफेस के माध्यम से हमारे सिस्टम तक पहुंच कैसे व्यवस्थित करें।

प्रौद्योगिकी के

जैसा कि आपको याद है, हम अपने "स्मार्ट होम" के प्रबंधन के लिए पर्ल सॉफ्टवेयर लिखते हैं। एक डेटाबेस के बिना एक आधुनिक सूचना प्रणाली लगभग अकल्पनीय है। हम भी एक तरफ खड़े नहीं होंगे और अपने डेटा को स्टोर करने के लिए MySQL DBMS का उपयोग करेंगे। वेब सर्वर को लागू करने के लिए, मैंने तृतीय-पक्ष सॉफ़्टवेयर का उपयोग नहीं करने का निर्णय लिया, लेकिन पर्ल के लिए मॉड्यूल - HTTP :: सर्वर :: सरल , विशेष रूप से - HTTP :: सर्वर :: सरल :: CGI । मैंने ऐसा क्यों किया? अधिकांश भाग के लिए, हित के लिए;) लेकिन सिद्धांत रूप में, आप अपाचे / mod_perl परिसर को जमा किए बिना HTTP अनुरोधों / प्रतिक्रियाओं के निम्न-स्तरीय प्रसंस्करण तक पहुंच सकते हैं। सामान्य तौर पर, अगर आपके पास इच्छा और पर्याप्त समय है तो कुछ भी आपको प्रोजेक्ट को अपाचे पर ले जाने से नहीं रोकता है।

डेटाबेस

सबसे पहले, MySQL DBMS स्थापित करें और db.sql से तालिकाओं के साथ एक डेटाबेस बनाएं। यहाँ लिस्टिंग है:

CREATE DATABASE ion; USE ion; # # Table structure for table 'calendar' # DROP TABLE IF EXISTS calendar; CREATE TABLE `calendar` ( `id` int(15) NOT NULL AUTO_INCREMENT, `date` datetime NOT NULL, `message` text, `nexttimeplay` datetime NOT NULL, `expired` datetime NOT NULL, `type` int(1) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM DEFAULT CHARSET=latin1; # # Table structure for table 'commandslog' # DROP TABLE IF EXISTS commandslog; CREATE TABLE `commandslog` ( `id` int(15) NOT NULL AUTO_INCREMENT, `date` datetime NOT NULL, `cmd` varchar(255) NOT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=latin1; # # Table structure for table 'log' # DROP TABLE IF EXISTS log; CREATE TABLE `log` ( `id` int(15) NOT NULL AUTO_INCREMENT, `date` datetime NOT NULL, `message` varchar(255) NOT NULL, `level` int(1) DEFAULT NULL, PRIMARY KEY (`id`) ) ENGINE=MyISAM AUTO_INCREMENT=1 DEFAULT CHARSET=latin1; 

हम आवश्यक कार्य करते हैं:

nix@nix-boss:~$ sudo apt-get install mysql-server
nix@nix-boss:~$ mysql -uroot -ppassword < db.sql


कोड को संशोधित करें

अब हमें lib , html और कॉन्फिग फोल्डर ( डेटा फोल्डर के बगल में) बनाने की आवश्यकता है। Lib फ़ोल्डर में, हम वेब सर्वर को लागू करने और हमारे HTTP अनुरोधों को संसाधित करने के लिए जिम्मेदार मॉड्यूल डालते हैं।

हमें srv.pl स्क्रिप्ट को थोड़ा मोड़ना होगा । प्रारंभ ब्लॉक में जोड़ें:

 our %cfg = readCfg("common.cfg"); our $dbh = dbConnect($cfg{'dbName'}, $cfg{'dbUser'}, $cfg{'dbPass'}); 

आरंभिक ब्लॉक के नीचे HTTP सर्वर शुरू करने के लिए जिम्मेदार लाइनें जोड़ें:

 ##  HTTP- ################################ my $pid = lib::HTTP->new($cfg{'httpPort'})->background(); print "HTTP PID: $pid\n"; logSystem(" HTTP - PID: $pid, : $cfg{'httpPort'}, : $cfg{'httpHost'}", 0); ################################ 

अब फ़ाइल के अंत में लापता फ़ंक्शंस जोड़ें:

 sub readCfg { my $file = shift; my %cfg; open(CFG, "<config/$file") || die $!; my @cfg = <CFG>; foreach my $line (@cfg) { next if $line =~ /^\#/; if ($line =~ /(.*?) \= \"(.*?)\"\;/) { chomp $2; $cfg{$1} = $2; } } close(CFG); return %cfg; } ######################################## sub dbConnect { my ($db, $user, $pass) = @_; return $dbh = DBI->connect("DBI:mysql:$db", $user, $pass) || die "Could not connect to database: $DBI::errstr"; } ######################################## sub logSystem { my ($text, $level) = @_; my %cfg = readCfg("common.cfg"); dbConnect($cfg{'dbName'}, $cfg{'dbUser'}, $cfg{'dbPass'}); $dbh->do("INSERT INTO log (date, message, level) VALUES (NOW(), '$text', $level)"); } 

जैसा कि आप कार्यों के नाम से देख सकते हैं, dbConnect () लॉगिंग के लिए हमारे DBMS, logSystem () से कनेक्ट करने के लिए जिम्मेदार है, कॉन्फ़िगरेशन को लोड करने के लिए readCfg ()। आइए हम इस पर अधिक विस्तार से ध्यान दें। कॉन्फ़िगरेशन कॉन्फ़िगरेशन निर्देशिका में एक साधारण पाठ फ़ाइल है। हमारे मामले में, इसे सामान्य कहा जाता है। यह कुछ इस तरह दिखता है:

 ##  daemonMode = "undef"; logSystem = "1"; logUser = "1"; dbName = "ion"; dbUser = "root"; dbPass = "password"; camNumber = "4"; camMotionDetect = "1"; httpPort = "16100"; httpHost = "localhost"; telnetPort = "16000"; telnetHost = "localhost"; micThreads = "5"; 

इसमें कुछ पंक्तियों का उपयोग बाद में किया जाएगा। अब तक, हम केवल db उपसर्ग के साथ शुरू होने वाली लाइनों में रुचि रखते हैं। जैसा कि हम देखते हैं, ये हमारे डेटाबेस से जुड़ने की सेटिंग हैं।

अब मैं कई कमांड निष्पादन पर काबू पाने के बारे में बात करूँगा। फ़ंक्शन को संपादित करें cmcmd () :

 sub checkcmd { my $text = shift; chomp $text; $text =~ s/ $//g; print "+OK - Got command \"$text\" (Length: ".length($text).")\n"; if($text =~ //) { ################################################# my $sth = $dbh->prepare('SELECT cmd FROM commandslog WHERE DATE_SUB(NOW(),INTERVAL 4 SECOND) <= date LIMIT 0, 1'); $sth->execute(); my $result = $sth->fetchrow_hashref(); if($result->{cmd} ne "") { return; } $dbh->do("INSERT INTO commandslog (date, cmd) VALUES (NOW(), '$text')"); ################################################# if($text =~ //) { my $up = `uptime`; $up =~ /up (.*?),/; sayText("   - $1.    - $parent."); } if($text =~ //) { my $up = `uptime`; $up =~ /(.*?) up/; sayText(" $1"); } if($text =~ // || $text =~ //) { sayText(" .  !"); system("killall motion"); system("rm ./data/*.flac && rm ./data/*.wav"); system("killall perl"); exit(0); } if($text =~ //) { my ($addit, $mod); my %wh = lib::HTTP::checkWeather(); $wh{'condition'} = Encode::decode_utf8( $wh{'condition'}, $Encode::FB_DEFAULT ); $wh{'hum'} = Encode::decode_utf8( $wh{'hum'}, $Encode::FB_DEFAULT ); $wh{'wind'} = Encode::decode_utf8( $wh{'wind'}, $Encode::FB_DEFAULT ); if($wh{'temp'} < 0) { $mod = " "; } if($wh{'temp'} > 0) { $mod = " "; } $wh{'wind'} =~ s/: ,//; $wh{'wind'} =~ s/: ,//; $wh{'wind'} =~ s/: ,//; $wh{'wind'} =~ s/: ,//; $wh{'wind'} =~ s/: ,/-/; $wh{'wind'} =~ s/: ,/-/; $wh{'wind'} =~ s/: ,/-/; $wh{'wind'} =~ s/: ,/-/; sayText(" $wh{'condition'}, $wh{'temp'}  $mod. $wh{'hum'}. $wh{'wind'}"); if ($wh{'temp'} <= 18) { $addit = sayText(" ,   !"); } if ($wh{'temp'} >= 28) { $addit = sayText("   !"); } } } #sayText("  - $text"); return; } 

हम चार सेकंड के अंतराल में निष्पादित अंतिम कमांड का चयन करते हैं और यदि यह वर्तमान के साथ मेल खाता है, तो हम फ़ंक्शन से बाहर निकलते हैं। जैसा कि आप देख सकते हैं, मैंने पिछले लेख में वर्णित फ़ंक्शन की तुलना में कुछ कमांड जोड़े। सबसे दिलचस्प मौसम है। उसके लिए डेटा प्राप्त करने का कार्यान्वयन थोड़ा कम है।

HTTP.pm मॉड्यूल

एम्बेडेड HTTP सर्वर के कार्यान्वयन पर वापस जाएं। Lib निर्देशिका में HTTP.pm फ़ाइल बनाएँ। हम निम्नलिखित कोड वहां लिखते हैं:

 package lib::HTTP; use HTTP::Server::Simple::CGI; use LWP::UserAgent; use URI::Escape; use base qw(HTTP::Server::Simple::CGI); use Template; ######################################### ######################################### our %dispatch = ( '/' => \&goIndex, '/index' => \&goIndex, '/camers' => \&goCamers, ); our $tt = Template->new(); ######################################### ######################################### sub handle_request { my $self = shift; my $cgi = shift; my $path = $cgi->path_info(); my $handler = $dispatch{$path}; if ($path =~ qr{^/(.*\.(?:png|gif|jpg|css|xml|swf))}) { my $url = $1; print "HTTP/1.0 200 OK\n"; print "Content-Type: text/css\r\n\n" if $url =~ /css/; print "Content-Type: image/jpeg\r\n\n" if $url =~ /jpg/; print "Content-Type: image/png\r\n\n" if $url =~ /png/; print "Content-Type: image/gif\r\n\n" if $url =~ /gif/; print "Content-Type: text/xml\r\n\n" if $url =~ /xml/; print "Content-Type: application/x-shockwave-flash\r\n\n" if $url =~ /swf/; open(DTA, "<$url") || die "ERROR: $! - $url"; binmode DTA if $url =~ /jpg|gif|png|swf/; my @dtast = <DTA>; foreach my $line (@dtast) { print $line; } close(DTA); return; } if (ref($handler) eq "CODE") { print "HTTP/1.0 200 OK\r\n"; $handler->($cgi); } else { print "HTTP/1.0 404 Not found\r\n"; print $cgi->header, $cgi->start_html('Not found'), $cgi->h1('Not found'), $cgi->h2($cgi->path_info()); $cgi->end_html; } } ##   / ######################################## sub goIndex { my $cgi = shift; # CGI.pm object return if !ref $cgi; my %w = checkWeather(); my $cmd; my $dbh = iON::dbConnect($iON::cfg{'dbName'}, $iON::cfg{'dbUser'}, $iON::cfg{'dbPass'}); my $sth = $dbh->prepare('SELECT cmd FROM commandslog WHERE id > 0 ORDER BY id DESC LIMIT 0, 1'); $sth->execute(); my $result = $sth->fetchrow_hashref(); if($result->{cmd} ne "") { $cmd = $result->{cmd}; } else { $cmd = " ..."; } print "Content-Type: text/html; charset=UTF-8\n\n"; my $uptime = `uptime`; $uptime =~ /up (.*?),/; $uptime = $1; my $videosys = `ps aux | grep motion`; if ($videosys =~ /motion -c/) { $videosys = "<font color=green></font>"; } else { $videosys = "<font color=red> </font>"; } my $micsys = `ps aux | grep mic`; if ($micsys =~ /perl mic\.pl/) { $micsys = "<font color=green></font>"; } else { $micsys = "<font color=red> </font>"; } my $vars = { whIcon => $w{'icon'}, whCond => $w{'condition'}, whTemp => $w{'temp'}, whHum => $w{'hum'}, whWind => $w{'wind'}, cmd => $cmd, uptime => $uptime, video => $videosys, mic => $micsys, threads => $iON::cfg{'micThreads'}, }; my $output; $tt->process('html/index', $vars, $output) || print $tt->error(), "\n"; } ##   /camers ######################################## sub goCamers { my $cgi = shift; # CGI.pm object return if !ref $cgi; my %w = checkWeather(); my $cmd; my $dbh = iON::dbConnect($iON::cfg{'dbName'}, $iON::cfg{'dbUser'}, $iON::cfg{'dbPass'}); my $sth = $dbh->prepare('SELECT cmd FROM commandslog WHERE id > 0 ORDER BY id DESC LIMIT 0, 1'); $sth->execute(); my $result = $sth->fetchrow_hashref(); if($result->{cmd} ne "") { $cmd = $result->{cmd}; } else { $cmd = " ..."; } if($cgi->param("text") ne "") { my $txt = $cgi->param('text'); require Encode; $txt = Encode::decode_utf8( $txt, $Encode::FB_DEFAULT ); iON::sayText($txt); } print "Content-Type: text/html; charset=UTF-8\n\n"; my $vars = { camera1 => 'video-0/camera.jpg', camera2 => 'video-1/camera.jpg', camera3 => 'video-2/camera.jpg', camera4 => 'video-3/camera.jpg', whIcon => $w{'icon'}, whCond => $w{'condition'}, whTemp => $w{'temp'}, whHum => $w{'hum'}, whWind => $w{'wind'}, cmd => $cmd, }; my $output; $tt->process('html/camers', $vars, $output) || print $tt->error(), "\n"; } ##  ######################################## sub checkWeather { my %wh; my $ua = LWP::UserAgent->new( agent => "Mozilla/5.0 (Windows NT 5.1; ru-RU) AppleWebKit/535.2 (KHTML, like Gecko) Chrome/15.0.872.0 Safari/535.2"); my $content = $ua->get("http://www.google.com/ig/api?hl=ru&weather=".uri_escape("-")); $content->content =~ /<current_conditions>(.*?)<\/current_conditions>/g; my $cond = $1; $cond =~ /<condition data="(.*?)"/g; $wh{'condition'} = $1; $cond =~ /temp_c data="(.*?)"/g; $wh{'temp'} = $1; $cond =~ /humidity data="(.*?)"/g; $wh{'hum'} = $1; $cond =~ /icon data="(.*?)"/g; $wh{'icon'} = $1; $cond =~ /wind_condition data="(.*?)"/g; $wh{'wind'} = $1; return %wh; } ######################################### ######################################### 1; 

आइए सामग्री का अधिक विस्तार से विश्लेषण करें। % प्रेषण हैश में, हम URL और फ़ंक्शन को कॉल किए जाने से मेल खाते हैं। इस हैश में वर्णित सभी अन्य URL 404 पृष्ठ नहीं लौटाएंगे।
एक शक्तिशाली और लचीला टेम्प्लेट टूलकिट लाइब्रेरी हमारा टेम्प्लेट इंजन होगा। हम इसे लाइन से आरंभ करते हैं:

 our $tt = Template->new(); 

मूल वर्ग के handle_request () फ़ंक्शन को ओवरलोड करने पर, हम HTTP सर्वर पर अनुरोधों के प्रसंस्करण पर नियंत्रण प्राप्त करते हैं। ब्राउज़र को स्थिर सामग्री (png, gif, jpg, css, xml, swf) देने के लिए, ब्लॉक का उपयोग करें:

  if ($path =~ qr{^/(.*\.(?:png|gif|jpg|css|xml|swf))}) { my $url = $1; print "HTTP/1.0 200 OK\n"; print "Content-Type: text/css\r\n\n" if $url =~ /css/; print "Content-Type: image/jpeg\r\n\n" if $url =~ /jpg/; print "Content-Type: image/png\r\n\n" if $url =~ /png/; print "Content-Type: image/gif\r\n\n" if $url =~ /gif/; print "Content-Type: text/xml\r\n\n" if $url =~ /xml/; print "Content-Type: application/x-shockwave-flash\r\n\n" if $url =~ /swf/; open(DTA, "<$url") || die "ERROR: $! - $url"; binmode DTA if $url =~ /jpg|gif|png|swf/; my @dtast = <DTA>; foreach my $line (@dtast) { print $line; } close(DTA); return; } 

चूंकि मुझे कुछ MIME प्रकार मिले, इसलिए मैंने उन्हें थोड़ा हिंदू लिखा;)
इसके बाद विशिष्ट URL की सामग्री तैयार करने के लिए जिम्मेदार कार्य आते हैं। जबकि उनमें से केवल दो हैं - एक सूचकांक और कैमरों के साथ एक पृष्ठ।
इंडेक्स पर, हम देख सकते हैं कि क्या सबसिस्टम जैसे वीडियो और ऑडियो कैप्चर काम करते हैं। एक अलग लाइन है:

 my %w = checkWeather(); 

यह फ़ंक्शन शहर में वर्तमान मौसम डेटा के साथ एक हैश देता है, जो हमारे पृष्ठ पर प्रदर्शित किया जाएगा। इस तरह के एक छोटे से अच्छे बन;)
पास में, हम "स्मार्ट होम" के लिए अंतिम प्राप्त और मान्यता प्राप्त कमांड का उत्पादन करेंगे।

अगला फ़ंक्शन goCamers () इंडेक्स के समान कार्य करता है, लेकिन उप-प्रणालियों की स्थिति के बारे में जानकारी प्रदर्शित करने के बजाय, यह हमारे कैमरों से एक छवि दिखाता है और कुछ पाठ लिखना संभव है जो हमारे "स्मार्ट होम" के साथ संश्लेषित और आवाज करेगा।

सभी पेज html फोल्डर में टेम्प्लेट पर आधारित हैं। यहां लिस्टिंग अपलोड करना सुविधाजनक नहीं होगा, इसलिए मैं आर्काइव - html.zip का लिंक दूंगा ।

कुल मिलाकर

सभी परिवर्तनों के बाद, हमें पोर्ट 16100 पर एक अच्छी तरह से काम करने वाला वेब इंटरफ़ेस मिलेगा, जो अब आपको "स्मार्ट होम" सबसिस्टम, वेबकैम से डेटा, और आपके द्वारा दर्ज किए गए टेक्स्ट को आवाज देने की स्थिति देखने देगा। भविष्य में, हम इसमें एक और, अधिक महत्वपूर्ण कार्यक्षमता जोड़ेंगे।

अगले लेख में मैं एक्स 10 उपकरणों के साथ काम करने और उन्हें हमारे स्मार्ट होम सिस्टम में एकीकृत करने के बारे में बात करूंगा।

अद्यतन : जारी रखा