I created a HTML5 website with jQuery and jQueryMobile.
If I run it in the browser, everything works fine.
When I deploy it to the iPhone Simulator via Phonegap, it won't find the jQuery object ($) which I included like this:
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
console.log($); // undefined
If I modify the src attribute, so that my app uses a local copy of jQuery, the jQuery objects exists:
<script src="lib/jquery.js"></script>
console.log($); // works
BUT then I noticed that none of my Ajax calls within my app work.
So, I assume that my iPhone app refuses HTTP connections to remote hosts.
How can I fix this?
Update: I checked the URL where my app is deployed within the iPhone app and it looks like this:
file:///Users/mobile/Library/Application Support/iPhone Simulator/5.1/Applications/9767E436-B93422-5423-5HLD-1680170C8AC5/MyApp.app/www/index.html
You need to specify which hosts you allow to connect to in the Cordova.plist
This feature is called Whitelist and avoids your app to connect to servers you don't want to
Related
I have written the mobile app in cordova + angularjs + sqlite. I need to distribute it directly from my server to devices not through the google play.
Now I need to update javascript files stored in www directory on android device. I tried file transfer from app directory (/data/data/my.application.directory/) to some public device directory or server and vice versa - no problem. But problem is the www directory is part of file:///android_asset/ that is read only so I am not able to store any data in there.
Any idea? Thanks.
This is the way I'm using for updating my app and I'm not using Google Play or other stores:
I'm using this cordova plugin : https://github.com/whiteoctober/cordova-plugin-app-version to check my actual app version
cordova.getAppVersion.getVersionNumber().then(function (version)
{
if(version)
// Check the server reference version
});
After, I'm sending the app version number to the server
The server checks the difference between the version sent and the reference version
If the device app version is older, I'm returning the new version to my app client
You provide little information about your application, your code and what you are trying to do, but let me try to help you either way.
If what you want to do is modifying files in the www directory in android clients already shipped/downloaded, forget about it, you would need direct access to the device, and this code is bundled when you ship it.
If you are looking for a hot code push solution, there might be a way of doing so installing additional cordova plugins
When you publish your application on the store - you pack in it all your web content: html files, JavaScript code, images and so on. There are two ways how you can update it:
Publish new version of the app on the store. But it takes time,
especially with the App Store.
Sacrifice the offline feature and load all the pages online. But as
soon as Internet connection goes down - application won't work.
Solution: install cordova-hot-code-push
i am trying to build a mobile app, but i need some jQuery functions to make it function. at first i thought nothing was wrong since i am debugging it using ionic serve on firefox and everything seems to function. all interface runs smooth and jquery commands executing properly. but when i compiled the app and installed it on my android device. the jquery functions seems to not respond.
i embedded a CDN for the jQuery
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"> </script>
i hope somebody can help me out here.
Since you have used a CDN for jQuery the application makes a http request to retrieve the js file when its run. This happens in background when you run the application on the browser with ionic serve. But when you run it on a mobile device it needs to have special permissions configured to make the required http requests.
White listing the domain using the cordova-plugin-whitelist will solve the issue.
I've compiled an app with a single index.html that loads cordova.js.
The app is nothing more than a wrapper to my other cordova apps hosted in different servers.
I would like to be able to use window.location to access each one of these apps while being able to access the device controls such as "homebutton" event.
The problem is that after redirecting the user to one of my domains I lose the local context and as consequence I can't load the cordova.js anymore into my remotely hosted apps. The same goes for the plugins installed along with the distribution version.
I could of course host and load different versions of cordova.js based on the device os that is running the app. So each app has it's own version of cordova.js hosted along it.
But after being on a remote page how can i back to the application root page?
I found this related question:
How to get access to phonegap API from a remote page
I have two different apps, one is a native android app and other is a web app built using sencha and javascript.
I need to get some information from the web app to my native app.
Any idea how this communication can be done ? I am not using any webview since both are two different apps.
Please let me know. I even tried cookies, local storage etc.. But seems to be the native android app cannot access the browser cookies or local storage..
Please help.
You can try the following:
Run an httpd at your app. If you use cordova, you can take a look at org.chromium.socket plugin. There is an example of how to set up a local http server:
https://github.com/MobileChromeApps/mobile-chrome-app-samples/blob/master/webServer/server.js
At your webapp you issue AJAX calls (replacing html with JSON would fit very well) to localhost, where your app is running at the background. Your app will respond the requests, using JSON for instance.
In the other way around, your app can make AJAX calls to the server, that can update your html/js app using websockets.
If you are not using cordova, it is even easier to build an httpd in Java:) just google around.
I was trying the Geolocation example from the below link.
http://docs.phonegap.com/en/1.7.0/cordova_geolocation_geolocation.md.html#Geolocation
I copied the entire content from the first 'Full Example' and saved that file as an HTML. When I opened it in Chrome (desktop) and Android phone inbuilt browser(default), I got the following three alerts on both chrome and android phone.
gap:["Device","getDeviceInfo","XXXXXXXXXX"]
gap:["NetworkStatus","getConnectionInfo","XXXXXXXXXX"]
gap:["App","show","XXXXXXXXXX"]
I clicked 'Cancel' first time and even tried 'Ok' but, nothing happens. If I click 'OK' on all three alerts on my Android Phone, the page goes all white.
So I googled it and found couple of answers on Stack Overflow suggesting:
To remove the Cordova JS file for the desktop browser
Add android specific JS from the Cordova.
So I tried both but none of them worked. Latest, I tried the following solution.
I downloaded the Cordova package (3.0.0), there was a cordova-android.zip which had the cordova.js file at the following path.
/cordova-android/framework/assets/www/cordova.js
So, now my script element looks like this:
<script type="text/javascript" charset="utf-8" src="/cordova-android/framework/assets/www/cordova.js">
After modified the <script> element as above, I don't get alerts in Chrome, but I still get following NEW alerts on my Android phone.
gap:["PluginManager","startup","Plugin ManagerXXXXXXXXXX"]
gap:["App","show","XXXXXXXXXX"]
Code: 1, message: User denied Geolocation.
So, now I have following questions:
How do I solve this problem (to run the HTML page without alert on all devices/browser)?
Any idea on why did my alerts change after changing the cordova.js file?
Regards,
Rumit
Your problem is that you're using cordova.js as if it's a JS library like jQuery, but Phonegap (Cordova) is a hybrid framework not a mobile browser framework (see here for clarification). It's not intended to be used as a standalone JS library in a webpage, but in conjunction with a native Phonegap library in order to build a native application. If you created your page as a Phonegap app and built it for Android, you would be able to (and need to) allow the app permission to use geolocation.
Phonegap apps are implemented via a native WebView and in the case of the Geolocation API, Phonegap will use only use its own implementation if the device doesn't already have a native W3C implementation (which Android does).
So the point is: either create a proper Phonegap app for Android by following the platform guide or simply don't use the Phonegap JS at all since you can call the Android browser's geolocation API (navigator.geolocation) directly from Javascript in your webpage - you don't need Phonegap's JS file to allow you to do this (have a look at the answer to this question).