Jquery文件上传蓝色Imp -设置动态上传url

Question

我正在使用Jquery上传文件库，但在设置要写入文件的目录时遇到了困难。如果我使用示例中设置的标准位置，则会上传文件。下面的代码可以工作：

 $('#fileupload').fileupload({
            disableImageResize: false,
            autoUpload: false,
            // Uncomment the following to send cross-domain cookies:
            //xhrFields: {withCredentials: true}, 
             //url: currentDir
            url: '/assets/plugins/jquery-file-upload/server/php/'
        });

但是如果我尝试更改url，如下所示：

    var currentDir = window.location.pathname;

return {
    //main function to initiate the module
    init: function () {

         // Initialize the jQuery File Upload widget:
        $('#fileupload').fileupload({
            disableImageResize: false,
            autoUpload: false,
            // Uncomment the following to send cross-domain cookies:
            //xhrFields: {withCredentials: true}, 
             url: currentDir
            //url: '/assets/plugins/jquery-file-upload/server/php/'
        });

我收到此错误: SyntaxError:意外令牌<

我还研究了如何实现这个解决方案：http://www.eliwheaton.com/web-development/dynamically-set-upload-directory-using-blueimp-jquery-file-upload

但并不快乐。有什么想法吗？

谢谢

Answer 1

问题是URL变量是用来定位PHP脚本的位置的。它不是要上载文件的位置。

我也遇到过类似的问题。我通过向脚本传递一个额外的变量并更改php中的upload_dir变量解决了这个问题。

您的默认index.php文件应该如下所示。

error_reporting(E_ALL | E_STRICT);
require('UploadHandler.php');
$upload_handler = new UploadHandler();

我修改了它以侦听我从JS传递的额外变量。看看评论，看看发生了什么。本质上，它确保在(从javascript)调用该文件时接收到名为fuPath的额外变量，如果没有，则不上传该文件。如果接收到路径，则根据web根目录使用它来获取最终目的地。

    error_reporting(E_ALL ^ (E_NOTICE | E_WARNING));
require('UploadHandler.php');
$urlHolder = NULL;


// This option will be used while uploading the file.
// The path will come as POST request.
if( isset($_POST['fuPath']) ) {
    // perform validations to make sure the path is as you intend it to be
    $urlHolder = filter_var($_POST['fuPath'], FILTER_SANITIZE_URL);
}
// This option will be used when deleting a file.
// The file details will come from GET request so have to be careful
else if( isset($_GET['fuPath']) ){
    // perform validations to make sure the path is as you intend it to be
    $urlHolder = filter_var($_GET['fuPath'], FILTER_SANITIZE_URL);
}
else{
    exit;
}
$options = array(
                'upload_dir'=>  $_SERVER['DOCUMENT_ROOT'] .'/' .$urlHolder,
//              'upload_url'=>'server/php/dummyXXXX',   // This option will not have any effect because thumbnail creation is disabled
                'image_versions' => array(),            // This option will disable creating thumbnail images and will not create that extra folder.
                                                        // However, due to this, the images preview will not be displayed after upload
            );

if($urlHolder){
    $upload_handler = new UploadHandler($options , true , null);
}

现在，在JS端，我做了以下更改。

var fullUpldPath = "";
// when file upload form is initialised then along with other options I also set the file upload path "fuPath".
// default will be empty string, so we can validate in php code.
$(localFormNames.fileForm).fileupload({
    formData: {fuPath: fullUpldPath}
});

现在回到HTML。我已经创建了一个虚拟按钮(让我们调用#uploadFiles)，用户可以单击它来上传图像。这是必需的，因为我想在用户单击上传和上传开始之间操作此fuPath变量。插件的upload按钮(让我们称之为#pluginButton)是隐藏的。

因此，当用户单击#uploadFiles时，我会根据需要更改我的文件上传路径。设置修改后的变量，然后单击实际插件的upload按钮。

// ending / is mandatory.
fullUpldPath = "assets/uploadedImages" + $("#imagename").val() + "/";
$(localFormNames.fileForm).fileupload({
    formData: {fuPath: fullUpldPath}
});
// Now manually trigger the file upload
$("#pluginButton").click();