简体   繁体   中英

Is it possible to load a file with JS/HTML5 FileReader on non served page?

I want to create a simple game in HTML5/JS and I don't want the user to run any webserver or to have to connect to a website. (just an HTML page)

But it looks like FileReader can only be used on files type inputs.

Is it possible to have only two files : index.html and foo.txt side by side and to read foo.txt from index.html with something like :

// No input needed, I know waht I want to read
var my_file = new File("foo.txt");
var reader = new FileReader();
alert( reader.readAstext( my_file, "UTF-8" ) );

Any idea ?

I believe that this is your answer: How to open a local disk file with Javascript?

In short, you are looking something like this:

<input type="file" id="files" name="file" />

HTML5 allows you to load files which are stored locally on computer, but you cannot select it. User must select file which he/she wants to be loaded.

Just imagine what would happen when developers (or better spoken, hackers) would have access to everyones local data...

This is an old question and I'm sure that plenty of people have run into the same problems since but once JS gets towards being a standalone application ( and this is an annoying thing to have to hack one's way around but I guess increasingly JS apps will be client-server anyways ) then it starts to be necessary to put together some supporting tools anyway.

One way to create data in a maintainable way and then pass it to JavaScript that I am using is to write a simple script that takes a set of content files and parses the content into JSON in a big old data.js file. This can then be included and behave exactly the same as regular Javascript objects. One could also use JSON to store the data in the first place, of course, but that is a lot more verbose than something like simple CSV if you have a lot of data for your application.

I have a cheat code for this case.

I named my JSON file as a .js : jsonfile.js , which contains my json data as a string variable :

var jsondata = '{ "foo" : "bar" }';

In my index.html, I include it, before my .js with the code :

<html> 
<head> 
<script type="text/javascript" src="mydata/jsonfile.js"></script>
<script type="text/javascript" src="js/mycode.js"></script>

Then I can get my data as JSON object in mycode.js like this :

var data = JSON.parse(jsondata);
alert(data.foo);

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM