This question is locked. New answers and comments are not allowed.
We're trying to figure out a strategy for handling the offline scenario with our icenium app. We've figured out an approach to determining if we are offline, and for caching our data access calls, but we're puzzling about how to cache calls to regular internet resources (remote views, images, remote stylesheets) for the offline scenario.
Our app uses remote views (from an internet url) and also some remote resources (profile pictures, badge images, dynamic stylesheets etc.). For the remote views, I think we will probably have to bundle them with the app instead of fetching them from remote (although it would be great not to have to do that), but for profile pictures and badge images we won't be able to do that (as they are dynamic data), but we would like to be able to make them available for the offline scenario. Application Cache (or AppCache) seems to kind of fit the bill here - allowing us to store a local cache of these key resources - so that they are available offline if we have previously fetched a copy. But it's unclear if appCache is supported by icenium (i.e. for remote view and resource requests etc.) and I wasn't able to turn up anything specific to icenium with a google search.
So my question is this I guess - is appCache supported by icenium, and if so is it fully supported on both iOS and android. If it isn't supported, does anyone have any guidance / ideas for how to best handle this scenario. This really feels like a path that other devs must have already trodden by now so I'm hoping to benefit from others experience if possible.
Our app uses remote views (from an internet url) and also some remote resources (profile pictures, badge images, dynamic stylesheets etc.). For the remote views, I think we will probably have to bundle them with the app instead of fetching them from remote (although it would be great not to have to do that), but for profile pictures and badge images we won't be able to do that (as they are dynamic data), but we would like to be able to make them available for the offline scenario. Application Cache (or AppCache) seems to kind of fit the bill here - allowing us to store a local cache of these key resources - so that they are available offline if we have previously fetched a copy. But it's unclear if appCache is supported by icenium (i.e. for remote view and resource requests etc.) and I wasn't able to turn up anything specific to icenium with a google search.
So my question is this I guess - is appCache supported by icenium, and if so is it fully supported on both iOS and android. If it isn't supported, does anyone have any guidance / ideas for how to best handle this scenario. This really feels like a path that other devs must have already trodden by now so I'm hoping to benefit from others experience if possible.
9 Answers, 1 is accepted
0
Hello,
Whether AppCache is supported depends on the platform of choice, not on Icenium i.e. Icenium is basically the IDE you use to create your app and the cloud services that build this app. The bridge between your device and the javascript you've used is all handled by Cordova.
I suggest going through the following blog post series of my colleague Jim that has tried to explain that offline support for mobile devices is not a walk in the park. You can also take a look at this post.
Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
Whether AppCache is supported depends on the platform of choice, not on Icenium i.e. Icenium is basically the IDE you use to create your app and the cloud services that build this app. The bridge between your device and the javascript you've used is all handled by Cordova.
I suggest going through the following blog post series of my colleague Jim that has tried to explain that offline support for mobile devices is not a walk in the park. You can also take a look at this post.
Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
0
Richard
Top achievements
Rank 1
Rank 1
answered on 26 Nov 2013, 05:25 PM
There is certainly support in WebKit for AppCache, but as I understand it that is supported by functionality in the host (usually a web browser, in this case the wrapper that icenium builds). Are you saying that the WebKit wrapper that icenium builds does support AppCache? I've done some tests (in the simulator and on a test app on the iPad initially) and it certainly doesn't appear to be looking for the manifest I've identified.
Would you be able to touch base with your devs to see if AppCache is supposed to be supported - if not, then I can stop trying and just log a suggestion somewhere. Thanks.
Would you be able to touch base with your devs to see if AppCache is supposed to be supported - if not, then I can stop trying and just log a suggestion somewhere. Thanks.
0
Hello,
The "wrapper" that Icenium uses is Cordova and it takes care of enabling javascript in the WebView, enabling AppCache and all other goodies without which you would not be able to run HTML 5/JS/CSS app in a native shell. According to the last post I referenced in previous reply and the Cordova changelog here, Cordova have enabled AppCache since v2.5.
Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
The "wrapper" that Icenium uses is Cordova and it takes care of enabling javascript in the WebView, enabling AppCache and all other goodies without which you would not be able to run HTML 5/JS/CSS app in a native shell. According to the last post I referenced in previous reply and the Cordova changelog here, Cordova have enabled AppCache since v2.5.
Regards,
Steve
Telerik
You've missed the Icenium Visual Studio Integration keynote? It has been recorded and posted here.
Looking for tips & tricks directly from the Icenium team? Check out our blog!
Share feedback and vote for features on our Feedback Portal.
0
Richard
Top achievements
Rank 1
Rank 1
answered on 19 Feb 2014, 02:40 PM
So here is what I've tried - I have added a reference to my custom appcache manifest file in the html file:
.. and added the manifest.appcache file to my project:
As advised in https://developer.mozilla.org/en/docs/HTML/Using_the_application_cache I've hooked up to a bunch of the appCache events to monitor what is going on, but none of them fire on iOS (viewing through remote debugger) and the debugger shows no indication that the manifest file was fetched.
Can you please, please look into this for me as getting the appCache working is a fundamental part of our app strategy and we are blocked right now. A simple sample with a manifest that works should be all we need to get going I think.
<!DOCTYPE html><html manifest="manifest.appcache">.. and added the manifest.appcache file to my project:
As advised in https://developer.mozilla.org/en/docs/HTML/Using_the_application_cache I've hooked up to a bunch of the appCache events to monitor what is going on, but none of them fire on iOS (viewing through remote debugger) and the debugger shows no indication that the manifest file was fetched.
Can you please, please look into this for me as getting the appCache working is a fundamental part of our app strategy and we are blocked right now. A simple sample with a manifest that works should be all we need to get going I think.
0
Hi Richard,
Thanks for the reply.
I did some research, because I am not pretty aware of appCache concept and I found that it is crucial to set the MIME type of the manifest file.
Would you share with us your application name so we could take a look at it?
Another thing I am wondering about is if you have tested on Android as well and whether you have issue with iOS only?
I look forward to hearing from you.
Regards,
Zdravko
Telerik
Thanks for the reply.
I did some research, because I am not pretty aware of appCache concept and I found that it is crucial to set the MIME type of the manifest file.
Would you share with us your application name so we could take a look at it?
Another thing I am wondering about is if you have tested on Android as well and whether you have issue with iOS only?
I look forward to hearing from you.
Regards,
Zdravko
Telerik
Icenium is now Telerik AppBuilder, and is part of the Telerik Platform. For more information on the new name, and to learn more about the Platform, register for the free online keynote and webinar on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT)
0
Richard
Top achievements
Rank 1
Rank 1
answered on 07 Mar 2014, 04:06 PM
Do you have a sample where you have seen this working - if that is something you can share that would be great. Are you saying this should definitely work on iOS?
0
Hello Richard,
Unfortunately, we don't have a sample that implements the appCache concept, but according to this table it should be compatible with iOS.
For more information about the API please refer to this link.
Thanks.
Regards,
Zdravko
Telerik
Unfortunately, we don't have a sample that implements the appCache concept, but according to this table it should be compatible with iOS.
For more information about the API please refer to this link.
Thanks.
Regards,
Zdravko
Telerik
Icenium is now Telerik AppBuilder, and is part of the Telerik Platform. For more information on the new name, and to learn more about the Platform, register for the free online keynote and webinar on Wednesday, February 12, 2014 at 11:00 a.m. ET (8:00 a.m. PT)
0
Mohammad
Top achievements
Rank 1
Rank 1
answered on 13 May 2014, 04:34 PM
Hi Zdravko,
you said :
"I found that it is crucial to set the MIME type of the manifest file."
The thing is, I already know that.... the problem is, where do we do this with AppBuilder? Been trying to find where to add this mime type for .appcache files, without success...
Could you please ask you dev for where to put additional mime type in AppBuilder plz?
Thank you, and have a great day
you said :
"I found that it is crucial to set the MIME type of the manifest file."
The thing is, I already know that.... the problem is, where do we do this with AppBuilder? Been trying to find where to add this mime type for .appcache files, without success...
Could you please ask you dev for where to put additional mime type in AppBuilder plz?
Thank you, and have a great day
0
Hi ,
Thank you for contacting.
Generally, the HTML 5 Application Cache should work out of the box for Android devices. In other words, you do not need to set the .appcache MIME type for them, anywhere. However, in iOS the things are different and the Application Cache is not supported for hybrid apps. This is so, as currently there is no way to set the MIME type for the manifest files. This is why we recommend trying other caching approaches like using localStorage and load the files from there when in offline mode. This article is a good starting point. You can store your application version in the localStorage as well and load images from localStorage when the version is unchanged and reload and store them when you change the application version. Here is a sample code you can use:
I hope the above helps.
Regards,
Kaloyan
Telerik
Thank you for contacting.
Generally, the HTML 5 Application Cache should work out of the box for Android devices. In other words, you do not need to set the .appcache MIME type for them, anywhere. However, in iOS the things are different and the Application Cache is not supported for hybrid apps. This is so, as currently there is no way to set the MIME type for the manifest files. This is why we recommend trying other caching approaches like using localStorage and load the files from there when in offline mode. This article is a good starting point. You can store your application version in the localStorage as well and load images from localStorage when the version is unchanged and reload and store them when you change the application version. Here is a sample code you can use:
01.document.addEventListener('deviceready', function () {02. 03. // change project version when you want to update the files in the local storage - application cache is working in similar way04. var projectVersion = "0.0.1";05. 06. // describe scrtipts to cache07. var scripts = ["http://www.w3schools.com/html/demo_time.js"];08. 09. // describe images to cache10. var images = ["http://www.w3schools.com/html/img_logo.gif"
];11. 12. // scripts - array of script urls, images - array of images - the html should contain img element with the same ID as the url of the stored img. cachedScripts and cachedImages are key-value pairs13. var defaultProjectStructure = {14. "projectVersion": projectVersion,15. "scripts": scripts,16. "cachedScripts": {},17. "images": images,18. "cachedImages": {}19. }20. 21. var localDB = JSON.parse(localStorage.getItem("myProject"));22. if(localDB !== null && localDB.projectVersion === projectVersion) {23. 24. if(localDB.projectVersion === projectVersion) {25. loadScripts();26. loadImages();27. }28. 29. } else {30. localStorage.removeItem("myProject");31. 32. myProjectObject = JSON.stringify(defaultProjectStructure);33. 34. // set values to myProjectObject for scripts and images35. storeImages(defaultProjectStructure.images);36. storeScripts();37. localStorage.setItem("myProject", myProjectObject);38. }39. 40. function storeImages(images) {41. for(var i = 0; i < images.length; i++) {42. storeImage(images[i]);43. }44. }45. 46. // example for storeImage47. function storeImage(image) {48. var img = document.getElementById(image),49. imgCanvas = document.createElement("canvas"),50. imgContext = imgCanvas.getContext("2d");51. 52. // Make sure canvas is as big as the picture53. imgCanvas.width = img.width;54. imgCanvas.height = img.height;55. 56. // Draw image into canvas element57. imgContext.drawImage(img, 0, 0, img.width, img.height);58. 59. // Get canvas contents as a data URL60. var imgAsDataURL = imgCanvas.toDataURL("image/png");61. 62. myProjectObject.cachedImages[image] = imgAsDataURL;63. }64. 65. function storeScripts(scripts) {66. //store scripts67. }68. 69. function loadScripts(scripts) {70. //load Scripts71. }72. 73. function loadImages(images) {74. //loadImages75. }76. }, false);I hope the above helps.
Regards,
Kaloyan
Telerik
Share what you think about AppBuilder and Telerik Platform with us in our feedback portal, so we can become even better!