I am trying to setup offline support for our webapp. I would love to use a serviceWorker for that but unfortunately Safari does not support those, yet.
So I tried using the deprecated manifest file. But apparently only files from the same origin are allowed in there. We are loading our static files from a CDN (so the origin is not the same).
Is there any way to make a webapp with CDN files work offline on iOS?
One last idea would be to generate a index-offline.html file, include that one as a FALLBACK in the manifest. In there, I would point to the same files but this time not on the CDN but on our own server... But this does not seem like a nice solution to me.
Thanks in advance :-)
Jesse
As long as iOS does not support service workers, you cannot make offline work. Service worker is the core of a PWA and that can make offline work properly. We as still not sure if iOS will support offline capabilities.
Related
Application cache is deprecated which means we'll need to switch to service worker but I've done research it was mentioned..
1) "It is not possible to use a ServiceWorker in a Cordova app because the ServiceWorker API is not available to WKWebView and is not implemented in UIWebView. It is available in Safari on iOS, but not WKWebView."
//https://github.com/apache/cordova-ios/issues/414
2) Enabling appcache using private api is not working
//Enable Application cache in WKWebView
3) Cordova file & file-transfer plugin is not even recommended to use for production.
Is there any alternatives to be able to store artifacts (html, js & css files) and load for offline used? Our application needed to cached 300-400 files.
Appreciate your suggestions in advance! (:
Well to answer your question, my suggestion would be this: Get rid of those 400 files and find a more practical way to replace them.
Exactly why would you need to store so much CSS files in a Cordova app anyway? There's no logical reason that I can think of. Nor practical, loading other HTML files in the WebView goes against the SPA design principle.
Let's say a "plugin" is a collection of 5 sounds:
1.mp3 2.mp3 3.mp3 4.mp3 5.mp3
My app needs to support such plugins to switch between different sound-themes.
On Android ecosystem, I can simply create a new application that only contains those 5 mp3-files in the assets folder. It will be a plugin. Let's say its package name will be com.mysite.plugins.test
From my main application, I can list all installed apps (plugins) with package prefixes com.mysite.plugins.*. And easily access any of their assets.
I'm new to iOS world... And need something same. As far as I have researched, it's not possible... There can't be an app that contains only sounds, accessible from my main iOS app.
The only way seems to host sound-packages on my server (cloud) and download them from the main app.
However, this way requires payments for data transfer.
Am I missing some more elegant solution? Like hosting sound-packages directly on Apple servers?
Thank you!
The images in question are JPEGs and I've gotten them down to a smaller size (30kb). The wordpress site in question is responsive and this issue on happens when I'm using mobile network to load the site. Wirelessly, it has no issues but on 3G/4G, images loaded randomly, some are corrupted, images swap places, so all css and js seems messed up. I'm using W3 cache to enhance the speed, but nothing is helping. Some images are half grey, black and look corrupted sometimes. This only happens on iOS devices with safari browser.
Anyone else faced the same issue? On desktop being wired, wireless, I've never had this issue.
Not sure if it has to do with with database or overall site performance of the server. Any help is greatly appreciated.
While supporting our WordPress Clients, I've faced such an issue dozens of times There are two general reasons for such a behavior:
You're using some CDN (Content Delivery Network) which you didn't mention in your question, and different CDN servers output different website cache version. If you're using CDN, try to purge your local plugin's cache, disable your local plugin and purge your CDN cache.
Sometimes images thumbnails may be corrupted, while they still exist. Try installing "Force Regenerate Thumbnails" plugin and regenerate all the thumbnails.
Though two above reasons are the most common, the issue itself may be connected with something else as well, for example, with some particular plugin. For this case it might be a good idea to temporarily deactivate your plugins one after another and see if the issue is resolved.
In case any of these won't help, it will require some debug work, so it could be a good idea to hire some WordPress developer for about an hour to fix this.
Good Luck!
If you have access to a mac + safari you can try remote debugging your iOS device. If you do this you could open the developer toolbar for the device so you can see if the information is actually being loaded. ie. if the messed up image is 300k on the desktop site, but the iOS device is loading a 30k image, you would know you're losing data somewhere.
I've not seen this specific issue, but I've had similar issues pop up due to bad CDN links, caching plugins, and lazy loading of images.
Another note to look for would be if your theme/template/plugins are using src sets. It could be possible that your normal version of the image is fine, but the images in the srcset for mobile are all messed up.
As noted above, completely disable w3 cache to troubleshoot that it's not the issue. Then take a look at the plugins.
I'm trying to setup a iPad app to work offline. I was able to successfully get it to work but I was told to put the app in multiple sub directories. When I did this and update the cache manifest file to the new destinations of all the files I kept getting an error that the site wouldn't work because it wasn't connected to the internet. I tried multiple paths and looked up different ideas but have come up empty handed. Is their a way to get offline mode working with a site inside sub directories?
Thanks.
This shouldn't make a difference. Make sure all urls in the manifest are relative and always end the manifest with:
NETWORK:
*
Furthermore make sure you don't forget to add any images, libraries etc. from the cached url's to the manifest. Sometimes even caps can make a difference. OPen the console of the developer tools in Chrome to see what's being cached and what breaks loading the appcache.
Also make sure there are no iframes (ie. like-buttons) on the homepage(page that includes the manifest attribute in the html-tag) which is always cached.
Little trick:
If you want to fallback you're homepage place the manifest attribute in an invisible iframe on the homepage of your app.
That way you have total control over what's cached and what not.
I'm currently writing a mobile app (hopefully iOS or android) using the jquery mobile framework and phonegap.
It'll need to export/send csv files in some way to the users, but I'd be interested to hear ideas or suggestions about the best way of doing so. If this can be done on the js side of the app that'd be ideal as it's what I'm most familiar with. A couple of options I've considered are:
Uploading the file using the google docs api
Writing the file to the file system (then export e.g. via iTunes)
I'm new to this so any suggestions gratefully received! Thanks for your help
There are a few options that you could use depending on how you want it to work.
The main options would be to
Use the File API (http://docs.phonegap.com/phonegap_file_file.md.html#File) to store files on the filesystem of the device.
Upload the file to a server using a standard XMLHttpRequest.
Write a native PhoneGap plugin on each platform that you are interested in that could connect to Google docs.
As Dave pointed out you can write files with the FILE API. I have used the file api on iOs to write custom log files and havent found any yikes so far.