1

I am working on a project which must be self contained and able to run without an internet connection. It's is for video presentations and I need to import a .txt file which includes chapters and loop information such as Chapter Title, Looping point and chapter end point (both in frames). However, there is no client-side include script to include a text file.

What would be the best way for me to store or access a local text file so that I can iterate over it and build my chapters object? HTML5 local storage? Hacking by including a hidden iframe that loads the text file then grab that body content via JavaScript? Any help on this issue would be greatly appreciated.

Thanks!

Improve this question
4
  • If you are running the application from a local file, many browsers provide some way to access the local filesystem via ajax. Commented Oct 6, 2014 at 21:28
  • Would a file upload be acceptable, or does the file need to be read in the background when the application is loaded? Commented Oct 6, 2014 at 21:29
  • it seems what you are doing is pulling in data for display purposes. How is this data being stored? Commented Oct 6, 2014 at 23:13
  • The goal of the data is to have the chapters information entered into excel then saved as a text file. I want to read that text file, iterate over it, and build my chapters information object in JavaScript which would allow me to display chapter titles, descriptions, and such. Commented Oct 7, 2014 at 12:55

2 Answers 2

Reset to default
3

For your question "Need Access to Local Text File via JavaScript" is very similar to this question here: Local file access with javascript

The Answer is there really isn't a good way to access a local file if you are using javascript in a browser. If its just a text file on the same machine without a http/webserver you may run into some problems, as in javascript the ability to read a local file is disabled by default in most browsers. In chrome you can disable this security-feature by adding the following flag when starting the browser from command-line.

--disable-web-security

If your data is structured json, xml, csv, you can bring it in using an AJAX call if the file is hosted on a server accessible with HTTP. Without using an http ajax call, another possible solution as mentioned in the question link above:

Just an update of the HTML5 features http://www.html5rocks.com/en/tutorials/file/dndfiles/ This excellent article will explain en detail the local file access in Javascript. Summary from the mentioned article:

The spec provides several interfaces for accessing files from a 'local' filesystem:

File - an individual file; provides readonly information such as name, file size, mimetype, and a reference to the file handle. FileList - an array-like sequence of File objects. (Think or dragging a directory of files from the desktop). Blob - Allows for slicing a file into byte ranges. -- @Horst Walter

As shown below you can have a "file upload" input selection, and simply have your file path as a default option for the input"

<input type="file" id="files" name="files[]" multiple />
<output id="list"></output>

<script>
  function handleFileSelect(evt) {
    var files = evt.target.files; // FileList object

    // files is a FileList of File objects. List some properties.
    var output = [];
    for (var i = 0, f; f = files[i]; i++) {
      output.push('<li><strong>', escape(f.name), '</strong> (', f.type || 'n/a', ') - ',
                  f.size, ' bytes, last modified: ',
                  f.lastModifiedDate ? f.lastModifiedDate.toLocaleDateString() : 'n/a',
                  '</li>');
    }
    document.getElementById('list').innerHTML = '<ul>' + output.join('') + '</ul>';
  }

  document.getElementById('files').addEventListener('change', handleFileSelect, false);
</script>
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

After doing some reading on this, I am thinking this should work. Is there any way that you can think of that would allow me to dynamically pass the file name to handleFileSelect as opposed to having it triggered by a file input?
2

You can use AJAX to read the text file.
with javascript you can't edited, you can only read it.
an example will be :
1- create a text file "page.txt"
2- create a html page with this code 

<!DOCTYPE html>
<html>
<body>
<script>
    text = new XMLHttpRequest();
    text.open("GET","page.txt",false);
    text.onload = function(){
        document.write(text.responseText);
    }
    text.send();
</script>
</body>
</html>
Improve this answer

9 Comments

The question states that the solution must work without an internet connection. What would be the purpose of AJAX here?
We don't need internet to use Ajax.
Agreed, but what resource would you access with AJAX? AJAX needs a server, and in the above scenario (“self-contained”) there's no server.
You can acces any File with ajax even local ones. You may have probleme with security in google chrome.
AJAX is based on HTTP, HTTP needs a web server. There's no webserver in “self-contained”. Even if there would be a webserver running on localhost, this would not be a self-contained (i.e. portable) solution.
|

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.