Volatil3
Volatil3

Reputation: 14978

Chrome: Unable to use FileSystem API due to the error "Uncaught ReferenceError: FileError is not defined"

I am working on a Chrome Extension which will read file from the drive. For testing purpose I am using the code given online to test FileSystem APIs. Upon running I get error

Uncaught ReferenceError: FileError is not defined

I am on OSX. I even added the flag by doing like below but no difference:

open /Applications/Google\ Chrome.app --args --allow-file-access-from-files

What is wrong being done by me? The code given below:

<!DOCTYPE html>
<html>
<head>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    <meta charset=utf-8 />
    <title>Chrome File API tester</title>

    <script>
        window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;

        // Handle errors
        function errorHandler(e) {
            var msg = '';

            switch (e.code) {
                case FileError.QUOTA_EXCEEDED_ERR:
                    msg = 'QUOTA_EXCEEDED_ERR';
                    break;
                case FileError.NOT_FOUND_ERR:
                    msg = 'NOT_FOUND_ERR';
                    break;
                case FileError.SECURITY_ERR:
                    msg = 'SECURITY_ERR';
                    break;
                case FileError.INVALID_MODIFICATION_ERR:
                    msg = 'INVALID_MODIFICATION_ERR';
                    break;
                case FileError.INVALID_STATE_ERR:
                    msg = 'INVALID_STATE_ERR';
                    break;
                default:
                    msg = 'Unknown Error';
                    break;
            };
            console.log('Error: ' + msg);
        }

        // Init and write some data to a file
        function onInitFs(fs) {
            fs.root.getFile('log-f-api.txt', {create: true}, function(fileEntry) {

                fileEntry.isFile === true;
                fileEntry.name == 'log-f-api.txt';
                fileEntry.fullPath == '/log-f-api.txt';
                // Create a FileWriter object for our FileEntry (log.txt).
                fileEntry.createWriter(function(fileWriter) {

                    fileWriter.onwriteend = function(e) {
                        console.log('Write completed.');
                    };

                    fileWriter.onerror = function(e) {
                        console.log('Write failed: ' + e);
                    };

                    // Create a new Blob and write it to log.txt.
                    if (!window.BlobBuilder && window.WebKitBlobBuilder)
                        window.BlobBuilder = window.WebKitBlobBuilder; // in Chrome 12.
                    var bb = new BlobBuilder();
                    bb.append("some stuff");
                    console.log("bb size:"+bb.size);
                    bb.append('put some nice text in our file....');
                    var ourData = bb.getBlob('text/plain');
                    fileWriter.write(ourData);
                }, errorHandler);
            }, errorHandler);
        }

        // start the party
        $(function() {
            document.getElementById('hello').innerHTML = 'start the tests';
            window.requestFileSystem(window.PERSISTENT, 5*1024*1024, onInitFs,errorHandler);
        });

    </script>

</head>
<body>
<p id="hello">Tester FIle API</p>

<h4>Other links</h4>
<ul>
    <li>http://code.google.com/chrome/extensions/trunk/fileBrowserHandler.html#event-onExecute</li>
    <li>http://html5rocks.com</li>
</ul>

</body>
</html>

Upvotes: 0

Views: 1887

Answers (2)

Yigal
Yigal

Reputation: 314

As @wOxxOm points out, FileError is obsolete and should be avoided.

DOMError interface is also deprecated.

Just update errorHandler function with the error codes from here: https://developer.mozilla.org/en-US/docs/Web/API/FileError#Error_codes

Upvotes: 1

random
random

Reputation: 7891

FileError objects are passed to error callbacks.

https://developer.mozilla.org/en-US/docs/Web/API/FileError

There is no errorHandler in your code.

window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
window.requestFileSystem(window.TEMPORARY, 5*1024*1024, initFS, errorHandler); // This is missing

Source - https://code.tutsplus.com/tutorials/toying-with-the-html5-file-system-api--net-24719.

Upvotes: 0

Related Questions