Valums文件上传器:限制用户信用额度上传

Question

我正在使用Valums awesome文件上传器 - https://github.com/valums/file-uploader

我想添加的一件事是基于用户帐户余额的限制.

第一张图片始终是免费的,因此即使您的余额为0,也可以上传一张图片.

额外的图像将需要0.50的价值或信用.如果他们没有足够的信用,它将显示警报,并且不会上传该文件.

可以从php会话变量接收余额 $_SESSION['user']['credit']

这是迄今为止的代码

function createUploader(){ 
    var running = 0;    
    var uploader = new qq.FileUploader({
        multiple: true,
        element: $('#file-uploader')[0],
        action: 'classes/upload.item.php',
        allowedExtensions: ['jpg', 'png', 'gif'],
        params: {item: '<?php echo $item_id ?>'},
        onSubmit: function(id, fileName){
            running++;
            $('.button').replaceWith('<a class="button large grey full-width">Please wait...</a>');
        },
        onComplete: function(id, fileName, responseJSON){
            running--;
            $(".thumbnails").append('<li class="span2"> <a class="thumbnail"><img src="<?php echo $path; ?>'+fileName+'" /></a> </li>');
            if(running==0){
              $('.button').replaceWith('<a class="button large green full-width" href="confirm/<?php echo $item_id; ?>">Continue to next step</a>');                                 
            }           

        },
        onCancel: function(id, fileName){
            running--;
        },
        debug: true
    });           
}

对不起,问题是,您能否提供有关实施上述内容的任何建议？

干杯

编辑: 我使用下面的建议(可能不正确)尝试了以下内容.

我尝试停止上传文件return false不成功,上传立即开始,似乎被警报暂停,一旦警报关闭,上传就完成了.

文件说

onSubmit(String id,String fileName) - 当文件提交到代码的上传者部分时调用.请注意,这并不意味着文件上传将在此时开始.返回false以阻止提交给上传者.

<?php
// count uploaded files
$path = 'uploads/' . $_SESSION['user']['username'] . '/' . $item_id . '/thumbs/s_';
$files = glob($path . '*.*'); 


// has free upload been used yet? incase of page refresh etc
if (count($files) >= 1) {
    $used_free = 'true';
} else {
    $used_free = 'false';
}
?>

<script>
    function createUploader(){ 
        var credit = <?php echo $_SESSION['user']['credit'] ?>;  
        var used_free = <?php echo $used_free ?>; 
        var running = 0; 


            var uploader = new qq.FileUploader({
                multiple: true,
                element: $('#file-uploader')[0],
                action: 'classes/upload.item.php',
                allowedExtensions: ['jpg', 'png', 'gif'],
                params: {item: '<?php echo $item_id ?>'},
                onSubmit: function(id, fileName){   
                    console.log(used_free);
                    if (!used_free) {
                        used_free = 'true';
                        running++;
                        $('.button').replaceWith('<a class="button large grey full-width">Please wait...</a>');
                    } else {
                        $.get('ajax/getCredit.php', function (data) {
                            if (data.credit >= 0.5) {
                                running++;
                                $('.button').replaceWith('<a class="button large grey full-width">Please wait...</a>');
                            } else {
                                alert('you do not have enough credits');
                                return false;
                            }
                        }, "json");
                    }
                },
                onComplete: function(id, fileName, responseJSON){
                    running--;
                    $(".thumbnails").append('<li class="span2"> <a class="thumbnail"><img src="<?php echo $path; ?>'+fileName+'" /></a> </li>');
                    if(running==0){
                      $('.button').replaceWith('<a class="button large green full-width" href="confirm/<?php echo $item_id; ?>">Continue to next step</a>');                                 
                    }           
                },
                onCancel: function(id, fileName){
                    running--;
                },
                debug: true
            });      
    }
</script> 

简化它,这是有效的

function createUploader(){ 
    var credit = <?php echo $_SESSION['user']['credit'] ?>;  
    var used_free = <?php echo $used_free ?>; 
    var running = 0; 


    var uploader = new qq.FileUploader({
        multiple: true,
        element: $('#file-uploader')[0],
        action: 'classes/upload.item.php',
        allowedExtensions: ['jpg', 'png', 'gif'],
        params: {item: '<?php echo $item_id ?>'},
        onSubmit: function(id, fileName){   
            if (!used_free) {
                used_free = 'true';
                running++;
                $('.button').replaceWith('<a class="button large grey full-width">Please wait...</a>');
            } else {
                if (credit >= 0.5) {
                    running++;
                    credit = credit - 0.5;
                    $('.button').replaceWith('<a class="button large grey full-width">Please wait...</a>');
                } else {
                    alert('you do not have enough credits');
                    return false;
                }
            }
        },
        onComplete: function(id, fileName, responseJSON){
            running--;
            $(".thumbnails").append('<li class="span2"> <a class="thumbnail"><img src="<?php echo $path; ?>'+fileName+'" /></a> </li>');
            if(running==0){
              $('.button').replaceWith('<a class="button large green full-width" href="confirm/<?php echo $item_id; ?>">Continue to next step</a>');                                 
            }           
        },
        onCancel: function(id, fileName){
            running--;
        },
        debug: true
    });      
}

然后,我在确认页面上计算上传的文件,扣除信用额度

Answer 1

您可以为 JavaScript 打印一个布尔值，用于检查是否允许上传：

var allowUpload = <?php echo $_SESSION['user']['credit'] >= 0.5 ? 'true' : 'false' ?>;

当他们尝试上传文件时，您仍然需要验证他们在服务器端是否有足够的积分。

AJAX/JSON 方法

您可以使用 AJAX 来获取可用积分，让我们使用 PHP 生成一些 JSON。getCredit.php:

<?php
session_start();
header('Cache-Control: no-cache, must-revalidate');
header('Expires: Mon, 26 Jul 1997 05:00:00 GMT');
header('Content-type: application/json');
echo '{"credit":' . $_SESSION['user']['credit'] . '}';

然后，您可以通过 JavaScript 即时获得积分。

$.get('getCredit.php', function (data) {
    if (data.credit >= 0.5) {
        // call uploader code here
    }
}, "json");