Webcodecamjs-QR code scanning Library not working in Safari browser - javascript

I want a mobile page to scan QR-codes and display it's content.
This is the page:
https://ndvibes.com/demo/TicketSystem/check (index.html)
Very weird, it's working on Firefox (Linux), but not in Safari (iOS 11.4 /iPhone 6).
I thought the library I used didn't supported Safari, or Safari restricted
it because of security reasons, but the demo of the library is working just fine on iPhone!
So it Safari seems to be supported, and it doesn't block it, because it's working in the demo...
I have no clue on how to fix this.
Safari asks for permission to access the camera, when granted, it just does not display the camera-content.
I also checked the settings of Safari, but didn't saw anything disabled that could block the webcam-video to show.
Edit: This code doesn't seem to work on Android either, very weird, the demo is working on desktop and mobile, and my own code is working on desktop, but doesn't work on mobile...

To Use on Apple devices you have to make sure:
1- You must use https, for the protocol http does not work.
2- You must use Safari because in Apple, the other browsers do not have permission or access to some javascript things.
3- must use some version so you can use both cameras.
Problem: I thought the library I used didn't supported Safari, or Safari restricted it because of security reasons, but the demo of the library is working just fine on iPhone!
Reason: I have gone through with your webcodecamjs.js and compared with demo webcodecamjs.js.I found that there are some differences in these files.May be lib-code taken from git and actual demo lib-code are diffrent.
Solution: Simply replace your webcodecamjs.js with demo webcodecamjs.js and it should work.
EDIT
Note: You have to start the camera by event trigger as Safari doesn't allow Autoplay.

Related

Script not loading on iPhone

Recently I made my portfolio website and as I tested it today, everything works just fine on all of the most popular browsers. The problem is - I have access only to phones with Android and laptops with Windows. That way I am unable to test Apple devices and Safari itself.
For that, I asked my friend to visit my website on her phone (she has iPhone), so I can check if everything is ok. Unfortunately, when she entered my domain, Safari was unable to load JavaScript at all. What's even worse, she then installed Google Chrome and Mozilla Firefox, and the same stuff happened.
We were testing my website also on MacBook - that time also on Safari and Chrome. On Safari, there were some errors (it seems that at least part of the script worked), and on Chrome everything was right. I wasn't able to explore the problems, as we only had limited time via phone call.
Right now, my main issue is - why any browser on iPhone was unable to load the script? I would be very grateful if someone with iPhone or other Apple device could tell me what's happening there. The additional issue would be the Safari on MacBook. Because in this case, I was unable to detect anything useful, other than that only part of the script seems to be working.
Also, I don't know if that matters, but I used Webpack to bundle all JavaScript files. All code + domain can be found in the links below:
The website domain is: www.pmiecznik.pl
If you want to see those scripts/ style files - they are in the src folder in my GitHub repository.

Simulate a IOS environment for test website in safari

I'm developing an simples website using html, css/bootstrap and JS. I received feedback by Iphone user that some features not working in IOS mobile. Some Images not loading and counter-up not working too. In windows and android is working fine (chrome and Firefox). The question is, how I create a environment for simulate a IOS mobile for check how safari browser load my site? I tried install safari in windows but it not show equals execution in IOS. I think that browsershots not is a good ideia, because it works only with static content, and in the moment return 500 internal server error.
Microsoft BrowserStack provides a full test environment, however beyond the complimentary trial period it is not free. For errors related to pageload or reference, I would suggest you use device emulation and network throttling in a browser: Safari, Firefox, Chrome.
Some browsers are more forgiving of errors, so you may even have a typo. Is your trustworthy friend using an outdated browser while you require modern feature support? The scope of the problem seems undeserving of a bill for membership or tech support.

Sinch video calling is not working on updated versions of browsers on mobile

I downloaded the code from this. I successfully generated the app key.
I implemented the examples code from above downloaded samples it is working fine on mobile and web. But when i tried to implement video calling i got error
Error retrieving media stream
OverconstrainedError: Constraints could be not satisfied.
I tried with older versions of chrome browser. it is working fine.
Don't know why its not working on updated browser.
Any idea would be appreciate.
Chrome requires Https for mic and cam access since version 47

jStorage not working in certain IOS safari browsers

I am trying to use jStorage on my site built on jQuery Mobile. It works fine on Chrome, Firefox, Android, some versions of Mobile Safari, and on IE 10 mobile on Windows Phone 8. It gives me an 'undefined' error when I try to set any value. For example, $.jStorage.set("FBID", response.authResponse.userID);
I have this issue on iPhone 5 (Safari 6.1) and iPhone 4S (Safari 6.0)
Enabling local storage on Safari does not help.
Any ideas or suggestions you could come up with?
Found the issue.... localStorage does not work on iOS when private browsing is switched on. When using jStorage, this causes error. Use the following if condition to ensure it does not show an error when browsing privately..
if($.jStorage.storageAvailable())
$.jStorage.get(key);
If you do a web search for "iOS 5 localstorage bug" you see that it's been broken in Mobile Safari for a while. jStorage utilizes HTML5 localstorage, thus why it does not work.

Checking online status from an iPhone web app

Is there a way to check to see if an iPhone is online from a web app. That is, in mobile Safari, can I check the online status of the device to see if I should try an AJAX call or not.
In Firefox/regular WebKit, this would be:
if(navigator.onLine)
{
onlineCode()
}
img src="http://aonlinesite.com/a-really-little-image.png" onload="Intenet!" onerror="NoInternet!"
A quick test on the iPhone shows that it is available from iPhone OS 2.2.
That same code should work in the WebKit nightly build as of May 16th 2008. I guess that means you need to hope the 2.1 update included a new build of safari.
https://bugs.webkit.org/show_bug.cgi?id=19105

Categories