Hi Ray

drag n drop is not working in IE 10 and edge browser

Please let me the possible solution.

Regards
Manidipa

I have my root credentials and IAM user credentials but I am confused which to use where with respect to the following->

AWS_CLIENT_PUBLIC_KEY=?
AWS_CLIENT_SECRET_KEY=?
AWS_SERVER_PUBLIC_KEY=?
AWS_SERVER_SECRET_KEY=?
Plz help me to sort out!

Hi, I am using FineUploaderBasic for sending a video file it's returning like

[Fine Uploader 5.16.0] Received response status 502 with body:

502 Bad Gateway

This is to ensure that it is clear that this is to be the expected bucket name, and not the bucket URI.

I suspect the one-size-fits-all PHP example for Fine Uploader S3 may confuse some integrators who don't intend to work in a cross-origin environment, and/or don't really know what CORS is. So, let's create a strictly CORS example, and a strictly non-CORS PHP example. The CORS example is needed for the fineuploader.com S3 demo, since those requests are cross-origin.

Let's call the non-CORS example "s3demo.php" and the CORS example "s3demo-cors.php".

Found via: http://stackoverflow.com/a/17981531/2405667

When I upload a file I assign it an id, I need to then return that id back to the frontend so when the form is submitted I know what file id's are associated with it.

How can I return the id with my response and get access to it?

It's functional and supports all FU features, but it's not well documented maybe a bit messy.

Hi Guys,

I running into an issue when I try to upload a file with 0 bytes in size using I.E 10 compatibility mode. I'm able to upload the file via Chrome,FireFox,Safari. Is this a known issue?

Its also slow when uploading if the file size is 0 bytes.

From AWS s3, AWSAccesskey and AWSSecretkeys are provided. In the demo php server code there are 4 different keys. Which key assosciates to the given access key by aws? Also, what's the expectedhostname?

I am using a multipart form parser to get my policy because bodyparser isn't working anymore.

How to get the file path in HTML 5

The first error I've got was at line 54: request_payload = json.loads(request.body), saying that the parameter must be 'str', not 'bytes'. I've fixed it writing this instead: request_payload = json.loads(request.body.decode()).

Then I've got one at line 113: policy = base64.b64encode(json.dumps(policy_document)). It said that a bytes-like object was required, not 'str'. So I changed that line to policy = base64.b64encode(json.dumps(policy_document).encode()), and it seemed to be fixed.

Now I'm getting an error at the next line, 114: signature = base64.b64encode(hmac.new(settings.AWS_CLIENT_SECRET_KEY, policy, hashlib.sha1).digest()). At some point of the hmac.new function I get this: key: expected bytes or bytearray, but got 'str'.

I'll try to fix it, but please tell me if I'm doing something wrong, maybe there's a better way of doing it.

Hi

I've written a basic .ashx handler. I tried to create a pull request from my PC by am denied permission. Not sure what I am doing wrong. I was hoping for some help in refining the handler but it looks like nobody works with the .NET stack.

Can you possibly add my handler code?

public class Upload : IHttpHandler, IRequiresSessionState
    {
        public void ProcessRequest(HttpContext context)
        {
            try
            {
                var UserId = context.Request["userId"];
                var PortalId = context.Request["portalId"];

               context.Response.ContentType = "text/plain";

               var tempPath = "~/Portals/" + PortalId + "/docs/users/" + UserId;
               var dirFullPath = context.Server.MapPath(tempPath);

              foreach (string s in context.Request.Files)
              {
                  var file = context.Request.Files[s];
                  var fileName = file.FileName;
                  var fileExtension = file.ContentType;

                  if (string.IsNullOrEmpty(fileName)) continue;
                  var pathToSave_100 = HttpContext.Current.Server.MapPath(tempPath) + "\\" + fileName;
                  file.SaveAs(pathToSave_100);

                }

                context.Response.StatusCode = (int) HttpStatusCode.OK;
                context.Response.Write("{\"success\":true}");
           }

          catch (Exception ex)
          {
              context.Response.Write("Error: " + ex.Message); // #DEV this needs work
          }
    }
    public bool IsReusable => false;
}

` onSubmit:function(id,file)
{
image = this.getFile(id)
var fr = new FileReader();
var canvas = document.createElement("canvas");
fr.onload = function()
{
img = new Image();
img.onload = function(){
canvas.width = img.width;
canvas.height = img.height;
canvas.getContext("2d").drawImage(img,0,0);
}
img.src = fr.result;
}
// onload fires after reading is complete
fr.readAsDataURL(image);

                    }

Now ,how can I add this canvas to fineuploader?I found about the addFile() method but couldn't find a proper way? This is my fineuploader js->$('#fineuploader').fineUploaderS3({

            signature:{
                endpoint:"{%url 's3_signee' %}",
            },


            uploadSuccess:{
                endpoint: "{%url 's3_succes_endpoint' %}"


            },
            validation: {
                 allowedExtensions: ["gif", "jpeg", "jpg", "png"],
                acceptFiles: "image/gif, image/jpeg, image/png",
                 sizeLimit: 50000000,
             },
             callbacks:{
               onSubmit:function(id,name){
              as `above//`
            }

})

I wasn't able to access the bucket or key via POST params. I had to use GET.

function deleteObject() {
    getS3Client()->deleteObject(array(
        'Bucket' => $_GET['bucket'],
        'Key' => $_GET['key']
    ));
}

https://github.com/Widen/fine-uploader-server/blob/master/nodejs/s3/s3handler.js#L145

This condition where it checks for parsedMaxSize always false in my case.

When I remove it and only check the bucket name, the upload starts to display progress, but I get "The request signature we calculated does not match the signature you provided. Check your key and signing method." 403 header, even though I followed instructions here:

http://blog.fineuploader.com/2013/08/16/fine-uploader-s3-upload-directly-to-amazon-s3-from-your-browser/#configure-s3

https://github.com/FineUploader/server-examples/blob/master/python/django-fine-uploader-s3/views.py#L63

the response content above should be '{"invalid": True}'

As it is now, the xhrOrXdr.responseText will fall into the except clause because it's just an object and jQuery can't parse it as JSON. In fact, "invalid" will be the only thing that makes it into the responseText at all.

Here's the beginning of the try/except: https://github.com/FineUploader/fine-uploader/blob/c1b4954f21381dbd664e379abf571c988e2265c0/client/js/uploadsuccess.ajax.requester.js#L42

@uberdanzik pointed out some interpreter warnings in the PHP examples in #26.

Should probably fix those in the other servers too. Not critical, but it is something

As total file size goes over the length of an int at 4GB, the current codebase fails to parse the totalfilesize when submitting files larger than that.

In RequestParser change all references to totalfilesize to long and parse Longs.

Also in your Receiver update any references to totalfilesize to long.

Thumbnail creation is a core feature for file uploaders (especially ones geared towards images). Since most javascript-jquery lightboxes are built for thumbnail galleries, likewise, mainstream uploaders should contain thumbnail creation capabilities. Pre-packaged lightboxes usually include examples with thumbnails that are 75x75 pixels and 3-5 KB. If a fileuploader does not have easily accessible and customizable "server side" thumbnail saving, the uploader is not suitable for mainstream use.

Thumbnail-based Lightboxes
PrettyPhoto
MagnificPopup
Blueimp's Lightbox Image Gallery

Blueimp's Jquery Fileuploader comes with php and node.js server scripts with built-in thumbnail creation. End-users can simply change directory locations by editing a few lines of code.

Blueimp's UploadHandler.php has the following code for unsized image directories:

'upload_dir' => dirname($this->get_server_var('SCRIPT_FILENAME')).'/files/',
'upload_url' => $this->get_full_url().'/files/',

Furthermore, end-users can uncomment two lines to start creating thumbnails in a specified location:

'thumbnail' => array(
// Uncomment the following to use a defined directory for the thumbnails
// instead of a subdirectory based on the version identifier.
// Make sure that this directory doesn't allow execution of files if you
// don't pose any restrictions on the type of uploaded files, e.g. by
// copying the .htaccess file from the files directory for Apache:
//'upload_dir' => dirname($this->get_server_var('SCRIPT_FILENAME')).'/thumb/',
//'upload_url' => $this->get_full_url().'/thumb/',
// Uncomment the following to force the max
// dimensions and e.g. create square thumbnails:
//'crop' => true,
'max_width' => 80,
'max_height' => 80

In node, the options are in one segment at the top of the code:

options = {
tmpDir: __dirname + '/tmp',
publicDir: __dirname + '/public',
uploadDir: __dirname + '/public/files',
uploadUrl: '/files/',
maxPostSize: 11000000000, // 11 GB
minFileSize: 1,
maxFileSize: 10000000000, // 10 GB
acceptFileTypes: /.+/i,
// Files not matched by this regular expression force a download dialog,
// to prevent executing any scripts in the context of the service domain:
inlineFileTypes: /\.(gif|jpe?g|png)$/i,
imageTypes: /\.(gif|jpe?g|png)$/i,
imageVersions: {
'thumbnail': {
width: 80,
height: 80

Please, please, please add the following easily accessible features to the upload scripts:

$unsized_image_dir = 'files/unsized/';
$thumbnail_dir = 'files/thumb/';
$max_width_unsized = $native_image_width;  //can be restricted with int value
$max_height_unsized = $native_image_height;  //can be restricted with int value
$max_width_thumb = 75;
$max_height_thumb = 75;
$max_file_size_unsized =  10000000000;
$accepted_file_types = array('jpg', 'jpeg', 'jpe', 'gif', 'tiff', 'tif', 'bmp', 'png');
//available values txt, pdf, exe, jpg, etc. etc. etc.

Note: this has nothing to do with client side image previews or re-sizing. I am looking to upload images and then re-size them server side, resulting with two separate images for every image uploaded (a normal size and a thumbnail size). I like large images in which users can click on to enlarge, similar to Imgur. I also need the thumbnails for my image gallery.

Examples need to be better documented to explain how to provide a server for Fine Uploader's use.

• Python-django server needs dependencies listed and could be brought up to date with the latest Django. Interesting to note that the qqFileUploader class implements a lot of advanced functionality.
• Ruby example
• Bugfixes / Tests

I have get error , i debug FineUpload param = null,

I have code fix , very simple

[HttpPost]
        public ActionResult Upload(HttpPostedFileBase qqfile)
        {
            if (qqfile != null)
            {
                // this works for IE
                var filename = Path.Combine(Server.MapPath("~/app_data"), Path.GetFileName(qqfile.FileName));
                qqfile.SaveAs(filename);
                return Json(new { success = true }, "text/html");
            }
            else
            {
                // this works for Firefox, Chrome
                var filename = Request["qqfile"];
                if (!string.IsNullOrEmpty(filename))
                {
                    filename = Path.Combine(Server.MapPath("~/app_data"), Path.GetFileName(filename));
                    using (var output = System.IO.File.Create(filename))
                    {
                        Request.InputStream.CopyTo(output);
                    }
                    return Json(new { success = true });
                }
            }
            return Json(new { success = false });
        }

How to get the File Path of the selected file from Fine Uploader control.Appreciate early response.

Regards
Manidipa

Hi, I am using fineuploader to uploade multiple images to S3, But I am getting an issue Signature doesn't match. And I found amazon s3 using version 4 for signature http://docs.aws.amazon.com/AmazonS3/latest/API/images/sigV4-post.png

Amazon s3 people given an example for version 4 http://docs.aws.amazon.com/AmazonS3/latest/API/sigv4-post-example.html. So I tried this example to regenerate exact same signature what they have already, But I am unable to regenerate it.

I have used django example from this repo, but this example outdated, And I solved many issues. Finally I stuck with Signature mismatch.

Code:

DateKey = hmac.new(b'AWS4'+b'wJalrXUtnFEMI/K7MDENG/bPxRfiCYEXAMPLEKEY', b'20151229', hashlib.sha256).digest()

DateRegionKey = hmac.new(DateKey, b'us-east-1', hashlib.sha256).digest()

DateRegionServiceKey = hmac.new(DateRegionKey, b's3', hashlib.sha256).digest()

SigningKey = hmac.new(DateRegionServiceKey, b'aws4_request', hashlib.sha256).digest()

signature = hmac.new(policy, SigningKey, hashlib.sha256).digest()

binascii.hexlify(signature)

Please help me

There is an example using http://flysystem.thephpleague.com/
for upload file?
Thanks

C:\Program Files\nodejs\node_global\node_modules\express\node_modules\serve-static\index.js:40 throw new TypeError('root path required')
^

TypeError: root path required at Function.serveStatic [as static] (C:\Program Files\nodejs\node_global\node_modules\express\node_modules\serve-static\index.js:40:11)
at Object.<anonymous> (C:\Users\joe\Downloads\fine\nodejs.js:40:40)
at Module._compile (module.js:652:30)
at Object.Module._extensions..js (module.js:663:10)
at Module.load (module.js:565:32)
at tryModuleLoad (module.js:505:12)
at Function.Module._load (module.js:497:3)
at Function.Module.runMain (module.js:693:10)
at startup (bootstrap_node.js:191:16)
at bootstrap_node.js:612:3

Hi,

It will be great if we have an example of server side C# / .net code ...

Thanks...

Hi,
can we use sharepoint rest api to upload file ?