ajaxperlasterisk

I'm not able to execute a Perl script inside Ajax


I have a set of Ajax code. That code calls a Perl script and that script has some functionality. Whenever I click on the 'Dial' button, the Perl script should be run, but I'm not able to run script. When I click on the dial button, my complete Perl program is showing on the Web. On the other hand, when I executed my program forcefully, it executed properly.

HTML code

<!CTYPE html>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<body>

<title>Outbound Calling Demo Site</title>
<script language="Javascript">

    function doDial(phone)
    {
        var phone_no = document.getElementById('phone').value;
        //alert(phone_no);

        var ajaxRequest;  // The variable that makes Ajax possible!

        if (window.XMLHttpRequest)
        { // Opera 8.0+, Firefox, Safari
            ajaxRequest = new window.XMLHttpRequest();
        }
        else
        {
            try {
                ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP.6.0");
            }
            catch (e) {}
            try { ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
            catch (e) {}
            try { ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP"); }
                catch (e) {}
            throw new Error("This browser does not support XMLHttpRequest.");
        }

        // Create a function that will receive data
        // sent from the server and will update
        // div section in the same page.
        //
        function handler()
        {
            if (ajaxRequest.readyState == 4 &&
                ajaxRequest.status == 200)
            {
                document.getElementById("ajaxDiv").innerHTML = ajaxRequest.responseText;
            }
        }

        var queryString = "?phone=" + phone_no;
        get_selected_data(document.getElementById('agent'));

        if(ajaxRequest != null)
        {
            ajaxRequest.open("POST", "dial_call2.pl" + queryString, true);
            ajaxRequest.onreadystatechange = handler;
            //console.log(queryObj.fund);
            ajaxRequest.send(null);
        }
        else
        {
            window.console.log("AJAX (XMLHTTP) not supported.");
        }
    }
</script>

<table>
    Number to dial: <input class="text_box" name="phone" type="text" id="phone"  size="14" value="" />
    <input type="button" value="Dial" onClick="javascript:doDial();"/>
    <div id='ajaxDiv'></div>

    <tr>
           <td><input type="button" name="dtmf1" value='1'  id="dtmf1" onClick="sendDTMF(1);"/></td>
           <td><input type="button" name="dtmf2" value='2'  id="dtmf2" onClick="sendDTMF(2);"/></td>
           <td><input type="button" name="dtmf3" value='3'  id="dtmf3" onClick="sendDTMF(3);"/></td>
    </tr>

    <tr>

           <td><input type="button" name="dtmf4" value='4' id="dtmf4" onClick="sendDTMF(4);"/></td>
           <td><input type="button" name="dtmf5" value='5' id="dtmf5" onClick="sendDTMF(5);"/></td>
           <td><input type="button" name="dtmf6" value='6' id="dtmf6" onClick="sendDTMF(6);"/></td>
    </tr>

    <tr>
           <td><input type="button" name="dtmf7" value='7' id="dtmf7" onClick="sendDTMF(7);"/></td>
           <td><input type="button" name="dtmf8" value='8' id="dtmf8" onClick="sendDTMF(8);"/></td>
           <td><input type="button" name="dtmf9" value='9' id="dtmf9" onClick="sendDTMF(9);"/></td>
    </tr>

    <tr>
           <td><input type="button" name="dtmf*" value='*' id="dtmf*" onClick="sendDTMF(this.value);"/></td>
           <td><input type="button" name="dtmf0" value='0' id="dtmf0" onClick="sendDTMF(0);"/></td>
           <td><input type="button" name="dtmf#" value='#' id="dtmf#" onClick="sendDTMF(this.value);"/></td>
    </tr>

    <tr>
           <td><input type="button" name="dtmfClr" value="Clr" onClick="number_clear(this.value);"/></td>
           <td><input type="button" name="dtmfC" value="C" onClick="number_c(this.value);"/></td>
    </tr>

</table>

<tr>
    <th>
        <td><input type="button" id="hangup" value="Hangup" onClick="javascript:doHangup();"/></td>
        <td><input type="button" id="unregister" value="Unregister" onClick="javascript:doUnregister();"/></td>
        <td><input type="button" id="answer" value="Answer Call" onClick="javascript:doAnswer();" style="visibility:hidden;"/><br/></td>
    </th>
</tr>

</form>
</body>
</html>

Perl code

#!/usr/bin/perl

use strict;
use CGI;
my $cgi = new CGI;
use CGI::Carp qw(fatalsToBrowser);
use IO::Socket;

print $cgi->header();
print $cgi->start_html('Asterisk Caller');
print '<center><p>call</p>';

my ($request, @phone_no, $phone_no);
if ($ENV{'REQUEST_METHOD'} eq "GET")
{
    $request = $ENV{'QUERY_STRING'};
}
elsif ($ENV{'REQUEST_METHOD'} eq "POST")
{
    read(STDIN, $request, $ENV{'CONTENT_LENGTH'}) || die "Could not get query\n";
}

my @phone_no = split(/=/, $request);
my $phone_no;
my $phone_number = $phone_no[1];
chomp($phone_number);

my $host = '127.0.0.1';
my $login = "Action: login\r\nUsername: lite\r\nSecret: 4003\r\n\r\n";
$/ = "\r\n";    # <> reads a single line for signon banner

# Code for making connection with Telnet

my $s = IO::Socket::INET->new("$host:5038") or die "can't connect to $host: $!\n";
my $banner = <$s>;      # Read the banner

my $line = ('-' x 78) . "\n";
print $banner, $line;

print $s $login;
my $resp = <$s>;

print $resp, $line;

print $s "Action: Originate\r\nChannel: DAHDI/42/$phone_number\r\nContext: oreilly\r\nExten: s\r\nCallerID: 7702009896\r\nPriority: 1\r\nWaitTime: 10\r\nRetryTime: 20\r\nMaxRetries: 2\r\n\r\n";

$resp = <$s>;
print $resp, $line;

print $s "Action: Logoff\r\n\r\n";
$resp = <$s>;
print $resp, $line;

close $s;

Solution

  • If you are using Apache and running on a Linux server, then the following may help.

    You may need the following .htaccess file alongside your Perl code:

    <FilesMatch "\.pl$">
      Options +ExecCGI
      
      SetHandler cgi-script
    </FilesMatch>
    

    For this to work you'd also need to ensure that the Perl script is executable:

    chmod 755 myscript.pl
    

    .. and that the first line of the script is something like:

    #!/usr/bin/perl