Store reference to a file on disk in a browser's localstorage

Question

It seems with the current File API, the only way to access a previously added file is to store the entire File Object in local-storage. This can quickly eat away at the browsers memory when multiple files are added.

I was wondering if there is a way to only store some type of reference to the file in local-storage and be able to access that file with its reference.

I tried using the URL.createObjectURL function to generate a URL for the file but that URL is tied to the document and expires when the page is reloaded. Does any alternative exist?

Answer 1

By "quickly eat away at the browser's memory", I'm assuming you mean that your quota for LocalStorage is being used up by the files you're storing there. The local storage quotas are there to prevent websites from using up too much of a user's local disk space. By default, most browsers limit the storage to 5MB per domain.

From the w3 spec , the local storage quota is actually a feature to prevent what you're asking from happening (ie a website storing more files on a user's disk than the user has allowed quota for):

User agents should limit the total amount of space allowed for storage areas, because hostile authors could otherwise use this feature to exhaust the user's available disk space.

User agents should guard against sites storing data under their origin's other affiliated sites, eg storing up to the limit in a1.example.com, a2.example.com, a3.example.com, etc, circumventing the main example.com storage limit.

User agents may prompt the user when quotas are reached, allowing the user to grant a site more space. This enables sites to store many user-created documents on the user's computer, for instance.