从剪贴板复制和粘贴图像，blob错误

Question

I'm trying to copy and paste images from a clipboard, but I get this error message in chrome. What is wrong?

js fiddle

Error

Uncaught TypeError: Failed to execute 'readAsDataURL' on 'FileReader': The argument is not a Blob. 

JS

 $(function() {
$("body").bind("paste", function(ev) {
    var $this = $(this);
    var original =  ev.originalEvent;
    var file =  original.clipboardData.items[0].getAsFile();
    var reader = new FileReader();
    reader.onload = function (evt) {
        var result = evt.target.result; 
        var arr = result.split(",");
        var data = arr[1]; // raw base64
        var contentType = arr[0].split(";")[0].split(":")[1];

        // this needs to post to a server route that can accept raw base64 content and save to a file            
        $.post("/echo/html/", {
            contentType: contentType,
            data: data
        });                                
        $this.append("<img src='" + result + "' />");
    };

    reader.readAsDataURL(file);
    });        
}); 

Answer 1

You're problem is that, when the browser is trying to load the file through the clipboard, it is looking for a blob type of data.

Blob, or B inary L arge OB ject is a lengthy string that is your object, but instead of being a file, it is just a string.

By trying to copy from the clipboard, which has a copy of the directory of the file, at least from how the error is and how your code is, that's what it looks like, it isn't a blob file type, so Chrome isn't set up to handle the actual file.

I don't know what this is for, but if you are trying to save the files on a database, then what you should do is have the image uploaded through the form, have them placed in a directory with a unique name, and store the location of each image, the actual path, on your database.

Then, you can loop through it and do what you need to do.

If you want, I post some code I have from another project where I did this, so just ask if you want it.

It will only work if you're using a MySQL server tho; the code is written in PHP.

Blob Wiki Article