[Update]Using FileReader in Chrome

Question

I set up a Apache server, put the page on the server and-problem solved. So I know this problem is caused by security settings in chrome.

Now I wonder, is it possible to let a local webpage access local files?

I'm going to make a page that allows dragging an local image onto it. Here's my code, which doesn't work in chrome

The problem is reader.onload event didn't trigger, onerror did instead.

So what's the reason? And how to fix it? Many thanks.

var oImg=document.getElementById("img1");

oImg.addEventListener('dragover', function(e) {
    e.stopPropagation();
    e.preventDefault();
}, false);

oImg.addEventListener('drop', handleDrop, false);

function handleDrop(e) {
    e.stopPropagation();
    e.preventDefault();

    var thisfile  = e.dataTransfer.files[0],
    reader = new FileReader();

    reader.onload = (function(thisfile){
        return function(e){
            oImg.src = e.target.result;
            }
        }
    })(thisfile);

    reader.readAsDataURL(thisfile);
}

That means you are running a local file, with the file:/// protocol. Chrome is purposely denying that, to be honest I'm not sure what the security implications are. If you run it from a local server instead, it should work. psema4's idea of using --allow-file-access-from-files is good, but in my experience that flag doesn't work :-/ — Matt Greer, Jul 12 '11 at 14:49
Chrome thinks this is a feature, not a bug. See http://blog.chromium.org/2008/12/security-in-depth-local-web-pages.html and http://code.google.com/p/chromium/issues/detail?id=47416. Two solutions: Use web server or use FF. — james.garriss, Dec 16 '11 at 15:23

score 3 · Accepted Answer · answered Jul 12 '11 at 14:46

I'm uncertain if this option is still available (AFAIK it is) - try opening chrome with the switch --allow-file-access-from-files

An open issue exists that may be relevant to your question. The more people star this issue the more likely it is to get fixed - see comment #1.

score 0 · Answer 2 · edited May 23 '17 at 11:45

0

The issue appears to be the security constraints around file://

Here is another stack overflow question that talks about the error.

Uncaught Error: SECURITY_ERR: DOM Exception 18 when I try to set a cookie

edited May 23 '17 at 11:45

Community

1
1

answered Jul 23 '12 at 16:08

Matthieu Cormier

2,185
1
21
32

[Update]Using FileReader in Chrome

2 Answers2

Linked