使用perl在cgi中进行progessbar

时间:2019-04-11 09:17:20

标签: javascript ajax perl

到目前为止,一切正常。但是问题在于进步者开始发送邮件。

我发现我很难在cgi中实现Progressbar的所有示例。

文档对我来说不太清楚,如何在cgi中完成progressbar。

也许有人可以帮我解决上面的代码。因此可以练习并了解progrssbar如何与cgi一起工作。所以可以在我未来的项目中实现它

#!/usr/bin/perl -w

use lib '.';
use strict;
use warnings;
use DBI;
use CGI;
use MIME::Lite;
use CGI::Carp qw(fatalsToBrowser);

my $q = new CGI();

my $host =   "localhost";
my $usr =    "root";
my $pwd =    "";
my $dbname = "tbl_users";

my $dbh = DBI->connect("DBI:mysql:$dbname:$host", $usr, $pwd, {
                                  AutoCommit => 0,
                                  RaiseError => 1, 
                                  }) or die $DBI::errstr;

my $sub = $q->param("sub");
my $msg = $q->param("msg");
my $success;

if ($sub) {
my $getemails = $dbh->prepare("SELECT DISTINCT EMAIL FROM USERS");
$getemails->execute();
my $dbemails = $getemails->fetchall_arrayref;
my $emails = join ',',map{$_->[0]}@$dbemails;

my $to = '';
my $from = 'noreplay@site.com';
my $subject = $sub;
my $message = "

$msg 

";

my $MSG = MIME::Lite->new(
                 From     => $from,
                 To       => $to,
                 Bcc      => $emails,
                 Subject  => $subject,
                 Data     => $message
                 );

$MSG->send; 
$success = "mail was sent successfully";

}

$dbh->disconnect || die "$DBI::errstr\n";

print "Content-type: text/html\n\n";
print <<START_HTML;

<!DOCTYPE html>
<html>
<head>
<title>Mail Send</title>
<style type="text/css">
    body {
        background-color: white;
        font-family: Verdana;
        font-size: small;
        color: black
    }
    #trough {
        background-color: silver;
        border: 1px solid black;
        height: 24px
    }
    #bar {
        background-color: #669900;
        height: 24px;
        width: 1%
    }
</style>
</head>
<body>

<h1>Mail My DB Customers</h1>

<div id="form" style="display: block; margin: auto; width: 350px">
    <fieldset>
        <legend>Send Mail</legend>

        <form name="mail"  method="post" onSubmit="return sendMail(this)">


        Subject: <input type="text" name="sub" size="20"><br>
        Message: <input type="text" name="msg" size="20"><br>

        <input type="submit" value="Send Mail">
        </form>
    </fieldset>
</div>

<div id="progress" style="margin: auto; width: 350px">
    <fieldset>
        <legend>Sending...</legend>

        <div id="trough"><div id="bar"></div></div>

        Percent: <span id="percent">0</span>%
    </fieldset>
</div>

<span>$success</span>

<div id="debug"></div>

<script type="text/javascript">
    // When the form is submitted.
    function sendMail(frm) {

        // Show the progress indicator.
        document.getElementById("progress").style.display = "block";

        // Wait a bit and make ajax requests.
        setTimeout("getProgress()", 1000);

        return true;
    }

    // Poll for our progress.
    function getProgress() {
        var ajax = new XMLHttpRequest();

        ajax.onreadystatechange = function() {
            if (ajax.readyState == 4) {
                gotProgress(ajax.responseText);
            }
        };

        ajax.open("GET", "upload.pl" + Math.floor(Math.random()*99999), true);
        ajax.send(null);
    }

    // Got an update
    function gotProgress(txt) {


        // Get vars outta it.
        var percent = 0;

        // Was it an error?
        if (stat[0] == "error") {
            document.getElementById("debug").innerHTML += "error: " + stat[1];
            setTimeout("getProgress()", 1000);
            return false;
        }

        // Separate the vars.
        var parts = stat[1].split("&");

        for (var i = 0; i < parts.length; i++) {
            var halves = parts[i].split("=");


            if (halves[0] == "percent") {
                percent = halves[1];
            }

        }

        document.getElementById("debug").innerHTML += "percent:" + percent + "<br>\n";

        // Update the display.
        document.getElementById("bar").style.width = parseInt(percent) + "%";
        document.getElementById("percent").innerHTML = percent;

        // Set another update.
        setTimeout("getProgress()", 1000);
        return true;
    }
</script>

</body>
</html>



START_HTML

1 个答案:

答案 0 :(得分:2)

您似乎误解了Ajax的工作原理。听起来您的Ajax调用正在重新请求您的主要CGI程序,但这可能无法正常工作。 Ajax调用应该针对一个更简单的程序,该程序返回一个(通常)JSON响应,其中包含主页所需的数据。

但是fundamental problems that I mentioned to you in February仍然存在。您的电子邮件是通过一次致电MIME::Lite::send()来发送的,因此进度栏没有任何可报告的内容。拨打电话之前进度为0%,返回后进度为100%。

相关问题