README

这是一个用于blueimp jQuery 文件上传小部件的 Cakephp 5.x 扩展库 https://github.com/blueimp/jQuery-File-Upload

需求

1. Cakephp 4.x
2. Blueimp Jquery File Upload - https://github.com/blueimp/jQuery-File-Upload（依赖已添加到插件的composer中，因此将自动安装）

安装

1) 使用composer进行安装：将以下内容添加到您的main composer.json文件中的require部分，然后运行composer update

"umer936/cakephp-jquery-file-upload": "^2.0"

要使用原始库中的css和js文件，它们将被复制到插件的webroot目录中：为此，在您的应用程序的main composer.json文件中应添加以下内容

"scripts": {
    "post-update-cmd": "CakephpJqueryFileUpload\\Console\\Installer::postUpdate"
},

2) 从bootstrap加载插件，并将组件添加到控制器、助手 - 到AppView

// bootstrap.php
Plugin::load('CakephpJqueryFileUpload');

// inside your controller's initialize
$this->loadComponent('CakephpJqueryFileUpload.JqueryFileUpload');

// inside AppView.php initialize
$this->loadHelper('CakephpJqueryFileUpload.JqueryFileUpload');

3) 要将UploadHelper类添加到autoload classmap，将以下内容添加到您的main composer - 在autoload下，与psr-4同一级别

"classmap": [
	"vendor/blueimp/jquery-file-upload/server/php"
]        

然后运行composer dump-autoload

4) 简单设置示例

<?php echo $this->JqueryFileUpload->loadCss(); ?>
<?php echo $this->JqueryFileUpload->loadScripts(); ?>

<span class="btn btn-success fileinput-button">
    <i class="glyphicon glyphicon-plus"></i>
    <span>Select files...</span>
    <!-- The file input field used as target for the file upload widget -->
    <input id="fileupload" type="file" name="files[]" multiple>
</span>

<script type="text/javascript">
$(function () {

    // Initialize the jQuery File Upload widget:
    $('#fileupload').fileupload({
        // Uncomment the following to send cross-domain cookies:
        //xhrFields: {withCredentials: true},
        url: '/myController/myAction'
    });
    
});
</script>

在您的myAction中

// example options
$options = array(
    'max_file_size' => 2048000,
    'max_number_of_files' => 10,
    'access_control_allow_methods' => array(
        'POST'
    ),
    'access_control_allow_origin' => Router::fullBaseUrl(),
    'accept_file_types' => '/\.(jpe?g|png)$/i',
    'upload_dir' => WWW_ROOT . 'files' . DS . 'uploads' . DS,
    'upload_url' => '/files/uploads/',
    'print_response' => false
);

$result = $this->JqueryFileUpload->upload($options);

有关完整的$options，请参阅https://github.com/blueimp/jQuery-File-Upload

许可证

MIT