Develop Reference

iOS: Javascript code in WKWebView got “query cancelled” error after selecting photo from photo library and before uploading to the server

I use Xcode 9.1(9B55), iOS 11.1 both simulator and real iPhone/iPad.
The website(HTML5+Javascript) I used in mobile safari acts perfectly. But in my iOS app(Objective-C), which uses WKWebView to access the same web page, and set all the "privacy - Photo Library Usage" and others, always got the error below after selecting photo from photo library and before uploading to the server:
[discovery] errors encountered while discovering extensions: Error Domain=PlugInKit Code=13 "query cancelled" UserInfo={NSLocalizedDescription=query cancelled}
But something strange was that I had a successful run for just one time.
I've several threads about this issue, but have no clear solution. Someone said it's a bug of iOS 11.x, but I've tried it on iOS 9.x, the error was same.

I had the same issue on iOS 12.1. I spent a lot of time trying to figure out why I'm getting this error. I thought because of that error I can't upload an image to the server. But turned out on each try, the request fails with 401 status code because of permissions or additional http headers/cookies. In my case, this debug error meant nothing I thought(Maybe that's why additional argument OS_ACTIVITY_MODE = disabled in project scheme worked for other guys, because it just removed debug log from console). So, make sure you have a correct HTTP request with all permissions/headers as well. Maybe it will help you as It helped me. Good luck.

Geolocation not supported in Safari with wired connection?

I am trying out geolocation in Javascript, writing a very small web app on codepen. I mainly use Safari (10.1.2) on my macbook (10.12.6) and I couldn't get the following geolocation code working :
navigator.geolocation.getCurrentPosition(function(position) {
let latitude = position.coords.latitude;
let longitude = position.coords.longitude;
getRequest(latitude, longitude);
}, function(error) {
console.log(error.code);
});
After some time I opened up Chrome and tested the same code, it worked. I started doing some research on Safari and geolocation and have seen some people mention wired connection being the culprit.
I tried with wifi and indeed, it works. I don't know why, and couldn't find an explanation anywhere, but Safari refuses to handle geolocation when connected via Ethernet.
I did the same test on Google Maps and geolocation works everytime. So I thought maybe my code is wrong but I have the same trouble with code from W3Schools. I'm guessing Google uses another method.
How can I make it work on Safari with a wired connection ? I'm surprised to find posts from 2010 and to be facing the same problem 7 years later with all software up to date. Is there a universally compatible method I'm missing ? I'm wondering how services depending on geolocation handle this problem.
Thanks in advance for your help.

Geolocation fail in case of inactive mobile browser

I am using following code:
var fail = function(error) {
alert("Unable to get location");
};
function getGeo() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(
success,
fail,
{maximumAge: 50000, timeout: 30000, enableHighAccuracy: true});
}
};
Mostly It works but often it gives geolocation error and unable to get coordinates.
How can I make possible to get coordinates no matter browser window is inactive or browser is in background or mobile itself in sleep mode?

Without specifics of "geolocation error" my answer can no be complete but: -
At present you cannot get coordinates if browser window is inactive or browser is in background or mobile itself in sleep mode, unless you are developing a hybrid App with something like phonegap/cordova. (Firefox has the exception of continuing to service watchPosition() if the App is foregrounded but the phone is asleep.)
I have made several suggestions to W3C, IETF, Chrome Dev, Mozilla Dev, and Edge Dev regarding a workable solution using the Service Worker Extensibility functionality for a Javascript-only solution.
Briefly, the UA tracks Geolocation changes and if within range of a dev supplied filter, a ServiceWorker will be instantiated which may foreground the App or merely notify the App Server.
Please pursue this issue with the relevant bodies as the idea is beginning to gain traction.
HTH

Basic Google Sign-In for Websites code not working in Internet Explorer 11

I am attempting to use Google Sign-In for Websites (https://developers.google.com/identity/sign-in/web/) and noticed that my solution is not working in Internet Explorer 11. To try to eliminate as many factors as possible, I created a simple test case based on the sample code provided by Google.
I've tested it in Chrome on my Windows 7 PC, Chrome on my Mac, Safari on my Mac, Firefox on my Mac and Safari on my iPhone. It works on all of these (e.g., when I click the sign in button and select/enter my Google account, it returns to the page and the button says, "Signed in").
It does not, however, work on Internet Explorer 11 on PC or, strangely enough, Chrome for iOS. When the button is clicked, a window opens to allow me to select my Google account, but after making a selection, the window closes and returns to the page with a button that still says, "Sign In."
Here is the sample code:
<html>
<head>
<meta name="google-signin-client_id" content="61023618497-vqfbod57f26ncjl9d6firk3t09ve4tt3.apps.googleusercontent.com">
<script src="https://apis.google.com/js/platform.js" async defer></script>
</head>
<body>
<div class="g-signin2"></div>
</body>
</html>
Any ideas as to what might be going on? I've searched around and have not found any solutions.
One idea was to add "accounts.google.com" to IE's Trusted Sites. This didn't work. I also tried accessing the page via https instead of http. That didn't make a difference either. Anything else I should try?

I ran into the same problem now, a few months later.
If you look at:
https://developers.google.com/identity/sign-in/web/build-button
and try a signin with their demo button, it does not work with IE11 (but it works with other browsers I am using at different OS). I could not find any solution.
I am leaving the comment for a future reader, who searches for the same problem in the future. If the demo button at Google does not work, she can at least rest assured that the problem is probably not in her code. :)

Be sure that you don't have IE 11 configured to block all third party cookies.
Third party cookies are required, and the user experience that occurs when third party cookies are blocked--as you've discovered--leaves much to be desired. There is no warning or error message presented to the user.
You could try to catch the error before it happens. It is possible to detect whether or not third party cookies are blocked by trying to set a cookie on a second domain (that you control) and then making a second request to ensure the cookie is set. You'll need a script or something on your server that can set and check for the cookie (it can't be done using only JavaScript because of the browser security model).

I've had success doing the following:
Loading the script to initiate the Google button rendering etc. from $document.ready. (i.e.Whatever you have in the apis.google.com/js/client:platform.js?onload= x )
e.g.
<script src="https://apis.google.com/js/client:platform.js?onload=startApp" async defer></script>
Move startApp() to here:
$(document).ready(function () {
startApp();
Where startApp() looks something like this:
function startApp() {
gapi.load('auth2', function () {
gapi.client.load('plus', 'v1').then(function () {
gapi.signin2.render('signin-button', {
scope: 'https://www.googleapis.com/auth/plus.login',
fetch_basic_profile: false
});
gapi.auth2.init({
fetch_basic_profile: false,
scope: 'https://www.googleapis.com/auth/plus.login'
}).then(
function () {
console.log('init');
auth2 = gapi.auth2.getAuthInstance();
auth2.isSignedIn.listen(updateSignIn);
auth2.then(updateSignIn());
});
});
});
}

I struggled to get the example to work on localhost, but as soon as I deployed it to the real URL, it worked.

Using startTrackPage in Application Insights

I have recently been messing around with Application Insights and have been having a problem with getting the JavaScript API to work. In the default script that you are supposed to add to your page, they use the function trackPageView(). This seems to works, but I had also wanted to gather information about how long a user stayed on the page. I found the startTrackPage() and stopTrackPage() functions and tried to use those to get the information, but I always receive an error from startTrackPage().
Uncaught TypeError: appInsights.startTrackPage is not a function(anonymous function)
I have stepped through the code and the function does not seem to be created at the point I am calling it. trackPageView() is already defined though. I tried calling the function after the document loaded as well and that still failed. However, I can call it from the developer console once the page loads.
Here is where I found the information about startTrackPage() and stopTrackPage() originally. Other than that I have just been perusing around to see if anyone else has encountered this.
I appreciate the help.
Default code from App Insight:
window.appInsights = appInsights;
appInsights.startPageView();
What I have tried:
window.appInsights = appInsights;
appInsights.startTrackPage();
window.onunload = function () {
appInsights.stopTrackPage();
};

Short answer: unfortunately there's currently no way to use appInsights.startTrackPage() in the way you intend reliably.
Long answer: The reason is that startTrackPage() method is only defined in the JS that is downloaded from CDN, so until it is downloaded it is not defined.
What you could do it something like:
appInsights.queue.push(function(){appInsights.startTrackPage();})
however this would not produce correct measurement, because tracking won't start right away.
So your best approach would be record start time manually, however even that you cannot do reliably. First of all you absolutely don't want to use onunload event as at this point it will be too late for Application Insights SDK to send the data so it will most likely get lost. Using onbeforeunload and flush() will help with this problem a little bit:
var pageStart = +new Date;
window.addEventListener("beforeunload", function () {
appInsights.trackMetric("timeOnPage", (+new Date)-pageStart);
appInsights.flush();
});
However even when using onbeforeunload you are looking at high number of potential data losses - you cannot guarantee that ajax request to send data to Application Insights will complete before page navigates away and connection is interrupted. In my testing with IE was getting about 50% of losses.