CODEWITHSUNDEEP
javascripthtmlfilereader
user840866
user840866

Reputation: 265

[Update]Using FileReader in Chrome

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);
}

Upvotes: 4

Views: 3430

Answers (2)

Matthieu Cormier
Matthieu Cormier

Reputation: 2185

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

Upvotes: 0

psema4
psema4

Reputation: 3047

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.

Upvotes: 3

Related Questions