4

I am working on an web site which will be packed in an .exe file. So the site will only be used offline. Now i need to parse an local xml document. How can i get the file handle to a local file using html5 file api?

EDIT: I dont want to use <input...> or dragging file into browser.

naXa stands with Ukraine
  • 35,493
  • 19
  • 190
  • 259
user1324258
  • 561
  • 2
  • 8
  • 25

3 Answers3

13

I'm afraid I may be the bearer of bad news for your design: The action you are requesting expressly violates the security model as specified in the File API spec. The client implementation of FileReader() must make sure that "all files that are being read by FileReader objects have first been selected by the user." (W3C File API , 13. Security Considerations: http://www.w3.org/TR/FileAPI/#security-discussion).

It would be a huge security risk of browser scripts could just arbitrarily open and read any file from a path without any user interaction. No browser manufacturer would allow unfettered access to the entire file system like that.

If your script really needs that XML file, you are going to have to instruct users on how to grant the browser access to it, as every browser will prevent your code from opening it directly without user action.

Phil Nicholas
  • 3,681
  • 1
  • 19
  • 23
  • Although the File API does not allow this, it is possible to read and modify local files using the [File System Access API](https://developer.mozilla.org/en-US/docs/Web/API/File_System_Access_API). – Anderson Green Feb 18 '22 at 02:18
  • @AndersonGreen: No, the (now-abandoned) File System API does **not** allow local file access. That's perhaps the most misunderstood aspect of it. Please read more here: https://stackoverflow.com/tags/html5-filesystem/info – Phil Nicholas Feb 18 '22 at 16:12
  • The File System Access API does not have the same limitations as the File System API. Unlike the File System API, it can [modify local files and directories](https://web.dev/file-system-access/). – Anderson Green Feb 18 '22 at 20:25
1

Well, technically there is indeed a way, but you're going to (hopefully) need to bypass the browser's security settings, and it is inherently unsafe, but no more so than anything else requiring specific file locations.

That said...

<html>
  <head>
    <script>
      function foo(){
        //insert desired filereading script here.
      }
      document.getElementById("fileFoo").click();
    </script>
  </head>
  <body>
     <input type="file" id="fileFoo" display="hidden" value="filepath.extension" onclick="foo"/>
  </body>
</html>

Naturally, I've kept this vague (and slightly unorthodox) for my reasons, but provided you have the necessary control over the environment, it's completely possible.

Algorath
  • 93
  • 1
  • 9
  • 1
    Not sure what you're trying to say here. The .click() call will simply open the file selection dialog, as it's not possible to pass any "value" information to the file input fields. – sp00n Apr 07 '14 at 11:39
1

I am experiencing the same problem these days. I need the website to display some data each time I launch the webpage. The data need to be adaptive to each launch, automatically, so I don't think @Augusto 's link could solve your question.

After trying out different ways (including writing a temporary local XLM or JSON file), I finally persuade myself that maybe "replacing" the "data" in the html file could be the most straightforward way.

I have a html template, within which there is a string like [data]. Each time when launch the webpage, [data] will be replaced by real data like [1,2,3]. So actually it is the new file that is launched.

You can go to enter link description here to see how the "replace" is done. Good luck.

ehfaafzv
  • 181
  • 1
  • 2
  • 7