I have an app that is a kiosk. The Kiosk can be used in multiple locations and will be specific to only that location based on the Id of said location. The Kiosk is first started from a page that lets the kiosk manager to select the location. The kiosk will refresh approx. every 2 minutes if the screen is idle it then reloads the welcome page for the location selected from the launch of the Kiosk. This behavior will happen no matter what page the Kiosk is on, i.e. welcome screen, the page that allows the end user to check in, the page that allows the user to select the reason they are visiting. The following code works with Edge, IE 11 and Chrome however with an IOS device it does not function as expected. IOS devices send the browser back to the page that is used for the location kiosk manager to select their location and start the Kiosk.
function startKioskOver() {
//only redirect if we have a location param
if ($routeParams.selectedLocationId > 0) {
datacontext.resetKiosk();
datacontext.getServiceQueueByLocationId($routeParams.selectedLocationId);
$location.path("/" + $routeParams.selectedLocationId + "/" + $window.indexPageGlobalRazorValues.DefaultView);
$route.reload();
window.location.reload();
}
}
Is there an issue with the IOS browser that it does not follow the behavior of all other browsers that have been tested? Does anyone have a work around that may help?
Thanks in advance for any help.
After going through the code, I found that:
window.location.reload();
was the problem. It was added by a coworker and I suspect that IOS browsers are running this async and it is getting called before the $route.reload(); was finished.
Related
I was trying to code a little html/css/javascript game for Android and IOS, using the GEOLOCATION WATCH feature.
I am using an https webpage.
In Android everything works fine. In IOS a had to add an Geolocation Request feature. It asks me inside the browser for Safari and the webpage if I would allow geolocations.
This works fine if I stay on the page, where I ask for the geolocations.
But if I leave that page to show another page (separate webpage) and THEN RETURN back to that webpage where I ask for geolocation, the geolocation watch function refuses updating. Only in IOS. Why?
What I tried:
IOS 12.2 and 14.4 => both the same
Adding clearwatch() function at
the top of the page before calling the geolocation function... does not work
Refreshing the webpage via the browser ... does not work
Closing Safari Browser totally, and reopening it... working
scanning the internet for solutions... did not find any
What has to be added to my webpage, so that the geolocation continues working when I return back from another webpage to my geolocation-webpage?
Regards,
Roger
I'm trying to trigger Pictuer-in-picture (PiP) on a HTML video using the following code:
await videoElement.requestPictureInPicture().catch((error) =>
alert(`PiP failed, ${error}`);
);
This works fine in Safari, but when you use 'Add to home screen' with "display": "standalone" set in the manifest, this code returns an error saying picture in picture is unsupported.
Additionally the built-in PiP control is missing from the video player.
Any ideas why this is happening or how to fix it? I assumed the PWA/standalone version uses the same browser/js engine behind the scenes as regular Safari on the device, but it looks like it may be different?
As of March 2021:
Unfortunately, I don't think there is a way to trigger PiP mode in PWAs (yet).
The API is missing in standalone mode.
I did some research and tried to find some workarounds.
The only thing that somehow works is to force the user to load the page containing the video in Safari. In order for this to work you have to play with the scope param inside your manifest.
Put your PWA in a subfolder like /pwa and set "scope": "/pwa"
Put your Video pages in another subfolder like /videos
Everytime a user navigates to a video page, the scope of your PWA will be left. As soon as this happens, your PWA will leave the fullscreen mode and safari will render its top and bottoms bars.
Inside the bottom bar will be a small safari icon. The user must click it. Safari will open, PiP will be available.
To make the process a little bit smoother you can render a custom PiP button as video control. If the user clicks it, you check if your app is running in standalone mode by checking window.navigator.standalone. If it's false, just request PiP.
Otherwise, you navigate out of your PWAs scope. Use the history API (history.pushState) to change the location without reloading the page. You can add a query param like autopip=true. Finally, you show an overlay describing that the user should click the safari button in the bottom right corner.
Safari will open the page you pushed to the history. In Safari, check if the query param autopip=true is set and use JS to request PiP after video has loaded.
The big gotcha: There is no way to redirect the user back to your PWA.
I have one page which takes some time to load in asp.net website. It works with all Android OS, all MAC OS, all iOS except iOS with version 10.0.0.2 with safari browser
When I am trying to load same page with safari in iOS 10.0.0.2, it throws 'safari could not open the page because the server stopped responding'.
I know the reason for this error is, my page is taking time. But my page is already optimized and it has so many things, that's why it is taking time.
I want to prevent my page from this error in 10.0.0.2.
I tried all the possible ways to solve this issue like :
Clear cookie and browsing data
Added 8.8.8.8 to DNS server
Airplane mode on-off
iPhone restart
But nothing helps.
Please help me to figure out this issue.
I found that iOS 10.0.0.2 has default timeout approx 1 minute. My page was taking more than 1 minute to load. That's why safari assumed that server is not responding and it was throwing that message.
I did not get any setting or anything to extend timeout limit of safari. At the end I optimized my code.
I am using telerik rad grid in my page and its MasterTableView's property named 'HierarchyLoadMode' was set as 'client'. I changed it to 'ServerOnDemand'.
That solved my issue by reducing page load time.
As
1) 'Client' loads grid data at the time of page load.
2) 'ServerOnDemand' loads grid data at the time of grid expanding
My page load time has been reduced and safari stopped throwing message.
If you are using telerik rad grid, I hope this will help you.
I'm getting a trouble while running JS code in a browser.
I've got a small web page which uses HTML5 location API for tracking a user.
User opens my website, logs in, and goes to a certain page on which I'm using location API to track user's location. Everything works fine until user's phone goes to sleep or user presses "home" button to minimize browser. The same thing happens on both Android and iPhone.
Is there any way to prevent the phone from going to sleep and let JS code work while browser is minimized?
one of the way I found is using video on a page where all JS located. but another problem is - screen became always ON, which can cause battery to discharge too fast (if I turn off screen manually using power button everything stops working)..
still looking for some ideas...
I'm using the Android S3 and using it for some file upload purposes.
I am trying to use a js library called dropzone.js(http://www.dropzonejs.com/) They have a function to drag and drop and also a old school file upload as well.
When I use this plugin and trying the demo, I get an error on my S3 saying "Unable to complete previous operation do to low memory". This happens on the Android browser and on Google Chrome on the S3. The result is that I cannnot upload my image and on the Android Browser I get redirected to my homepage and on Chrome the page refreshes.
If you had this "Unable to complete precious operation do to low memory" please let me know of any solution.
ALSO! I just tried this on facebook's upload and it also does not work and shows this same error. So it's probably not a dropzone issue, but an Android issue.
But in any case, if you have some solutions please let me know! Thanks!
Not sure what happened to the phone, but I did a factory reset and it works.
I had the same issue on my galaxy ace and just figured out.
I have ticked off "Do not keep activities" check box in "Developer options".
It solved the issue. That's all.
I had this problem with my samsung galaxy s3 phone and google chrome browser.
Unchecking "do not keep activities" does not solve the problem for me.I download and install firefox, the issue does not happen in firefox...
I don't know about chrome browser!
I have had the same problem on my Samsung Galaxy s4. I have found the solution on my phone and I have had no issues since. 1. Go to the Settings on your phone. 2. Select More in the top right task item. 3. Scroll to Developer Options. - If you don`t have developer options enabled follow steps 1 & 2, Then scroll down to about device and click on it. The phone informarion should be displayed and you should scroll down till you get to Build Number. The next thing to do is click on Build Number several times... ( Eaxh time you click on it an info bar will be displayed telling you how many clicks are needed for Developer options. When you have clicked BN several times then DO will now be opwn and we can continue with the above. 4. If you have clicked into Developer Options sucessfully then you must scroll down to the apps options near the bottom of D.O menu. 5. If ( Do not keep activities) is selected then be sure to untick it making sure the box has no tick in it as it will end every app or running operation as soon as it leaves the page, Hence the reason photos wont load up to Facebook etc. If this is done correctly then you should now be able to upload photos.
Read more: Unable to complete previous operation due to low memory? - When i tried to upload a photo from gallery to facebook using google chrome i got failed showing msg failed due to low memory wahat is solution :: Ask Me Fast at http://www.askmefast.com/Unable_to_complete_previous_operation_due_to_low_memory-qna7160577.html