I want to create an phonegap app using this plugin. I have done this steps to create and add plugin :
1:I am creatin this app using phonegap cli :-
phonegap create GetPhone --id "com.phone" --name "GetPhoneApp"
2: Going into the project and buid
cd GetPhone
phonegap local build android
3:Installing plugin
phonegap local plugin add https://github.com/macdonst/TelephoneNumberPlugin
4:moving telephonenumber.js to www folder
5: adding
<script type="text/javascript" charset="utf-8" src="telephonenumber.js"></script>
into index.html then added below ondeviceready :-
var telephoneNumber = cordova.require("cordova/plugin/telephonenumber");
telephoneNumber.get(function(result) {
alert("result = " + result);
}, function(error) {
alert("error = " + error.code);
});
6: Added
<plugin name="TelephoneNumber" value="com.simonmacdonald.cordova.plugins.TelephoneNumber"/>
into config.xml in www directory.
7: Build
phonegap local build android
8: Uploaded into build.phonegap.com and created .apk file.
Then when i am running this app on android device it does not alert anything. Is there any wrong step i have taken. I dont know much more about phone gap. After googling i have created this. I have seen this tutorial also to add this plugin. When i am build it locally it does not show any error. But it is also not running.
Please help me find the error.
First of all I would suggest you get acquainted with standard tools, especially adb. These will allow you to provide more information, find out what really is going on.
Skimming through the guide is also helpful, so you can be sure you know what you're doing and why you're doing it. Look at step-by-step debugging of Android code as well.
I would also encourage you to build a Cordova application from sources without using the fancy tools to get the hang of what goes where and how all the components come together. Your source tree is confusing and you seem to have used a mixture of Cordova 3.1 and Cordova 2.9, and even Phonegap? You only need to include cordova.js and your script (js/script.js in this case), nothing else at the moment.
Having said that, on to the major issue.
Your call to get returns an error. Why? Take a quick look at the source code of the plugin:
https://github.com/macdonst/TelephoneNumberPlugin/blob/master/src/com/simonmacdonald/cordova/plugins/TelephoneNumber.java
The plugin retrieves the TelephonyManager and tries to call the getLine1Number. And as you can see result != null is false which drops through to returning a PluginResult.Status.ERROR, which is why you get your error alert box.
This is the core issue at hand. TelephonyManager returning a null for your request. Why? After searching around you might stumble on:
Retrieve phone Number in android
TelephonyManager.getLine1Number() failing?
Reading device phone number throws NULLPointerException
So, navigate over to Settings > About Phone > Status on your device and look at the "My phone number" field. Is it "Unknown"? Tough luck then. My SIM doesn't store the number, so I got the same results as you did.
Another thing to note, is that at least on Android 4.4, the method returns an empty string "" instead of a null, so when testing on my Android 2.3.7 device I got a null and thus got the error branch. But on my Android 4.4.2 device I got a "" and got the success branch, but the number was empty, obviously.
You can set the number on the emulator by using this pretty advanced guide if you'd like to try. So what can you do? Probably nothing by using the API, not even the Android system itself can get your number if it's not stored on the SIM card. Asking the user or sending an SMS to discover the number via a web service may be an option as well.
Step number 5 above will not work unless the code is called after the 'deviceready' event is triggered.
you will need some sort of call to know when the document is loaded, you can do either:
<body onload="onLoad()">
<script>
function onLoad() {
document.addEventListener('deviceready', deviceReady, false);
}
</script>
OR (w/ jquery):
<script>
$(document).ready(function () {
document.addEventListener('deviceready', deviceReady, false);
}
</script>
and then create this function:
function deviceReady() {
var telephoneNumber = cordova.require("cordova/plugin/telephonenumber");
telephoneNumber.get(function(result) {
alert("result = " + result);
}, function(error) {
alert("error = " + error.code);
});
}
This will ensure that your document has loaded and that cordova is ready to call to.
Related
I wonder if my problem is my ajax call is to http, not https. Must I call with https or can I call with http?
I am compiling with PhoneGap cloud cli-5.2.0 ( iOS 3.9.1 / Android 4.1.1 / Windows 3.8.1)
I compile my package, install it on my Android Samsung, it starts up, and my $.ajax errors
errorThrown:undefined
textStatus:error
data:{"readyState":4,"responseText":"","status":404,"statusText":"Not Found"}
Any suggestions/ideas?
I read the following:
jQuery Mobile + Phonegap on Android - no Ajax but its two years old and relates to an older version of phonegap.
My code requires no special magic - I do include phonegap.js but I do not use gps, camera, contacts etc etc
Using the code below, I do get my "deviceready" and "document ready" displayed. When I click on my login button (id='demologin') the function DemoLogin() is executed.
function onDeviceReady() {
$("#demologin").on("click", DemoLogin );
$("#demologin").after("<h3>deviceready</h3>");
return true;
}
$(document).ready(
function()
{
document.addEventListener("deviceready", onDeviceReady, false);
$("#demologin").after("<h3>document ready</h3>");
});
If I were to guess, the ajax "404" leads me to believe its calling a URL that does not exist hence why I wonder if Android expects me to call https instead of http. The problem I have with this is the code works on iOS so I would have thought PhoneGap magic would lead me to believe if it runs on one, it would run on the other.
All help appreciated!
I also use ajax on phonegap app and it work good. You can make call to http. I think the url you called does not exist or there may be connection problems like when data is switched off.
This is a old question but, possibly the solution will help someone who is googling it.
Add this code to your config.xml file:
<gap:plugin name="cordova-plugin-whitelist" source="npm" />
<access origin="*" />
because new release of Cordova need whitelist plugin.
Im just learning PhoneGap and I have some problems conserning the databases...
SO I want to connect to my localhost databse and simply display the items from the table.. With the ripple emulator everything works, but when I install the app on my device the data is not displayed, but im not getting any errors either.
So I am using the PhoneGap Desktop App. The server is running on http://88.216.170.246:3000
So in my ajax I do this:
$(document).on('click', '.show', function (e) {
$.ajax({
type:"GET",
url:"http://88.216.170.246/Test/www/getData.php",
success: function(result) {
if (result) {
$(".show_data").html(result);
}
else {
alert("error");
}
}
});
});
});
This renders everything perfectly on the emulator, but on my phone, nothing happens... Does the url not work? Maybe I cant access localhost on my device?
Please read:
Top Mistakes by Developers new to Cordova/Phonegap
https://github.com/jessemonroy650/top-phonegap-mistakes/blob/master/new-to-Phonegap.md
READ #1, #4, #5, & #10
#4 reads
In the code, did not listen for the 'deviceready' event.
This is listed MULTIPLE times in the documentation, and is include in every example where it is appropriate. It is still missed. Brian Ford - an Angular developer, points to the section of documentation we need.
This is a very important event that every Cordova application should use.
Cordova consists of two code bases: native and JavaScript. While the native code is loading, a custom loading image is displayed. However, JavaScript is only loaded once the DOM loads. This means your web application could, potentially, call a Cordova JavaScript function before it is loaded.
The Cordova deviceready event fires once Cordova has fully loaded. After the device has fired, you can safely make calls to Cordova function.
Please read the FAQ and follow the links. You have made many bad assumptions.
Best of Luck
Jesse
Is it possible to develop a hybrid mobile app using Phonegap / Cordova and access the device phone number for both Android and iOS?
iOS:
You can retrieve the phone number using the CoreTelephony framework, you will need to add the following Entitlement: com.apple.coretelephony.Identity.get.
However apple might reject your app once you upload it to the AppStore.
But if you plan to distribute using the "Enterprise Distribution" plan, you should have no problem at all, see answers by Igor Fedorchuk and Dylan here, and another elaborated answer here.
Android:
Yes, you could use this plugin, or write a cordova plugin that bridges the following code:
TelephonyManager tm = (TelephonyManager)appContext.getSystemService(Context.TELEPHONY_SERVICE);
String mPhoneNumber = tm.getLine1Number();
The required permission is android.permission.READ_PHONE_STATE"
Android:I know i am late. After Searching a lot i found this plugin which works for me perfectly...
add these plugin in your project
Put these code in your index.js here
$(document).ready(function () {
document.addEventListener("deviceready", onDeviceReady, false);
});
function onDeviceReady() {
window.plugins.phonenumber.get(success, failed);
document.addEventListener("backbutton", onBackKeyDown, false);
}
function success(phonenumber) {
console.log("My number is " + phonenumber);
}
function failed(phonenumber) {
console.log("Error " + phonenumber);
}
If your phone do not allow to show phonenumber then it will go to failed block.
But from That : Some vendors don't publish the phone number to the SIM card.
You can check it in Settings-> About Phone-> Status-> SIM Status.
We are using Cordova along with AngularJS for iOS and Android applications.
One big disadvantage of iOS are the long review times from Apple. In Google's Playstore, your app is available nearly immediately, or within a few hours. But Apple takes ages to review your app, even when it's only a small change.
So I was thinking, if there is a way to support some kind of live update.
That means, I could provide a ZIP file or something else with a new codebase, my app checks for updates and then installs the new files.
I've read something from appmobi, but are there any open source solutions?
cordova-app-loader is an easy to use plugin to update app files via 3 simple steps:
check() for a new manifest
download() files
update() your app!
It supports android and iOS
I don't know of any ready made solutions for that, but it should be easy enough to program something like this on your own.
Here are some points to get you started and to consider:
If you want to distribute updates via zip, you need a nativ plugin which handles the extraction
You might not be able to override files in the default location of your app (depending on OS). So, all files you want to update in the future have to sit in a folder your app has read/write access to (iOS: e.g. Library or Documents folder)
Now you simply need to download the zip-package, unpack the zip to your chosen directory, and restart/reload your app.
you will not be able to update native plugins!
Apple probably doesn't like that, since you are able to change the whole application without passing
their review process
I'm doing this inside my cordova app and haven't had any issues with ios app store review.
I'm using Jquery's ajax function to download both a javascript and a css file from a server that I can change without an app store approval and then I can inject those scripts once they downloaded on app startup.
I tried using the cordova File api and I'd then save the file locally, but offline support ins't the important to me at the moment and Jquery's ajax is much simpler.
Here is the jquery code I use. I have a bundle id that I use to detect if a new javascript file is available, otherwise jquery's ajax caches the previous requests to speed up download time.
This solution lets you have a subset of your code be dynamic. I still have a base set of code that is bundled with the app, along with native plugin js and native code which would need to go through the app store. But this atleast lets me push bug fixes without going through the app store.
Otherwise, I'd look at a solution like this: http://docs.build.phonegap.com/en_US/tools_hydration.md.html
function insertScript(version) {
var scriptUrl = "";
try {
// get javascript file...
scriptUrl = mobileWebServiceUrl + "/DynamicContent/Bundles/Scripts/dynamic";
scriptUrl += "_" + bundleVersion.replace(/\./g, "_") + ".js?v=" + version;
console.log("downloading script: " + scriptUrl);
// Allow user to set any option except for dataType, cache, and url
options = {
dataType: "script",
cache: true,
url: scriptUrl
};
// Use $.ajax() since it is more flexible than $.getScript
// Return the jqXHR object so we can chain callbacks
return $.ajax(options).success(function(response) {
console.log("insertScript success");
dynamicContentScriptLoaded = true;
});
} catch (e) {
//console.error(e);
ReportError("problem downloading javscript: " + scriptUrl);
}
}
function insertCSS(version) {
try {
// get css file...
var cssUrl = mobileWebServiceUrl + "/DynamicContent/Bundles/Css/dynamic";
cssUrl += "_" + bundleVersion.replace(/\./g, "_") + ".css?v=" + version;
console.log("downloading dynamic css: " + cssUrl);
$.ajax(cssUrl)
.success(function (response) {
console.log("successfully downloaded dynamic css");
var script = document.createElement("style");
script.type = "text/css";
script.innerHTML = response;
$('head link').each(function () {
if ($(this).attr('href').search('MobileFrame') > -1) {
$("#MobileFrameCSS").before(script);
}
});
dynamicContentCssLoaded = true;
// TODO: implement caching at a later date
//if (isPhoneGap())
// saveFile("DynamicStyles", response);
});
} catch (e) {
ReportError("problem downloading css");
}
}
Well, Adobe offers exactly that service in their Phonegap Build service. It's called Hydration.
The example shows using it with Android and iOS platforms, so I guess they made it compatible with the iOS Dev Program License Agreement.
If you are using Cordova, you probably will have to switch to the Phonegap CLI if you want to use their build cloud services, which is basically the same as Cordova's with some extra commands to upload to their cloud, etc.
I think there are some plugin like Splashscreen wich also have some minor changes (using <gap>for params into config.xml instead of <preference>). Again, if Hydration solves the problem for you, the changes are minor and you get a really nice feature.
I think the best choice would be to not try to do this with Phonegap, but rather identify your dynamic parts and implement these in Javascript.
Yes, I mean you should indeed use Javascript yourself without Phonegap, for example via JavaScriptBridge:
https://github.com/kishikawakatsumi/JavaScriptBridge
It may require more work initially to redesign your app into a "static" part (your PhoneGap app) and dynamic part (dynamic created views via JavascriptBirdge), and interacte seemlessly between them. But in my opinion, that will be ultimately the best software design.
However, also make sure you still meet Apples AppStore requirements.
The Meteor framework provides exactly this functionality when combined with PhoneGap. It's even sanctioned by Apple in the latest Developer Agreement. Here are some technical details and then some about Apple's view on it.
I think there is no such solution is available, but you can do it by programmatic way.you can update your cardova app by fetching files from server and updating it.
Check out CodePush from Microsoft. Works with Cordova and React Native.
Appears to be very similar to the "live update" feature from Ionic Cloud.
If you migrate to capacitor, the successor of Cordova there open source solution now.
Capacitor-updater, is the only alternative to ionic AppFlow.
The updater allows you to manage update by yourself, store your zip update where you want and use the download method.
How to start
npm install #capgo/capacitor-updater
npx cap sync
Then in your main JS, this is required to let the updater know the update is valid
import { CapacitorUpdater } from '#capgo/capacitor-updater'
CapacitorUpdater.notifyAppReady()
And lately after checking yourself the current version need update:
const version = await CapacitorUpdater.download({
url: 'https://github.com/Cap-go/demo-app/releases/download/0.0.4/dist.zip',
})
await CapacitorUpdater.set(version); // sets the new version, and reloads the app
After many request of people didn't want to do that themselves, I started Capgo a business to manage all the update process.
All is open source and can be replicate on your own as well.
Doing things for Capacitor is now my main activity, I produce open-source plugin as my main channel of Marketing, I'm solo founder and bootstrapped.
Hope my tool will help you !
I am newbie to phonegap development. I have developed an apk file for android in phonegap when i test the apk file in emulator it is giving me the below error message at the end of the page
Note: Navigation may not work if viewed locally
The Ajax-based navigation used throughout the jQuery Mobile docs may need to be viewed on a web server to work in certain browsers. If you see an error message when you click a link, please try a different browser.
I know the root cause for this is phonegap accesses the files loacally using file:///
I have searched through google and tried the solution but no solution
Can anyone please please help me on this, I am struggling with this
Edit:
here is my script to enable navigation
<script>
$( document ).on( "deviceready", function() {
// Make your jQuery Mobile framework configuration changes here!
alert("test")
$.mobile.allowCrossDomainPages = true;
$.support.cors = true;
$.mobile.phonegapNavigationEnabled = true;
});
</script>
I found the answer not sure whether it is correct or wrong but the message was disappeared and functionality is working fine for me.
js/index.js
comment this line in index.js file
$( document ).on( "pagecreate", function( event ) {
$( event.target ).append( message ); #you need to comment this line
});
As say dhaval in the comments of another question:
This error message is only for Desktop browsers, nothing happeng on mobile.
The best approach for a correct development environment is work with some local server like Xampp
You can test locally your project in the browser with something like: "localhost/yourproject"