{"id":2212,"date":"2022-08-30T15:22:59","date_gmt":"2022-08-30T15:22:59","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/01\/04\/javascript-previews-with-new-filereader-api-and-dataurls-seem-inefficient-collection-of-common-programming-errors\/"},"modified":"2022-08-30T15:22:59","modified_gmt":"2022-08-30T15:22:59","slug":"javascript-previews-with-new-filereader-api-and-dataurls-seem-inefficient-collection-of-common-programming-errors","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2022\/08\/30\/javascript-previews-with-new-filereader-api-and-dataurls-seem-inefficient-collection-of-common-programming-errors\/","title":{"rendered":"Javascript previews with new FileReader API and DataURLs seem inefficient-Collection of common programming errors"},"content":{"rendered":"<p>You can also store data on the client&#8217;s disk (in another location so that you can access the file using JavaScript). This article is quite extensive when it comes to this subject:<\/p>\n<p>http:\/\/www.html5rocks.com\/en\/tutorials\/file\/filesystem\/<\/p>\n<p>It&#8217;s not supported on all browsers though.<\/p>\n<p>You have to request storage space (the file system), then create a file, write data to it, and finally fetch the URL:<\/p>\n<pre><code>window.requestFileSystem(window.PERSISTENT, 5*1024*1024, function(fs) {\n    fs.root.getFile(filename, {create: true}, function(fileEntry) {\n        fileEntry.createWriter(function(fileWriter) {\n            var arr = new Uint8Array(data.length);\n\n            \/\/ fill arr with image byte data here\n\n            var builder = new BlobBuilder();\n            builder.append(arr.buffer);\n            var blob = builder.getBlob();\n\n            fileWriter.write(blob);\n\n            location.href = fileEntry.toURL(); \/\/ navigate to file. The URL does not contain the data but only the path and filename.\n        });\n    });\n}, function() {});\n<\/code><\/pre>\n<p id=\"rop\"><small>Originally posted 2014-01-04 14:19:43. <\/small><\/p>","protected":false},"excerpt":{"rendered":"<p>You can also store data on the client&#8217;s disk (in another location so that you can access the file using JavaScript). This article is quite extensive when it comes to this subject: http:\/\/www.html5rocks.com\/en\/tutorials\/file\/filesystem\/ It&#8217;s not supported on all browsers though. You have to request storage space (the file system), then create a file, write data [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-2212","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2212","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=2212"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/2212\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=2212"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=2212"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=2212"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}