uploadprogress_get_info已正确安装，但不能在其他代码中工作

Question

I know I have no issues with installing uploadprogress extension because when I tried this very simple tutorial: http://www.ultramegatech.com/2010/10/create-an-upload-progress-bar-with-php-and-jquery/ , it worked beautifully! 我知道我在安装uploadprogress扩展程序时没有问题，因为当我尝试这个非常简单的教程时： http ://www.ultramegatech.com/2010/10/create-an-upload-progress-bar-with-php-and-jquery / ，效果很好！

I then tweaked it just a little bit to have a very simple (not jQuery-UI) progress bar, which also worked. 然后，我对其进行了一些微调，以使其具有一个非常简单的（不是jQuery-UI）进度条，该进度条也可以使用。 Here's the working code: 这是工作代码：

upload_getprogress.php: upload_getprogress.php：

<?php

    if (isset($_GET['uid'])) {
        $status = uploadprogress_get_info($_GET['uid']);
        if ($status) {
            echo round($status['bytes_uploaded']/$status['bytes_total']*100); 
        }
        else {
            echo 100; 
        }
    }
    ?>

upload_form.php: upload_form.php：

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Upload Something</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
        <style>
            #progress-bar, #upload-frame {
                display: none;
            }
        </style>
        <script>
           (function ($) { 
                var pbar;
                var started = false;

                $(function () {
                     $('#upload-form').submit(function() {
                        $('#upload-form').hide();
                        pbar = $('#progress-bar');
                        pbar.show();
                        $('#upload-frame').load(function () {
                            started = true;
                        });

                        setTimeout(function () { 
                            updateProgress($('#uid').val());
                        }, 1000); 
                    });
                });

                function updateProgress(id) {
                    var time = new Date().getTime();
                    $.get('upload_getprogress.php', { uid: id, t: time }, function (data) {
                        var progress = parseInt(data, 10);
                        if (progress < 100 || !started) {
                            started = progress < 100;
                            updateProgress(id);
                        }
                        started && $('#inner').css('width', progress+ "%"); 
                    });
                }
            }(jQuery));
        </script>
        <style>
        #progress-bar
        {
        height:50px;
        width:500px;
        border:2px solid black;
        background-color:white;
        margin:20px;
        }
        #inner
        {
        height:100%;
        background-color:orange;
        width:0%;
        }
        </style>
    </head>
    <body>
        <form id="upload-form"
              method="post"
              action="upload.php"
              enctype="multipart/form-data"
              target="upload-frame" >
            <input type="hidden"
                   id="uid"
                   name="UPLOAD_IDENTIFIER"
                   value="<?php echo $uid; ?>" >
            <input type="file" name="file">
            <input type="submit" name="submit" value="Upload!">
        </form>
        <div id="progress-bar"><div id='inner'></div>
        <iframe id="upload-frame" name="upload-frame"></iframe>
    </body>
</html>

All fine and dandy, no issues! 一切都很好，没问题！ So I know for a fact there is nothing wrong with the way I've set up the uploadprogress extension. 因此，我知道一个事实，即我设置uploadprogress扩展的方式没有错。

However, having completed the demo successfully, I needed to integrate it into my javascript and jQuery intensive web-app, which includes file uploads. 但是，成功完成了演示之后，我需要将其集成到我的JavaScript和jQuery密集型Web应用程序中，其中包括文件上传。

Now when I try it, I get “NULL” from the uploadprogress_get_info() function. 现在，当我尝试它时，我从uploadprogress_get_info（）函数获得“ NULL”。 Why? 为什么？ In my application page, my image upload form is created dynamically . 在我的应用程序页面中，我的图像上传表单是动态创建的。 But at the beginning of my page (and before the user hits a button that dynamically creates an image upload form), I am using this line: 但是在页面的开头（在用户点击动态创建图像上传表单的按钮之前），我正在使用以下行：

<input type='hidden' name='UPLOAD_IDENTIFIER' id='uid' value='<?php echo md5(uniqid(mt_rand())); ?>' />

Is this the problem? 这是问题吗？ Is there a specific time or place this hidden input should be present? 是否有特定的时间或地点应该显示此隐藏的输入？

Before including the above line at the top of my page, I've also included a long .js file that includes a bunch of jQuery plugins, but starts with the following code: 在页面顶部包含以上行之前，我还包括了一个长.js文件，其中包含一堆jQuery插件，但从以下代码开始：

            var started = false;

            function updateProgress(id) {
            console.log("updating progress"); // this msg appears, so i know i'm getting this far
                var time = new Date().getTime();

                $.get('upload_getprogress.php', { uid: id, t: time }, function (data) {
                    var progress = parseInt(data, 10);

                    if (progress < 100 || !started) {
                        started = progress < 100;
                        updateProgress(id);

                    }
                     //started && pbar.progressbar('value', progress);
                   $('#inner').css('width', progress+ "%");

                });

            }

           // a lot more functions, then:
          function imageDialog(imgtype, x, y, editsource) {
          // this function dynamically generates a dialog for image uploading
          // which shows up when a user hits an "image upload" button
          // there's lots of code that creates a new form which is assigned to $imgform
          // lots of elements and a couple of iframes are appended to $imgform 
          // then finally: 

             $imgform.submit(function() {
        pbar = $('#progress-bar');
        $('#inner').css('width', "0%");
        pbar.show();
        started = true;
        setTimeout(function () {
                        updateProgress($('#uid').val()); 
                    }, 1000);
    });

         /* other irrelevant stuff */

          }

However, while the upload progress bar shows up as expected, it never increases in progress. 但是，尽管上传进度条如预期般显示，但进度却从未增加。

So I edited the upload_getprogress.php to look like this: 因此，我将upload_getprogress.php编辑为如下所示：

if (isset($_GET['uid'])) {
    $uid = $_GET['uid'];
        //$status = uploadprogress_get_info($_GET['uid']);
    echo "progress for $uid is: ".uploadprogress_get_info($uid);
 }

In Firefox, I can see the response of the ajax call, and what I get as output from upload_getprogress.php is: 在Firefox中，我可以看到ajax调用的响应，而从upload_getprogress.php的输出中得到的是：

progress for 6e728b67bd526bceb077c02231d2ec6f is:

I tried to dump $status into a variable and output to file, and the file said: 我试图将$status转储到变量中并输出到文件，文件说：

the current uid: 02e9a3e0214ffd731265ec5b0b220b4c
the current status: NULL

So basically, the status is consistently returning NULL . 因此，基本上，状态始终返回NULL 。 Why? 为什么？ This was (and still is) working fine in the demo, what could be going wrong while integrating it into my web app code? 在演示中这一直（现在仍然）正常工作，将其集成到我的Web应用程序代码中时可能出什么问题？ There's nothing wrong with the image uploading on its own - my images are getting uploaded fine, but the progress isn't getting tracked! 单独上传图像没有任何问题-我的图像可以很好地上传，但是进度没有得到跟踪！

The form that gets created dynamically looks like this: 动态创建的表单如下所示：

<div class="dialog-container">
<form id="imgform" method="post" enctype="multipart/form-data" action="upload_1-img.php" target="upload_target">
Select image:
<br>
<input id="image" type="file" name="image">
<div id="imgwrapper"></div>
<input id="filename" type="hidden" value="" name="filename">
<input id="upath" type="hidden" value="xxxxxxxxxxxxxxxxxxxxxxxxxx" name="upath">
<center>
<input id="imgupload" type="submit" onclick="showUploadedItem()" value="Upload">
<input id="clearcrop" type="button" disabled="disabled/" value="Clear selection">
<input id="imgapproved" type="button" disabled="disabled" value="Done">
<input id="imgcancel" type="button" value="Cancel">
</center>
</form>
</div>
<div id="progress-bar"><div id='inner'></div></div>
<!-- etc etc some other elements -->
</div>

and my own upload_1-img.php starts off with: 我自己的upload_1-img.php开始于：

    $filename = $_FILES["image"]["tmp_name"];       
    $file_info = new finfo(FILEINFO_MIME);
    $bfr = $file_info->buffer(file_get_contents($filename)) or die ("error");
    // some more stuff, getting file type and file's $name
    if( /* a bunch of conditions */ )
        move_uploaded_file( $_FILES["image"]["tmp_name"], $upath . "/" . $name);

Answer 1

Woohoo! oo！ I figured it out, thanks to this bug: 由于这个错误，我弄清楚了：

https://bugs.php.net/bug.php?id=57505 https://bugs.php.net/bug.php?id=57505

Basically, just I removed this static line from the page where users get to upload files: 基本上，我只是从用户上传文件的页面上删除了此静态行：

<input type='hidden' name='UPLOAD_IDENTIFIER' id='uid' value='<?php echo md5(uniqid(mt_rand())); ?>' />

and in my javascript function that creates the image dialog dynamically, I just added the hidden input dynamically, right above the line where I generated the file input. 在我的动态创建图像对话框的javascript函数中，我只是在生成文件输入所在行的上方动态添加了隐藏的输入。

So the relevant part of the dynamically created form then looks like: 因此，动态创建的表单的相关部分如下所示：

<input type='hidden' name='UPLOAD_IDENTIFIER' id='uid' value='1325a38f3355c0b1b4' />
<input id="image" type="file" name="image">

Now since this is getting dynamically created via javascript anyway, I can just replace that value above with a random js function. 现在，由于无论如何都是通过javascript动态创建的，因此我可以将上面的值替换为随机js函数。

Now the progress bar is advancing as it ought to! 现在进度条正在按预期的方向前进！ :D ：D

uploadprogress_get_info已正确安装，但不能在其他代码中工作

问题描述

1 个解决方案

解决方案1
0 2013-07-26 17:46:27

uploadprogress_get_info已正确安装，但不能在其他代码中工作

问题描述

1 个解决方案

解决方案1 0 2013-07-26 17:46:27

解决方案1
0 2013-07-26 17:46:27