【问题标题】:Using Codeigniter's Upload Library with Uploadify (Uploadifive)使用 Codeigniter 的上传库和 Uploadify (Uploadifive)
【发布时间】:2013-12-05 03:31:05
【问题描述】:

我有一个“文档”上传表单,我应该通过正常的 Codeigniter upload library 运行它。但是,我需要它作为 Ajax 调用工作。我有一个 Uploadifive 脚本(我购买了),这是他们的 HTML5 等效于Uploadify

我的问题是不能让 Uploadifive jQuery Ajax 插件与我的控制器功能一起工作。没有控制台错误、CI 错误,也没有从 ajax 函数输出的错误。事实上,Uploadify 函数似乎没有运行,因为页面重定向到我的控制器函数并在下面控制器函数的第一部分返回 $error = array('error' => $this->upload->display_errors()); 错误。

有人有将 Uploadifive 与 Codeigniter 结合的经验吗?我的代码有什么突出的地方吗?

请注意,我正在加载所有正确的脚本、库、模型等。此外,还没有对表单验证进行编码。同样,没有 Uploadify 插件一切正常

控制器功能(即上传/添加文档):

function add_document() {

    if (!$this->upload->do_upload()) {

        // If file upload failed or is invalid, 
        // display error notification
        $error = array('error' => $this->upload->display_errors());
        $this->load->view('upload', $error);
    }       
    else {

        // If file upload was successful,
        // get 'file_name' of the uploaded document
        $file_uploaded = $this->upload->data();
        $file_name = $file_uploaded['file_name'];

        // Add document to S3
        $query = $this->s3_model->add_document($file_name);
        if($query) {           

            // If successful, return S3 file url 
            $document_url = $query;

            // Add document and form details to db
            $this->content_model->add_doc($document_url);

            // Delete temporary document from local 'uploads' folder
            unlink('uploads/'.$file_name);
        }                   

        $this->load->view('upload');
    }

}

表格:

<? echo form_open_multipart('upload/add_document', 'id="upload-doc-form"') ;?>
    <? echo form_input('title', '', 'placeholder="Title"') ;?><br/>
    <? echo form_textarea('description', '', 'placeholder="Description"') ;?><br/>
    <? echo form_input('company',  '', 'placeholder="Company"') ;?><br/>
    <? echo form_input('company_url', '', 'placeholder="Company URL"') ;?><br/>
    <? echo form_upload('userfile', '', 'id="file-upload"') ;?>
    <br/><br/>
    <? echo form_submit('', 'Upload', 'class="doc-submit"') ;?>
<? echo form_close() ;?>

JS(包裹在$(function(){}中)

var form = $('#upload-doc-form');

$('#file-upload').uploadifive({                 
    'auto': true,
    'buttonText': 'BROWSE',
    'uploadScript': form.attr('action'),
    'onError': function(errorType) {
        alert('The error was: ' + errorType);
    }
});

这是 Uploadify 附带的 DEFAULT 打包的服务器端脚本,我也没有指出(obvs)。这只是为了向您展示 Uploadify 如何处理数据。我改为使用控制器......我认为这是这里的问题。

<?php
/*
UploadiFive
Copyright (c) 2012 Reactive Apps, Ronnie Garcia
*/

// Set the uplaod directory
$uploadDir = '/uploads/';

// Set the allowed file extensions
$fileTypes = array('jpg', 'jpeg', 'gif', 'png'); // Allowed file extensions

$verifyToken = md5('unique_salt' . $_POST['timestamp']);

if (!empty($_FILES) && $_POST['token'] == $verifyToken) {
    $tempFile   = $_FILES['Filedata']['tmp_name'];
    $uploadDir  = $_SERVER['DOCUMENT_ROOT'] . $uploadDir;
    $targetFile = $uploadDir . $_FILES['Filedata']['name'];

    // Validate the filetype
    $fileParts = pathinfo($_FILES['Filedata']['name']);
    if (in_array(strtolower($fileParts['extension']), $fileTypes)) {

        // Save the file
        move_uploaded_file($tempFile, $targetFile);
        echo 1;

    } else {

        // The file type wasn't allowed
        echo 'Invalid file type.';

    }
}
?>

【问题讨论】:

  • 没有ajax调用?你 100% 确定 form.attr('action') 是正确的吗?在 var 表单行之后提醒它进行检查。您是否 100% 确定页面加载时(在您尝试上传之前)没有 JS 错误?
  • uploadScript src 渲染良好,根据我的浏览器源代码。我的猜测是控制器代码。没有控制台错误...警报很好,等等。我确定这是 Codeigniter upload 库的服务器端问题。
  • 更新了我的问题以包含与 Uploadifive 打包的默认服务器端脚本。我一定是错误地处理了从 ajax 调用到控制器的数据。
  • 试试 $this->upload->do_upload('userfile');
  • 很确定 CI 上传脚本默认会查找“用户文件”,不是吗?

标签: php ajax codeigniter jquery uploadify


【解决方案1】:

问题是我没有设置(或更改)从 Ajax 调用发送到我的控制器的文件对象名称。 Codeigniter 的UPLOAD 库查找名为userfile 的文件对象。 Uploadifive 默认发送数据字符串fileData

非常简单的编辑 - 我应该抓住的东西......

在 Uploadifive Alax 函数中,我不得不重命名 fileObjName 以配合 CI 上传库。像这样:

$(function() {
    $('#file-upload').uploadifive({
        'fileObjName': 'userfile',
        ...
    });
}); 

【讨论】:

  • 您可以使用上传类来选择您想要的上传名称,例如if (!$this->upload->do_upload('fileData')) {
  • 很确定要使用CI上传库,你必须将文件设置为userfile,不是吗?除非您更改 system/libraries/upload.php 文件...
  • 系统第143行->upload.php文件,public function do_upload($field = 'userfile')
  • 'userfile' 是您上面提到的默认上传名称,您可以只写 $this->upload->do_upload() 而不是 $this->upload->do_upload('userfile')。例如,如果您想更改上传名称或运行多个上传,您可以分配所需的上传名称。
【解决方案2】:

您是否尝试将选项 uploadScript 设置为 $(this).attr('action') 或者可能 &lt;?php echo base_url() . "upload/add_document"; ?&gt;

【讨论】:

  • 我已经尝试过了...uploadScript src 渲染良好,根据我的浏览器源代码。我的猜测是控制器代码。
  • 手动运行控制器会发生什么?你看过你得到什么数据吗?例如echo "&lt;pre&gt;".print_r($ _REQUEST)."&lt;/pre&gt;";exit; 并且 uploadifive 函数在 $(function() {} 中而不在 $(document).ready(function() {}) 中是否正确
  • 这意味着同样的事情(re: document ready);)。是的,包含的 uploadifive php 脚本在直接调用时可以正常工作。但我想将它与 codeigniters 库一起使用。
猜你喜欢
  • 1970-01-01
  • 2013-04-01
  • 2011-03-11
  • 2012-06-09
  • 1970-01-01
  • 2013-01-01
  • 2012-01-07
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多