I made an app using PhoneGap that needs to access the user's current latitude and longitude to function.
Here's what I did:
navigator.geolocation.getCurrentPosition(function(pos) {
// code using pos
});
On the browser this asks your permission to access the info, but on the finished app it doesn't ask anything and just doesn't work.
Is there anything I'm doing wrong/missing?
#Dogmatics,
there is not enough information to debug your problem. Assuming you turned on the GPS and Location services, then you forgot to wait for the 'deviceready' event.
From the documentation:
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.
If this proves to be correct, you will want to read #4 in:
Top Mistakes by Developers new to Cordova/Phonegap
https://github.com/jessemonroy650/top-phonegap-mistakes/blob/master/new-to-Phonegap.md
Best of Luck
Related
I have been searching how to solve this issue for a couple of days with no success, so I decided to open a question here. So I have got a React app which uses Redux and Firebase as a database. Everything loads ok in every desktop and mobile browser except Facebook's in app browser. When I open it through my phone their browser fires and gets the title, it loads the injected scripts from Netlify but does not execute any Javascript and I get a blank page.
I have also tried to prerender the app with React Snap and then my app loads, but never preloads the Javascript and therefore the loaded visible content only stays HTML and CSS and nothing Javascript related works.
I am asking for help since I really have no idea what is wrong. There was no errors on build and as I said on every other browser, the web app works.
I have generated the app with create-react-app.
If someone have any suggestions, that would be helpful!
Okay I found what caused the app not loading in Facebook's in app browser. The problem was due to the Notifications API and the fact that it is disabled there. My app was using it, therefore it crashed in the beginning and the bundle did not load at all. That is why I had a blank screen on the non prerendered version and no javascript on the prerendered. Both ways there was no JS loaded because of this. So now I just check if the user agent supports the API and run my functions accordingly. Hope it helps to someone with the same issue.
I'm developing a simple app with phonegap which every 30 seconds send user current coordinates to my database via ajax call.It works very well
$(document).ready(function() {
setInterval(function() {
SetLocationUpdates();
}, 30000);
});
but if the user navigates to another app(google maps app) or if I open google maps app with this code
<div><a href="geo:41.897096,27.036545">Open maps app</div>
it(sending coordinates to my database via ajax) fails because getCurrentPosition does not work maybe google maps lock it althoug my app is still work(my app and google map app work separately.Two apps work at same time.Maybe my app go background)
More specifically, it does nothing.
navigator.geolocation.getCurrentPosition(SetLocationUpdates, onError);
this line not execute.
The success or error callbacks are never called, and setting a timeout does not affect this. I am using Phonegap Build to compile the app from html and javascript.
What should I do?
You need a native background geolocation solution - JS execution on the main thread gets paused when your app goes into the background.
In my experience, the most resilient solution is cordova-background-geolocation-lt. I've tested on multiple OS versions, including Android 8 and iOS 11, and this has worked consistently on all.
Please be aware that Firefox currently continues to work when the phone is asleep or the App is backgrounded. (I believe this is a bug)
IMHO the most appropriate and battery friendly solution relies on ServiceWorkers receiving and actioning TravelEvents from the TravelManager.
See this Web App for proof of how well Background geolocation fits with ServiceWorker infrastructure. All source can be found here including a aaa_readme.txt.
Please ask W3C/IETF to standardize this and your UA vendors to implement it!
I am trying to implement FB's AppEventLogger in an APP in order to track user behavior and purchases.
The "APP" is hybrid - it is cordova based. It is loaded from InAppBrowser and is actually a javascript/PHP website.
I am using the Javascript API for the AppEventLogger like so:
var $fCity = $('#fromCity').val();
var $tCity = $('#toCity').val();
var params = { };
params[FB.AppEvents.ParameterNames.CONTENT_TYPE] = $fCity + ' - ' + $tCity;
FB.AppEvents.logEvent(
FB.AppEvents.EventNames.SEARCHED,
null,
params
);
Which sends the following request to facebook:
When this request is sent from the app to facebook, nothing happens. The event is not logged.
However, when the same link/request is opened/made from a regular browser, even by just visiting the InAppBrowser source page trough the browser, the event is logged.
Also, I have the Facebook SDK installed as a Cordova plugin and send events via the plugin (as an app - when it starts and ends) - then it also works. But since the app is inside the inappbrowser, I can not use that plugin for the other pages.
I have checked the whitelist plugin and connections are allowed to facebook.com. You can even see that we get a 200 response and the gif headers from Facebook's server.
Why does Facebook's AppEventBrowser not log events sent from the InAppBrowser plugin?
I could not find a way to get around the limitation. In the end I used the Cordova plugin for facebook's SDK to do what I want to.
Few things to check
1. First load the debug version of JS SDK
(js.src = "//connect.facebook.net/en_US/sdk/debug.js";)
and see the logs.
2. inAppBrowser can't access Cordova APIs so just in case any part of your code/library is trying to access a Cordova API so that may generate an issue, and maybe a request argument is missing which Facebook event requires by default to log (e.g. it logs android version etc.). You can compare the arguments with a successful request.
For hybrid apps the recommended way by Facebook is to use the event API
https://developers.facebook.com/docs/marketing-api/app-event-api/v2.8
For other platforms that utilize web-view within a native app, one option would be to utilize the App Events API to pass events from your server to the Facebook servers.
https://developers.facebook.com/docs/app-events/faq
I have been doing a lot of reading and studying to figure out.
I basically just want my main AngularJS application to run, but also include an embedded Chrome Extension app - in this case, have regularly scheduled alarms (using the chrome.alarm API).
I want all users of my AngularJS app to have automatic access to the Chrome extension app, embedded in the main clientside one with lots of other Angular features.
It seems like I have to manually enable my Chrome app in Developer mode on my browser and even drag my Chrome app specifically to a location in my Chrome browser. I don't understand how end users can just automatically use my Chrome app then.
I need to add here I have never really used jQuery, only AngularJS but AngularJS extensively. My AngularJS app is the frontend, the backend is provided by Rails.
Some advice would be really helpful. I hope I am not downvoted as it is strange how sometimes questions get downvoted and I am not sure why...I don't really know where else to go with this question.
EDIT:
Ok some code to demonstrate:
myangularapp.controller('myappcontroller', function($scope, $http) {
var delayvar = 5;
chrome.alarms.create("arandomalarm", {delay: delayvar});
};
This doesn't just work as part of my AngularJS, I tried creating a manifest.json file in the app/assets folder too. As well as a background.js file there and my-chrome-app.js file. "chrome.alarms" is undefined, but I haven't enabled Developer mode yet. But still, how are end users supposed to use it if just to make me use it I need to do so much specific browser configuration?
You should have a look at Content Scripts and then at Message Passing which explains you how to communicate between a web page and an Chrome extension.
its not possible to automatically install a chrome extension. the user must install it from the chrome store.
you may make it easier for them to install it by providing an inline installation from your webpage. its in the official documentation and you can see an example on this page with the "add to chrome" button:
http://plusfortrello.com (one of my chrome extensions which has inline installation inside that page).
that example button is further customized to display a message instead if the user is not on chrome desktop.
if your extension also has permission to your webpage then you can also detect from your webpage if the extension is already install it (to hide the button, send messages to it and such).
I created a PhoneGap app for iPhone that uses geolocation via JavaScript inside webview.
When I run the app the first time, it'll prompt me to allow geolocation for this app.
When I hit "ok", it'll prompt me again with the same question but this time it states that "index.html" wants permission to use geolocation.
That makes sense because iOS probably wants permission to allow geolocation for the app itself for the first time and the 2nd time the browser wants permission.
However, since doesn't lead to a great user experience:
How can I prevent this double prompt? (I'd be enough if the 2nd prompt could be prevented)
I found the cause for the issue.
The call to navigator.geolocation.getCurrentPosition(onsuccess, onerror) happens before Phonegap was fully loaded.
This means that the geolocation call of webview (and not a native call via PhoneGap) is being triggered which will again ask for permission (which does make sense). Compare it to the normal Safari browser on your Smartphone. It'll ask for geolocation permission for every new website. It's the same when loading index.html via PhoneGap on application startup.
However, the solution is to wait for the deviceready event which gets fired when PhoneGap has fully loaded:
document.addEventListener("deviceready", function(){
navigator.geolocation.getCurrentPosition(onsuccess, onerror, params);
}, false);
This will make the PhoneGap API available which overwrites the default HTML5 gelocation call of the browser and get the device's geo location via a native call (which you already accepted in the first prompt).
This will work because PhoneGap's API calls are identical to the standard W3C call for HTML5: http://docs.phonegap.com/en/2.2.0/cordova_geolocation_geolocation.md.html#Geolocation
Have a look at this:
Location permission alert on iPhone with PhoneGap
The second one seems to be the Webkit alert. In order to prevent this, you seem to have to simply move all your js files to the root directory. Tell me, if it works since I'll have to address the same issue soon.
Finally fixed the issue.
IN the index.html just move your cordova.js up
<script src="cordova.js"></script>
as the first js file to be included (especially make sure it is above maps include js). This will make sure that the prompt shows only once
I solved this problem by moving the
<script src="cordova.js"></script>
as the last script to be included