I am developing a Sencha-Touch + PhoneGap application for Android and I am facing an issue that the web-view gets reloaded if the app was minimized for a long time.
The same thing happened when we run any memory cleaner apps on the device(Like Android Assistant,Clean Master etc..)
There is a login functionality in my app.So if the memory is cleared, the user needs to re-login to the app and the data inside the app will also be lost.(Please note that the data is very important)
How to prevent reload on android web-view when the app comes to foreground?
Or please suggest an alternative solution for retaining the user data.
Please note that I am using cordova 2.3 and sencha touch 2.3
Thanks in advance.
I think you need a client side data storage solution. Sencha Touch offer two solutions that may help you with this issue.
localstorage - http://docs.sencha.com/touch/2.3.1/#!/api/Ext.data.proxy.LocalStorage
Specify a proxy on your store to use local storage
proxy: {
type: 'localstorage',
id : 'important-data'
}
sql storage - http://docs.sencha.com/touch/2.3.1/#!/api/Ext.data.proxy.Sql
Specify a proxy on your store.
proxy: {
type: "sql"
}
With either of the above solutions your data will be available client side independent of the webview being reloaded.
Related
I'm building a meteorjs app and deploying it as a native (cordova) app for Android and iOS.
I need to deep link to my app, so I can launch it by following a link on a website.
I've implemented URL Scheme using the cordova plugin by Eddy Verbruggen (https://github.com/EddyVerbruggen/Custom-URL-scheme) and I managed to get my app launched by following a link of the "myapp://" format.
The problem is that, even though the app is getting successfully launched, the handleOpenUrl hook is not getting triggered.
Meteor.startup(function() {
handleOpenURL = function handleOpenURL(url) {
console.log("received url: " + url);
// parse url and proceed accordingly
}
});
Nothing gets logged. So I have no way of passing any parameters to my app, or even detect that the app was launched via a link that follows the 'myapp://' URL scheme.
Also, I noticed that even though my app is already open, if I switch to the browser and click on a special "myapp://" link, instead of switching to my (already open) app, a new instance of the app is getting launched.
[edit] Turned out the two problems were related. Once I prevented a new instance of the app from being initialized, the handleOpenUrl function was triggered successfully.
I'm using the Android emulator for all my tests. I haven't had the chance to test on iOS yet.
[edit] iOS didn't give this problem at all. It was only an Android problem.
If anyone out there has any experience on implementing custom URL scheme in meteorjs, your feedback is much appreciated!
I managed to fix the issue I was facing. Here is the solution, for anybody else who is facing similar problems.
First of all, it was only occurring on Android. iOS had no problem whatsoever to launch the app and trigger the handleOpenUrl function.
The two issues that I was facing on Android turned out that there were related to each other. The fact that a new instance of the app was triggered every time, prevented the handleOpenUrl function from being triggered.
Both problems were fixed by adding a single line of code on the mobile-config.js file:
App.setPreference("AndroidLaunchMode", "singleTask");
My question may sound like "already asked", but I cannot find any answer. My problem is :
I have a phonegap app that only display a remote website (that website is responsive and work perfectly on mobile device). So the app is very simple :
function onBodyLoad() {
document.addEventListener("deviceready", function(){
location.href = "http://www.mydomain.com/";
}, true);
}
As you can see this I just a redirection when that app starts. With that method I have no access to phonegap API after the redirection (am I right?).
My question(s) is: is that method the right method? How can I display/hide element on a webpage depending on the webpage is accessed by the app or by mobile browsers?
Thank you so much
Greg
Just be aware that you are not allowed to do this from Apple.
From the App Store Review Guideline
2.12 Apps that are not very useful, unique, are simply web sites bundled as Apps, or do not provide any lasting entertainment value may
be rejected
I created my first Sencha touch 2 app by watching this video (http://youtu.be/5F7Gx0-W-M4) and it has a store page structured like this:
Ext.define('FirstApp.store.Places',{
extend:'Ext.data.Store',
config:{
autoLoad:true,
model:'FirstApp.model.Place',
proxy:{
type:'ajax',
url:'https://maps.googleapis.com/maps/api/place/search/json?location=-33.8670522,151.1957362&radius=500&types=food&name=harbour&sensor=false&key=AIzaSyCFWZSKDslql5GZR0OJlVcgoQJP1UKgZ5U',
reader:{
type:'json',
rootProperty:'results'
}
}
}
})
The after-build (after running "sencha app build native") package work very well on my MAC (all browsers) but the generated app (i am running it on my nexus phone) works but doesn't collect any data from the google maps json.
Any help would be appreciated
The example you are referring is using google map's place search API. You can not use this API when you build the app for mobile phone with proxy set to ajax . Basically, you can not use any resource that is outside your domain. Like if your site is at yourdomain.com and there is someotherdomain.com, then you can't make ajax request to this someotherdomain.com from yourdomain.com unless that domain allows you to. In this case, your mobile app is not having any domain. You are just loading a page inside webview.
The reason is, ajax will not be able to load cross-origin resources. App build works on browsers because I believe you're using chrome with --disable-web-security flag. To work with CORS you need to use JsonP proxy. It's the only way if you're packaging for mobile app. If in a case, you own the server ( not in this context though ) then you can allow CORS by setting appropriate headers like
Access-Control-Allow-Origin: *
or
Access-Control-Allow-Origin: http://yourdomain.com/resource
Try setting proxy to JsonP .
I'm trying to create an Android (2.2) app using Phonegap (version 1.9.0) and jQuery Mobile (1.1.0). Specifically, the app is supposed to send a GET request to an existing WCF REST service and retrieve JSON data (a list of folders) and display each item as an option in a select drop down menu.
Right now, all this works as it should when I use the desktop browser. The WCF REST service sends the correct response, the browser renders the page correctly and puts the options in the select menu as I want it to. However, when I use the following code in Android app using Phonegap:
$.getJSON('http://xxx.xxx.xxx/MobileService.svc/GetFolders?callback=?', null, function (folders) {
$.each( folders, function( i, folder ) {
$("#folders").append("<option value='"+folder.Id+"'>"+folder.Name+"</option>");
});
$("#folders").selectmenu("refresh");
});
...I get the error message when I boot the Android app (debugging on physical device):
Connection to the server was unsuccessful. ("file:///android_asset/www/index.html")
When I comment out the above $.getJSON code, the app loads fine, but the select menu is unpopulated.
I've also noticed that apparently because Phonegap uses the "file://" protocol, it is not affected by the "same-origin policy" that the "http://" protocol is...I had been using JSONP when I was working with the browser, which is why I have the callback. I don't think this should be the reason why it is failing, but I dont know. Any help will be greatly appreciated!
Things I've tried:
Changing the access origin to ".*" in the cordova.xml
Adding 'super.setIntegerProperty("loadUrlTimeoutValue", 60000);' to the activity
You can try to set your cordova.xml to "*" instead of ".*" as seen on the Getting Started Guide
Or even better:
http://xxx.xxx.xxx
It turns out in my particular case that the issue boiled down to the mobile phone being on guest wifi network that didn't have access to the network where the REST service was hosted so the connection was being blocked.
Hope that can help someone
I have currently built an application using phone gap targeting the android and blackberry platforms.
I use a combination of Jquery mobile and Phonegap for my application, since both are open source frameworks and improvements as well as bug fixes keep happening I wanted to know what would be a good solution for alerting my users to update their application when I upgrade the above frameworks in my application.
One solution I had in mind is maintain a version numbering on my server for the apps, when the app is loaded on the users device we can make an ajax call to check for version update and then alert the user to upgrade their application.
Android market also has an auto update feature how does that work! How do I go about this what would be a good approach.
If you are planning to build "native", in this case localy installed apps. You don't have to worry about informing the user. As soon as you uplad the new versions to the Android market or App World the App market systems will let the users know automatically.
I think (in most cases) it is not necessary to let the user know about updates within the app. Some apps do that but I see it less often since it really does not make much sense.
But in case you want to build such a feature, I would store a version number somwhere in the code and make a server request eg. when the app starts which then compares the latest version number of your app stored on your server.
Eg.
Client:
$.ajax({
url: webservice_host + '&callback=?',
dataType: 'jsonp',
success: function (data) {
//data -> remote version
var local_version;
if (local_version < data ){
alert("There is a newer version available");
}
}
});
Server (php in this case):
<?php
print mysql_real_escape_string($_GET['callback']). '( 1.1 )';
?>
I didn't test the code for typos etc. But this should do the trick.