ebidel / filer.js Goto Github PK
View Code? Open in Web Editor NEWA wrapper library for the HTML5 Filesystem API what reuses UNIX commands (cp, mv, ls) for its API.
License: Other
A wrapper library for the HTML5 Filesystem API what reuses UNIX commands (cp, mv, ls) for its API.
License: Other
Crucial for using persistent storage.
Minimal example
var filer = new Filer();
filer.init({size: 1024 * 1024}, function() {
filer.open('xxx.data', function() {
console.log('SUCCESS');
}, function(e) {
console.log('ERROR', e);
});
});
What do I expect to see:
If xxx.data
does not exist, second function should be executed.
What do I actually see:
Uncaught Error: "filesystem:chrome-extension://fcgfaidpicddcilhjhafmmcgfodijhjd/temporary//xxx.data" does not exist.
I am have some issues with mkDir.
I have an array that lists some files to download (using the filer-download.js addon) and I am looping through each array item using jQuery $.each().
I get the following errors in the console:
filer.js:567 FileError is deprecated. Please use the 'name' or 'message' attributes of DOMError rather than 'code'.
filer.js:568 Uncaught TypeError: Cannot set property message of # which has only a getter(anonymous function) @ filer.js:568
I need the following directory structure:
etc
I have tried using mkDir to create the main_dir, then in the loop, tried to create the sub_dirs, but I just get multiple of the error show above.
I have initialized Filer with 1000mb and persistent storage.
Add ability to append to an existing file.
Commit: 04bd4af
SECURITY_ERR: Are you running in incognito mode.
May I ask how to solve this problem
I'm not sure if this is a bug in filer.js because it's kind of obvious:
When I use mkdir() it works fine, but inside the last folder there is another folder called "null". In filer.js (line ~553) there is an if-statement if(folders.length && folderParts.length != 1)
. If folders.length
is 1
it's the last time createDir(dirEntry, folders.slice(1))
is going to be called. But the parameter folders.slice(1)
removes the last element and calls createDir()
with an empty array folders
. Now folders[0]
is undefined
and I think that causes the "null"-folder - I just wonder why its name isn't undefined
instead.
In addition that "null" folder is passed as parameter to successCallback function. So in successCallback this.name
is null
.
But it works for me when I change the line to if(folders.length > 1 && folderParts.length != 1)
.
Well, I saw someone submitted an issue about the mkdir function but it has been another problem. I wonder if that person didn't run into that problem or just hasn't noticed it. But wait, I'll check that issue again, maybe this is the reason for the other one...
I do get the error below when I try to seek permission for reading/writing persistent files in Chrome Version 64.0.3282.167 (Official Build) on windows.
filer.js:453 Uncaught TypeError: self.requestFileSystem is not a function at Filer.<anonymous> (filer.js:453) (anonymous) @ filer.js:453
It works when I change the function to be invoked from self.requestFileSystem
to window.requestFileSystem
Ok, I am trying to create a web app using filer.js, but I do not pretend to publish on a server, and I will use the app locally file://...
just for me, and I am using Google Chrome version 20.0.1132.47
. I got some errors while using filer.js, and thought it was my app, but then I downloaded your demo and ran it locally (but with the --allow-file-access-from-files
flag), and almost everything worked (dropping files, creating folders and I can even see all the files at filesystem:file:///temporary/
, but it gives an error when I try to run the filer.open()
function (by clicking "preview file"). The error is: Uncaught Error: Problem getting Entry for one or more paths.
at file.min.js:7
. I tried to read the codes and fix but I cannot fix it ( sorry, I`m sort of new at HTML5 filesystem api). Could you help me please?
Thanks a lot,
Daniel
p.s: Excuse my bad English, because I am not american and I am new to Github...
I'll try and patch this when I get a chance.
Should probably add a check for window.FileError before using... want a patch for this?
I think your library is excellent but ...
I guess that semantics of ls() (derived from UNIX "ls" command) presupposes its read only behavior. In your implementation it changes current working directory. For example these steps:
mkdir('/dir1' ....
ls('/dir1/' ...
mkdir('/dir2' ...
lead to the following dir structure:
/dir1/dir2
(dir2 is a sub-folder)
while these ones (just without intermediate ls()):
mkdir('/dir1' ....
mkdir('/dir2' ...
to this structure:
/dir1
/dir2
(both dirs are in the root)
mkdir (exclusive) immediately after removing that same path will fail.
e.g. this test will fail:
asyncTest('rm-new-sub-path', function() {
var filer = this.filer;
var folder_name = this.FOLDER_NAME + Date.now();
var folder_name_sub = folder_name + '/1/2/3/4/5/6/7/8/9/A/B/C/D/E/F';
filer.mkdir( folder_name_sub, false, function() {
filer.rm( folder_name_sub, function() {
filer.mkdir( folder_name_sub, true, function() {
ok( true, 'Could make unique directory after removed');
start();
}, onError );
}, onError );
}, onError );
});
Since the source already contains closure-ish type annotations, it would be nice if they were actual closure type annotations.
It looks like there's a problem with tagging policy, but I'm not totally sure.
Problem:
filer.js installed through bower and filer.js cloned as git repo differs, though share the save build number.
Steps to reproduce:
* What I expect to see:*
I expect to have whether two equal files whether two different files with different build numbers.
What I actually see:
I that that in bower version Filer.prototype.df
method is missing, though both files share the same build number (0.4.2, to be precise)
Details:
bower version in 1.2.6, but it does not look like something bower-specific.
What do you think of a find command?
Filer.find(params, successCallback, opt_errorHandler);
Where params could be an object, or a string.
If a string was supplied it would be a regexp representation of a filename.
Whereas if an object was supplied there would be various options such:
You can't handle the error when the file you are trying to open does not exist.
https://github.com/ebidel/filer.js/blob/master/README.md
filer.js takes a different approach by reusing familiar UNIX commands (
cp
,mv
,ls
)
create
-> touch
open
-> cat
write
-> echo
(as in echo foo > bar
; debatable)
Are you aware of shelljs? It's the server-side equivalent of filer.js. It also has a ton more commands.
The demo app has turned out to be a really useful component for me. There are a couple features that I think would make it even more useful:
I can read and write a file in the root.
But if I use directories in any way nothing is working.
I tried absolute and relative pathes, with filesystem: or / as root, but everytime it throws ___ does not exist.
Even if .cd(dir) before relative path.
Maybe it is possible to use the directory-/file- objects rather than the path as string, but that means to traverse any directory from start!?
Maybe someone has a hint?
Uses a[download]
Util
is a too generic name for a class and can have conflicts with other libraries.
I would suggest you to rename it on a new major version.
FilerUtil
sounds better IMHO.
Regards.
Hi,
It would be great integrate this component to view DXF files:
https://github.com/gdsestimating/three-dxf
I mean generating the thumbnail based on the DXF file
Thanks!
I'm writing a Chrome extension and added below code in content script.
I'm getting the following error:
Error in event handler for runtime.onMessage: Error: Filesystem has not been initialized.
at Object.Filer.create (chrome-extension://fgagghgfkjlcgiamgopcfoomblpnglko/filer.js:616:13)
var filer = new Filer();
filer.init({persistent: true, size: 1024 * 1024}, function(fs) {
// filer.size == Filer.DEFAULT_FS_SIZE
// filer.isOpen == true
// filer.fs == fs
}, onError);
filer.create('/home/myFile.txt', false, function(fileEntry) {
// fileEntry.name == 'myFile.txt'
}, onError);
unix command df
.
df -- display free disk space.
Now there is no wrapper function in filer.js to query the usage. I suggest implementing a df
function which will be a wrapper around queryUsageAndQuota
. It'll provide how much space is used and how much space is free.
I'm into implementing this, will send a pull request when done.
Hello,
I know maybe it is without of you scope: I am interested to make some filer functions synchronous.
Before I start to reinvent the wheel, I would like to ask if you can get me a hint where to start?
regards,
Till
please make this script compatible with https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-file/
Cordova developers really need it!
Thanks
Not sure if this should be a filer.js issue or an idb.filesystem.js issue (or neither), but trying to initialize a persistent filesystem in Firefox (Aurora 15.0a2 (2012-07-11)) throws a "self.webkitStorageInfo is undefined" error.
Introduced I believe with ce43162
I've used it in canary (v28) and got this:
'window.webkitStorageInfo' is deprecated. Please use 'navigator.webkitTemporaryStorage' or 'navigator.webkitPersistentStorage' instead.
Rock on Eric.
Apparently, you moved a file to the dist
folder on patch version: 0.4.4...0.4.5
This is completely BC break. For my case, my asset compiler broke because of a not found file:
[RuntimeException]
The source file "/code/app/../web/assets/lib/filer.js/src/filer.min.js" does not exist.
If you follow semver conventions, this kind of things should be done on a major version for a stable project or a minor for an unstable 0.x
one (this is your case AFAIK), but never on a patch version.
This is OK now and I hope this issue will help people searching why the new patch version is not working anymore.
Thank you fore reading and considering this issue. ๐
Regards
when you try to cd into a non-existant directoy the opt_errorHandler doesn't get called.
Due to [1], the demo application displays "SECURITY_ERR" when running in incognito mode. It would be nice to give the user a hint regarding the possible cause of the error.
[1] http://code.google.com/p/chromium/issues/detail?id=93417
The reason it is impossible to catch exception raised in your library is because once the callback is called, the try/catch block is over.
(foo.bar is not on filesystem)
f = new Filer();
f.init({persistent: true, size: 20*1024*1024}, function (fs)
{
manage_error = function (e) {console.log('error' + e);}
try
{
f.open('foo.bar', function() { console.log('opened');}, manage_error);
}
catch (e)
{
// never execute!
console.log(e.message);
}
});
So no way to test if a file exist or not, it is better not using exception and use only callback.
I've had a lot of success using this library with Cordova on iOS and newer versions of Android, however I've noticed an error is thrown in older versions of Chromium (the web view used by Cordova). I've had to (more or less) add this work around in all cases:
try {
blob = new Blob([buffer], { type: mime });
} catch(e) {
if (window.BlobBuilder){
blob = new BlobBuilder();
blob.append(buffer);
blob = blob.getBlob();
} else {
throw "No Blob or BlobBuilder constructor.";
}
}
In particular, this is a problem for me here in filer.js:794-795
I'm not really sure how fantastic this solution is. Do you know of a better method of approaching this?
I believe the lib can be used, but making it more friendly for workers
might be worthwhile. There's a synchronous API.
So, I created script like this.
var filer = new Filer();
filer.init({persistent: true}, function (fs) {
console.log('success');
test();
}, onError);
function test() {
// create new file
filer.create('myFile.txt', false, function(fileEntry) {
}, onError);
}
after listing files under root I see my "myFile.txt"
filer.ls('..', function (entries) {
console.log(entries);
}, onError);
But where can I find it physically?
filer.js works awesome in Chrome. However, when loaded as a Chrome App, I get SecurityError with the message "It was determined that certain files are unsafe for access within a Web Application, or that too many calls are being made on file resources." when invoking self.requestFileSystem in the following lines for both Temporary and Persistent.
Line 453 and 457 is the one throwing an error.
I have Chrome browser version 74+ which works great on Windows and Chromebook.
Issue is when running it as a Chrome App on the same Chromebook where it works fine on Chrome browser.
From debugging, self.requestFileSystem is undefined so it uses self.webkitRequestFileSystem instead.
I've been trying to figure this out for days and I can't get rid of that SecurityError.
Please help.
Below is my Chrome App manifest.json:
{
"name": "Signage Player",
"version": "0.1",
"manifest_version": 2,
"minimum_chrome_version": "37.0.0.0",
"permissions": [
"webview",
"power",
"storage",
"videoCapture",
"geolocation",
"pointerLock",
"system.display",
"syncFileSystem",
"webNavigation",
"fileSystem",
"fileSystem.write",
"fileSystem.requestFileSystem",
"fileSystem.retainEntries",
"fileSystem.directory",
"accessibilityFeatures.read",
"accessibilityFeatures.modify"
],
"app": {
"background": {
"scripts": [
"js/foam.js",
"js/cab.js",
"config.js",
"background_main.js"
]
}
},
"kiosk_enabled": true,
"default_locale": "en",
"icons": {
"128": "img/Signage-128.png"
}
}
What I wanted to do: Create a directory and execute a function afterwards, but do something else if the folder aldready exists. So I thought I can pass function 1 as successCallback
and the second function as opt_errorHandler
that will be executed if the folder already exists. But it didn't work.
So I inspected the source code of filer.js and discovered that opt_errorHandler
will only be executed if(e.code == FileError.INVALID_MODIFICATION_ERR)
. Otherwise nothing happens.
MDN says this error will occur if you do things like copy a folder into itself or moving a file into the same folder where it already resides without changing the filename. In a function like mkdir()
this will never happen. So opt_errorHandler
will never be called. And the same issue goes for create()
as well.
If I change INVALID_MODIFICATION_ERR
to FileError.PATH_EXISTS_ERR
it works all fine.
Is there a reason why it is handled this way? Or wouldn't it be even better if opt_errorHandler is called no matter what the value e.code
is? So developers can choose what to do if an error occurs and even do different things, depending on the error code.
Now, I haven't checked all the other functions but I think all of them should behave like that.
Chrome 32.0.1700.102 shows the following console warning:
"FileError is deprecated. Please use the 'name' or 'message' attributes of DOMError rather than 'code'."
:p
write('aa') then write('b') to the same file. The file will be 'ab'.
I use node.js an server and get mp3 buffer from android client.The i need to play the mp3 buffer reatime across the browser,so i want to put the mp3 buffer to a temporary MP3 file and play it. How can i do?
//...
// Prevent errors in browsers that don't support FileError.
if (self.FileError === undefined) {
var FileError = function() {};
FileError.prototype.prototype = Error.prototype;
} else {
var FileError = self.FileError;
}
//...
};
return Filer;
};
if (typeof exports !== 'undefined') {
if (typeof module !== 'undefined' && module.exports) {
exports = module.exports = Filer;
}
exports.Filer = Filer;
}
It would be really useful if the async functions used promises (at least as an alternative to the parameters), it would really help for doing async composition and would probably help the codebase stay clean.
qunit.js and qunit.css (available from http://qunitjs.com/) are needed to run the filer.js tests, but they aren't included in the repo
Hey Eric,
i copied following function to use in my project with MIT license:
https://github.com/ebidel/filer.js/blob/master/src/filer.js#L137
Hope thats okay?
Sorry for opening an issue, i had no other possibility to contact you.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.