how to create/initialize the file object using file path html5

Question

there is many examples of reading local files using html5 but by choosing from list of files , my problem is that i want to create the file object manually , think about i have a file with the link

file:///G:/Users/txt.txt

i want the browser to open it ,

i think it have to File f=new File('file:///G:/Users/txt.txt');

my question is how to create/initialize the file object using file path ?!

I would not be surprised if this was not possible due to file system differences (UNIX vs. Win convention etc.) and security. I certainly would not want my browser to override some file of mine without me knowing about it. :) — Juho Vepsäläinen
– Juho Vepsäläinen, Commented May 9, 2011 at 7:02
developing mobile app using html5 , trying to save some data to SDCard and retrieve it again — Yahia
– Yahia, Commented May 9, 2011 at 7:04
I think it might be easier for you to rely on localStorage. See dev.w3.org/html5/webstorage . — Juho Vepsäläinen
– Juho Vepsäläinen, Commented May 9, 2011 at 8:00
my stored data is being very big with time , i want to save it on SD — Yahia
– Yahia, Commented May 10, 2011 at 3:04

Ashish · Accepted Answer · 2018-03-06 09:53:35Z

37

I have used below workaround since File inherits blob interface.

var getFileBlob = function (url, cb) {
        var xhr = new XMLHttpRequest();
        xhr.open("GET", url);
        xhr.responseType = "blob";
        xhr.addEventListener('load', function() {
            cb(xhr.response);
        });
        xhr.send();
};

var blobToFile = function (blob, name) {
        blob.lastModifiedDate = new Date();
        blob.name = name;
        return blob;
};

var getFileObject = function(filePathOrUrl, cb) {
       getFileBlob(filePathOrUrl, function (blob) {
          cb(blobToFile(blob, 'test.jpg'));
       });
};

getFileObject('img/test.jpg', function (fileObject) {
     console.log(fileObject);
});

edited Mar 6, 2018 at 9:53

answered Jun 17, 2015 at 15:32

Ashish

8,60512 gold badges61 silver badges94 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bagusflyer Over a year ago

I have to use XMLHttpRequest even for a local file path?

Stradosphere Over a year ago

Does this work on android too, works well on iOS but android seems to not like it....?

James Williams · Accepted Answer · 2012-07-23 20:58:48Z

2

There really is no way to create a file without permission from the user. A button or something will need to be pressed. You would need to create a data:uri in order for it to save. You can find more information using a web search or checking out http://en.wikipedia.org/wiki/Data_URI_scheme (not a complete source but can show what is possible). This is very limited depending on phone and OS. Data URI are limited while using IE.

When it is triggered for download, it saves to t he default location or user specified. You may also want to look into vendor/OS specific API Calls that can do as you are describing. But may need to verify permissions prior to actually allowing access.

answered Jul 23, 2012 at 20:58

James Williams

4,2261 gold badge21 silver badges35 bronze badges

Collectives™ on Stack Overflow

how to create/initialize the file object using file path html5

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related