标签: fine-uploader

带Rails的Fine Uploader形式

我最近在我们的Rails应用程序中安装了Fine Uploader.我已经阅读了文档并对它进行了一些实验,但我似乎并不了解这个东西是如何工作的,因此,我在实现它时遇到了很多问题.

我做了什么:安装它(两种方式,一种是"经典",第二种是使用fineuploader gem,它似乎也是这样).

创建了一个包含此文件的咖啡文件.

$ ->
  uploader = new (qq.FineUploader)(
    debug: true
    element: document.getElementById('fine-uploader')
    request: endpoint: '/uploads')
    template: 'test-template'
Run Code Online (Sandbox Code Playgroud)

这会创建一个"上传文件"按钮(这当然不起作用,因为在服务器站点上没有配置来处理这个),但我希望在简单形式的输入字段中有这个按钮.

此外,模板不起作用,我真的不明白为什么.

不幸的是,文档缺乏对Rails的帮助.

我愿意将这个库更改为其他内容,只要它包含我需要的功能:

  • 暂停和恢复下载
  • 文件分块(如果失败,用户不会被强制重启)
  • 进度条(不重要)

ruby-on-rails fine-uploader

4
推荐指数
1
解决办法
1319
查看次数

Fine-uploader vs file-uploader许可证

看起来像Andrew Valums构建的两个库.他们似乎都拥有相同的许可证(GNU GPL v3).

文件上传器可以轻松下载,但对于精美的上传器,我必须提供我的email地址下载,它将允许我免费使用它45天.

截至目前,似乎我能够在github上克隆这两个.

我的问题是,我可以在我的客户项目中使用这两个库或其中一个库而无需获得商业许可吗?

javascript valums-file-uploader fine-uploader

3
推荐指数
1
解决办法
5641
查看次数

完成所有上传后的FineUploader客户端事件

我实现了FineUploader,我希望在上传所有文件后将我的客户端脚本连接到一个事件.那可能吗?

我的实现如下.只是想知道这是否是正确的方向.

    function init() {
    var uploader = new qq.FineUploader({
        element: document.getElementById('button-selectfiles'),
        request: {
            endpoint: '/Up/UploadFile'
        },

        callbacks: {
            onStatusChange: onFileUploadStatusChange
        }
    });
};

var uploads = 0;
function onFileUploadStatusChange(id, oldStatus, newStatus) {
    console.log(newStatus);

    if (newStatus === 'submitting') {
        uploads++;
    }

    if (newStatus === 'upload successful' || newStatus === 'upload failed') {
        uploads--;
    }

    if (uploads === 0) {

        console.log('done');
    }
}
Run Code Online (Sandbox Code Playgroud)

javascript fine-uploader

3
推荐指数
2
解决办法
5658
查看次数

精简上传到S3文件夹

有谁知道是否可以使用Fine Uploader上传到S3存储桶内的文件夹?我尝试在请求端点添加'\ foldername',但没有运气.

谢谢.

javascript upload amazon-s3 fine-uploader

3
推荐指数
2
解决办法
1436
查看次数

使用Fine Uloader上传缩放文件时出现奇怪的行为

我已经实现了FileUploader 4.4,它在使用Coldfusion上传多个文件时非常有效.

终点代码非常简单,如下所示:

<cffile action="upload"
                destination="#application.Config.imageDir#"
                nameconflict="overwrite" 
                filefield="FORM.qqFile" />
            <cfif CFFILE.contenttype EQ "image" OR ListFindNoCase("jpg,jpeg,gif,png", CFFILE.serverFileExt)>
                <cfset local.fileName = CFFILE.serverFile />
</cfif>
Run Code Online (Sandbox Code Playgroud)

每当我上传单个或多个图像时,local.filename变量都会正确设置为您通常在qqfilename中看到的图像文件名值,例如"image0001.jpg"

发送此数据的javasript代码很简单:

 $('#fine-uploader').fineUploader({
             request: {
                endpoint: '<cfoutput>#application.Config.fineUploaderProxy#?cfc=#cfcName#&functionName=#functionName#</cfoutput>'
              }
    });
Run Code Online (Sandbox Code Playgroud)

但是,只要我添加缩放,就会开始出现奇怪的行为.缩放版本被发送到我的上传处理程序,但是,正在发送的文件名对于每个缩放图像始终是"blob",而不是我期望的名称,类似于"image0001(small).jpg"

我添加的用于激活缩放的代码很简单:

 $('#fine-uploader').fineUploader({
            scaling: {
                    sizes: [
                        {name: "small", maxSize: 50}
                    ]
                },
            request: {
                endpoint: '<cfoutput>#application.Config.fineUploaderProxy#?cfc=#cfcName#&functionName=#functionName#</cfoutput>'
              }
    });
Run Code Online (Sandbox Code Playgroud)

有人可以帮助我,为什么文件名"blob"与qqfile而不是实际的文件名?我使用的是最新版本的Chrome.

谢谢

coldfusion fine-uploader

3
推荐指数
1
解决办法
153
查看次数

如何在Laravel中使用供应商类?

我想在我的Laravel项目中使用这个包https://github.com/FineUploader/php-traditional-server/.所以我修改了composer.json这样的文件:

"require": {
    "php": ">=5.5.9",
    "laravel/framework": "5.2.*",
    "fineuploader/php-traditional-server": "1.0.0"
}
Run Code Online (Sandbox Code Playgroud)

并运行compose update命令.但是如何UploadHandler在Controller上使用类(在包的handler.php中声明)?

laravel fine-uploader

3
推荐指数
1
解决办法
1677
查看次数

使用fineuploader和react-rails

我正在尝试使用fineuploader with react并安装了所有相关的依赖项.以下是我使用的代码: -

import React, { Component } from 'react'

import FineUploaderTraditional from 'fine-uploader-wrappers'
import Gallery from 'react-fine-uploader'

import 'react-fine-uploader/gallery/gallery.css'

const uploader = new FineUploaderTraditional({
    options: {
        chunking: {
            enabled: true
        },
        deleteFile: {
            enabled: true,
            endpoint: '/uploads'
        },
        request: {
            endpoint: '/uploads'
        },
        retry: {
            enableAuto: true
        }
    }
})

class UploadComponent extends Component {
    render() {
        return (
            <Gallery uploader={uploader} />
        )
    }
}

export default UploadComponent
Run Code Online (Sandbox Code Playgroud)

但我得到以下错误: -

Uncaught Error: Element type is invalid: expected a …
Run Code Online (Sandbox Code Playgroud)

javascript ruby-on-rails fine-uploader reactjs

3
推荐指数
1
解决办法
322
查看次数

精细上传器3.4和setParams

我正在使用jquery插件的精细上传器.需要在上传文件之前动态传递params,因此,setParams()方法应该完成这项工作.我在onSubmit回调中没有例外:

1)上传者声明

 function initUploader() {
         var up = $('#BSUploader').fineUploader({
                      multiple: true,
                      debug: true,
                      request: {
                          endpoint: '${request.contextPath}/quantum/uploadToS3',
                          //params: {'folderId':r }
                      },
                      dragAndDrop: {
                          extraDropzones:[$('#filesContainer')],
Run Code Online (Sandbox Code Playgroud)

...

2)onSubmit回调

...
}).on('submit', function(event, id, name) {
          var r = $("#curfolderid").val();
          alert(r);
          up.setParams({'folderId':r});
Run Code Online (Sandbox Code Playgroud)

3)错误日志

[FineUploader] Caught exception in 'onSubmit' callback - Object [object Object] has no method 'setParams' bundle-bundle_uploader_defer.js:4
qq.log bundle-bundle_uploader_defer.js:4
qq.FineUploaderBasic.log bundle-bundle_uploader_defer.js:26
b bundle-bundle_uploader_defer.js:47
a._options.callbacks.(anonymous function) bundle-bundle_uploader_defer.js:47
qq.FineUploaderBasic._upload bundle-bundle_uploader_defer.js:43
qq.FineUploaderBasic._uploadFileOrBlobDataList bundle-bundle_uploader_defer.js:43
qq.FineUploaderBasic.addFiles bundle-bundle_uploader_defer.js:29
qq.DragAndDrop.callbacks.dropProcessing bundle-bundle_uploader_defer.js:69
b bundle-bundle_uploader_defer.js:51
qq.UploadDropZone.onDrop bundle-bundle_uploader_defer.js:52
(anonymous function)
Run Code Online (Sandbox Code Playgroud)

任何的想法 ?

jquery fine-uploader

2
推荐指数
1
解决办法
4457
查看次数

未捕获错误:无法在 ID 'qq-template' 处找到模板脚本!

我刚刚下载了 Fine Uploader 4.0 的新“自定义版本”。我的页面在几周前安装和设置的 3.9 上运行良好。

我的代码:

Click "Select Files" and pick the files you would like to upload.  Then click "Upload Now" to start the transfer.
<hr>
<div id="fineuploader-s3"></div>
<div id="triggerUpload" class="btn btn-primary" style="margin-top: 10px;">
    <i class="icon-upload icon-white"></i> Upload now
</div>

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="http://xxxxxxx/fineuploader-4.0.3/custom.fineuploader-4.0.3.js"></script>
    <script>


      $(document).ready(function () {

          var manualuploader;

          function check_done() {
              if (allUploadsCompleted() === true) {
                  var successUrl = "http://xxxxxxxx/FineUploadComplete?ftpSessionId=xxxxxx";
                  $.get( successUrl );
                  alert('Your upload is complete.');
                  window.top.location = "xxxxxxxx";
              } 
           }

           function allUploadsCompleted() { …
Run Code Online (Sandbox Code Playgroud)

fine-uploader

2
推荐指数
1
解决办法
5611
查看次数

使用 FineUploader,我可以使用指定文件夹中的文件预先填充上传区域吗?

我正在使用FineUploader并且已经弄清楚如何将图像上传到服务器。

$(document).ready(function() {
  $('#fine-uploader-gallery').fineUploader({
    template: 'qq-template-gallery',
    request: {
      endpoint: "./vendor/fineuploader/php-traditional-server/endpoint.php"
    },
    deleteFile: {
      enabled: true,
      endpoint: "./vendor/fineuploader/php-traditional-server/endpoint.php"
    },
    chunking: {
      enabled: true,
      concurrent: {
        enabled: true
      },
      success: {
        endpoint: "./vendor/fineuploader/php-traditional-server/endpoint.php?done"
      }
    },
    resume: {
      enabled: true
    },
    retry: {
      enableAuto: true,
      showButton: true
    },
    thumbnails: {
      placeholders: {
        waitingPath: './node_modules/fine-uploader/jquery.fine-uploader/placeholders/waiting-generic.png',
        notAvailablePath: './node_modules/fine-uploader/jquery.fine-uploader/placeholders/not_available-generic.png'
      }
    },
    validation: {
      allowedExtensions: ['jpeg', 'jpg', 'gif', 'png']
    }
  });
});
Run Code Online (Sandbox Code Playgroud)

现在,当用户刷新页面或最初加载页面时,我希望指定文件夹中的图像显示在上传区域中。我怎样才能做到这一点?

javascript file-upload fine-uploader

2
推荐指数
1
解决办法
1102
查看次数