Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Developer
Posts: 71
Registered: ‎02-06-2013
My Device: 9900
My Carrier: Rogers

local storage problem

I'm trying to develop a proof of concept, but I can't get HTML5 filesystem to behave properly.

 

Bascially, I want to take the contents of a canvas, save it as a png to the persistent filesystem, then reference it as the source for an img tag.

 

I can successfully convert the canvas to png and store it in the persistent filesystem, but I can't retrieve it or use it as a source for the image.

 

I realize that I could just convert to a data URI and use that as the source, but there are other circumstances that make that solution unworkable.

 

It works perfectly in Chrome and Ripple, but not on BB10.

 

Any suggestions to get this to work? All functions are called with button presses in order to simplify the code for now:

 

//data is 'BLOB', path is 'image.png'
//src is global variable function saveFile(data, path) { if (!fs) return; fs.root.getFile(path, {create: true}, function(fileEntry) { src=fileEntry.toURL(); console.log(src); fileEntry.createWriter(function(writer) { console.log(writer); writer.write(data); }, errorHandler); }, errorHandler); }

 

function changepic(){
document.getElementById('pic1').src=src;
}

 Changepic throws the following error: GET filesystem:local:///persistent/image.png Unhandled Protocol

 

BlackBerry Development Advisor
Posts: 203
Registered: ‎12-18-2012
My Device: Z10, Q10, Q5, Z30, Z3
My Carrier: Bell

Re: local storage problem

You'll need to strip out the filesystem: prefix before setting src

Bryan Higgins
BlackBerry WebWorks
@bryanhiggins
Developer
Posts: 71
Registered: ‎02-06-2013
My Device: 9900
My Carrier: Rogers

Re: local storage problem

Thanks for the suggestion. I tried it out, but unfortunately it still throws an error:

GET local:///persistent/image.png

I feel like the file reference i'm getting is incorrect. Is there some way to access the absolute path of a file in the sandboxed filesystem?
Developer
Posts: 71
Registered: ‎02-06-2013
My Device: 9900
My Carrier: Rogers

Re: local storage problem

Is there something similar to 'blackberry.io.sharedFolder' to access the sandboxed application folder?
BlackBerry Development Advisor
Posts: 203
Registered: ‎12-18-2012
My Device: Z10, Q10, Q5, Z30, Z3
My Carrier: Bell

Re: local storage problem

No, there is no such method, but you should be able to use a local URI as image source.

 

If you look in the network tab in WebInspector what is the HTTP response code?

Bryan Higgins
BlackBerry WebWorks
@bryanhiggins
Developer
Posts: 71
Registered: ‎02-06-2013
My Device: 9900
My Carrier: Rogers

Re: local storage problem

[ Edited ]

There is no response data available, there's only a header.

Untitled.png

BlackBerry Development Advisor
Posts: 203
Registered: ‎12-18-2012
My Device: Z10, Q10, Q5, Z30, Z3
My Carrier: Bell

Re: local storage problem

Hi,

 

Sorry about that, I spoke too quickly. You cannot access files stored in persistent or temporary storage via URIs.

 

local:/// paths do work, but only for files which are included in your application content.

 

For your use-case, I would recommend using data URI. For persistence simply save the file and read it when necessary.

Bryan Higgins
BlackBerry WebWorks
@bryanhiggins
Developer
Posts: 1,280
Registered: ‎03-03-2011
My Device: Playbook, Z10, Q10, Z30 with Files & Folders and Orbit of course
My Carrier: Vodafone

Re: local storage problem


bryanhiggins wrote:

Hi,

 

Sorry about that, I spoke too quickly. You cannot access files stored in persistent or temporary storage via URIs.

 

local:/// paths do work, but only for files which are included in your application content.

 

For your use-case, I would recommend using data URI. For persistence simply save the file and read it when necessary.


So how do we load a (large) image from persistent storage into an Image object in JS? In Chrome we just set the  src property of the Image object to entry.toURL()...

 

A data URI would be very inefficient, because it would have to be base64 encoded and then decoded. For other things, like audio or video, it wouldn't even be feasible.

 

What is the maximum length of a data URI in the BB10 Webkit engine?

 

Files & Folders, the unified file & cloud manager for PlayBook and BB10 with SkyDrive, SugarSync, Box, Dropbox, Google Drive, Google Docs. Free 3-day trial! - Jon Webb - Innovatology - Utrecht, Netherlands
BlackBerry Development Advisor
Posts: 634
Registered: ‎10-01-2009
My Device: All
My Carrier: N/A

Re: local storage problem

This works for me any time I work with saved files:

 

var filepath = 'file://' + savedPath 

 

 

If that still doesn't work, you can try adding this to your config.xml as well

 

<access uri="file:///accounts/" subdomains="true" />

 

 

Developer
Posts: 1,280
Registered: ‎03-03-2011
My Device: Playbook, Z10, Q10, Z30 with Files & Folders and Orbit of course
My Carrier: Vodafone

Re: local storage problem

How do you get  the physical, absolute path of a file saved in the HTML5 FileSystem space?

Files & Folders, the unified file & cloud manager for PlayBook and BB10 with SkyDrive, SugarSync, Box, Dropbox, Google Drive, Google Docs. Free 3-day trial! - Jon Webb - Innovatology - Utrecht, Netherlands