5

我正在使用 Valums 很棒的文件上传器 - 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
    });      
}

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

4

1 回答 1

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");
于 2012-09-10T16:21:02.037 回答