I am using #ionic/storage as it looked quite promising after reading about it in the V2 Docs.
I use Chrome on my Windows 10 laptop so things appeared to be working perfectly fine at first. However, when I tested it on iPad, or even Firefox on my laptop, I was surprised to find out it did not work.
I was able to resolve the issue on Firefox by removing the sqlite plugin (I thought I will add it when I am ready for native testing):
cordova plugin remove cordova-sqlite-storage --save
Sadly, storage still doesn't work on the iPad. I tested it on Safari and Chrome. I am unable to debug this given the lack of developer tools or console.
I am quite frustrated how Apple makes you dependent on using a Mac to develop on their devices.
How do I go about fixing and debugging this?
I first import storage in Ionic 2:
import { Storage } from '#ionic/storage';
Then to save the data, I do this:
this.storage.set(pk, JSON.stringify(reportObj));
Where pk is just a unique key, and reportObj is an object that I stringify before storing. Again, keep in mind this just doesn't work in iOS.
Thanks.
Update:
So I managed to run the app in Safari and found out that .set actually works and the data gets stored in WebSQL. However, the get does not seem to work and I wasn't able to get any useful errors in the console.
OK, so after a lot of trial and error, I found out that the problem is not really with Storage. There appears to be some other issue with my UI, where it doesn't seem to work on iOS.
I decided to answer the part about testing the app on iOS while in development if you are not a Mac user. The best way for this appears to be to use Ionic View. You can use this simply by typing:
ionic upload
Make sure you create your account. In your iPad or iPhone, you can then download Ionic View app from iTune, sign in, and the app will appear there.
As you upload your code, simply upload again and almost instantly the app would upload on the device as you click Sync.
Hope other Windows users benefit from this.
Related
I'm having trouble with my app when I build it using ionic emulate ios. My loading page is always running (so the index.html) without charging my app. Yet it perfectly works with Chrome Developper Tools.
Does someone know why ?
Thanks by advance !
From the description of your problem, somewhere in the app.ts file you've enabled on launch a loading function but without any explicit duration or was set too long.
If you are using any Cordova Plugins, some bugs won't appear on the Chrome Developer since native functions are not tested so when you use an emulator native bugs become apparent. Try disabling or removing select cordova plugins to determine the root cause.
I can't seem to find an answer to this seemingly simple question. I have an app that i've built using the command line phonegap tools and when i start this app it opens up. i am using something called ios_sim (https://github.com/phonegap/ios-sim) which launches the app in the simulator and does not launch xCode (i don't quite understand why this is a feature, it seems like xCode has some useful tools)
Anyhow, my app is not functioning the same way that it does in the browser and i need to debug it. I have also already installed Charles to inspect the requests and i can verify that the correct data is coming from my API so my assumption is that there is some sort of javascript error in rendering the page (the page is partially rendered btw).
All i want to do is view the javascript errors. the same way that you would in the console if you were looking at a web page.
how do you do that?
You have to use Safari Remote Debugging with Web Inspector. See in the relating cordova docs how to do that!
Any ideas here? I am using Google Polymer with Vulcanize in order to comply with Google's Content Security Policy and not use any inline Javascript in my index.html file, but while it appears to work on Android, it is broken when I try to run it in an iOS emulator.
Is there some iOS specific thing with external javascript files that I should know about? Or any ideas as to why this is happening? Any documentation or something would be helpful, I am only slightly familiar with iOS.
Even a way to get some sort of debugging screen working with xcode would be lovely. I'm using the cordova log plugin to try to get my console.logs to do anything, but nothing is showing up, so I'm just inferring that my external javascript isn't loading.
I've been trying for a while to make my HTML5 cache manifest work with phonegap on iOS devices, but I can't get it working (it does work with the pure web version of the app though).
Has anyone have used it successfully?
(I've only founded two people saying that it has worked (1, 2), but I'm searching for more feedback)
Try having a look at this article
http://tmkmobile.wordpress.com/2012/03/04/html5-offline-solution/
I haven't worked in iOS myself but by the sound of it, as long you have correctly setup your cache spec, it should just work on iOS. Only Android needs a little extra work.
I've been doing lots of work in getting a few web apps to work offline on iOS using the HTML5 manifest. I've ran across the typical problems everyone else has and fixed them and everything seems to be working fine—except in the case where I save the web app to the desktop on my iPhone 4.
If I do this and then enable airplane mode, I get the following alert when trying to access the app via the home screen: "your-app-name could not be opened because its not connected to the internet." Accessing the app via Safari browser works fine while offline.
If anyone knows if this is an error on my part, or even the slim possibility of a work around, do tell.
Even downloading the new Financial Times web app (very well done with extensive localStorage support) results in an error when accessing it offline from the home screen.
Technical specs: Running iPhone 4 with iOS 4.3.3 (but also saw the issue in 4.3.2)
After reading the comments (especially Rowan's) I ran more tests and found the answer:
No, Apple did not disable HTML5 offline capability for web apps saved to the home screen, it works - for the most part. There is a bug that will make it not work. It doesn't seem to have anything to do with your manifest setup (unless perhaps it downloaded a bad manifest or incomplete manifest at one point.) We don't know how widespread it is but the fix is to clear your Mobile Safari Cache.
Here's the steps:
Close the web app (make sure its not sticking around in the background).
Cleared Mobile Safari cache: Settings > Safari > Clear Cache
Reopened the app (for caching).
Close the web app again (make sure its not sticking around in the background).
Enabled "Airplane Mode": Settings > Airplane Mode
Reopened the app.
It should now work offline. If it doesn't then its probably a separate manifest issue in your app. Looks like a weird bug with the browser cache - or perhaps the cache was completely full? Who knows, but that's the answer. Thanks guys.
iOS seems to be very sensitive to load issues when offline.
I was getting your "could not be opened" error when offline on a page I was working on. The problem turned out to be that the page created an iframe pointing to a site that didn't have an AppCache. Removing those iframes fixed the issue.
In my case, I handled it using window.navigator.standalone which tells you whether you're running in an iOS homescreen app. The code looked like this:
if (!navigator.standalone) insertFrames();
add this to your html:
https://web.archive.org/web/20170201180939/https://jonathanstark.com/blog/debugging-html-5-offline-application-cache?filename=2009/09/27/debugging-html-5-offline-application-cache/
I found it massively useful - even though I've created my manifest file and compared it to other people's manifests this JavaScript debugging script gave me the clue I would have never found otherwise. I apparently had syntax error in my manifest ... long story short I had to remove everything and add the paths to each file/image one by one. The end result was the same however it worked... how weird!!! does whitespace / comments affect the syntax of the file?