Develop Reference

iPhone 12 Pro LiDAR API access for Safari

I'm working with WebAR reality (real-time SLAM and tracking) based on WebGL.
And wondering if there any way to get access to LiDAR API and use it in the Safari browser?
I couldn't find any useful info about it.

Currently, there is no documented direct LIDAR access on Safari. Safari also doesn't support the W3C WebXR Device API. Safari on iOS does support AR Quick Look, a feature that automatically displays any USDZ file in an AR view.

Geolocation fails on Safari 11 consistently with POSITION_UNAVAILABLE

I have a pretty standard geolocation implementation I'm using in JavaScript.
navigator.geolocation.getCurrentPosition(
function (position) {...},
function (error) {....}
);
It is and has been working great on Internet Explorer/Chrome on my main Windows machine, physical Android, IOS on different iPhones...It's not working on my Macbook Pro with HighSierra and latest Safari though.
I downloaded an old version of Safari for Windows, and while I know it's old and deprecated, I figured I could at least see and it doesn't work on that either so I feel like that somewhat means something as far as testing goes.
The error code I'm getting back is POSITION_UNAVAILABLE. Here's where it gets really weird, I got so fed up because it really is on my end inexplicable, I decided to try other websites on Safari that have demo geolocation to test, html5demos.com, w3schools etc. All return same thing on Safari when debugging their code. Same thing with the older version of Safari for all tests on all websites on a completely different machine.
My site is HTTPS, I have confirmed location services are enabled on Safari for the website, I'm prompted for approve/deny location. I've confirmed all location services are active on the MBP system preferences. I have no idea what the heck is the deal, I can't confirm if...it's something...on this machine since it's my only MBP I have access to, but again it works on mobile IOS and every other website I've tried that has a Geolocation demo on the MBP does not as well on my Windows box with the last available version of Windows Safari 5.1.7. I'm using wifi if that matters at all since I've seen a hard connection for whatever reason coming up sometimes as a problem when consulting Google.
Any ideas?

How to detect the browser support http2 or not in browser environment by javascript?

I want to determine use combo or not by the environment support http2 or not. But, I cannot find the method to check if a browser supports http2 or not in browser.
Thank you in advance.

Navigation Timing 2 API provides this information:
performance.getEntriesByType('navigation')[0].nextHopProtocol
The above should return 'h2' on a page that got fetched using HTTP 2
A note on limited compatibility of nextHopProtocol:
Navigation Timing Level 2 API is currently in working draft status so support for the nextHopProtocol (which is being introduced with Level 2 API) will be limited (unsure of exact browsers supporting it since caniuse currently doesn't include Navigation Timing Level 2 API).

According to HTTP/2 Frequently Asked Questions HTTP/2 and caniuse is supported at IE11, Edge14+, Firefox 52+, Chrome 49+, Safari 10.1+, Opera 45+, iOS Safari 9.3+, Android Browser 56, and Chrome for Android 59.
Can I use HTTP/2 now?
In browsers, HTTP/2 is supported by the most current releases of Edge,
Safari, Firefox and Chrome. Other browsers based upon Blink will also
support HTTP/2 (e.g., Opera and Yandex Browser). See the caniuse
for more details.

The easiest solution could be to find the User Browser version and user agent.
Sample javascript code to find User Agent :
function myFunction() {
var x = "User-agent header sent: " + navigator.userAgent;
document.getElementById("demo").innerHTML = x;
}
We can make a Map with browser name and version and after splitting user agent we can know if the Browser version support or not.
With the server side language like Java, it's easy to get Request agent which can tell HTTP version, but with Javascript without Ajax, it's bit more code needs to write.
To find a number of Browser and which version of browser follows HTTP2 please refer to :
https://www.smashingmagazine.com/wp-content/uploads/2016/01/01-caniuse-spdy-opt.png

I could not find another way.
I think there is only way to check the browser and operating system by looking at the following items.
https://en.wikipedia.org/wiki/HTTP/2
http://caniuse.com/#search=http2

localForage using WebSQL web IndexedDB available

I am building a Cordova app with the Ionic Framework. I am using angular-localForage as the local database for the app's persistent storage.
While developing, I am testing my app using Google Chrome 45.0.2454.85 m on Windows 10. angular-localForage is at version 1.2.3 and localForage is version 1.2.4.
I can set and retrieve data no problem. To set data I am using:
$localForage.setItem(myKey, myData).then(myCallbackFunction);
According to the docs, localForage should use IndexedDB if it's available and fall back to WebSQL for browsers where it is not available. I can see from looking at Resources in Chrome Developer tools that it is storing my data in WebSQL.
If I put this code in my controller I get a message saying IndexedDB is available:
if (!window.indexedDB) {
window.alert("Your browser doesn't support a stable version of IndexedDB. Such and such feature will not be available.");
} else {
window.alert("IndexedDB available.");
}
My question is, why is it using WebSQL in Chrome when I have IndexedDB available?

The problem is actually quite sneaky.
TLDR; Apple's UIWebView doesn't support indexedDB. Turn off Chrome's iOS emulator to see indexedDB working.
What's happening is that I'm assuming you're emulating an iPhone with Chrome dev tools. Well, this spoofing is actually really effective because localForage will now emit an error if you configured it to exclusively use indexedDB.
If you want to have a moment of profound ennui and see indexedDB in action... turn off emulation so that you're using Chrome's own user-agent. It'll work then.
Source: I had to deal with this nonsense myself. It was a really bad developer experience. HAH.

My guess is that websql is taken as first choice since it exists longer than the indexeddb api and chrome was pushing websql earlier than indexeddb. Since chrome still supports websql it takes websql before indexeddb.

getUserMedia in Firefox 20

I'm having serious trouble in getting getUserMedia to work in Firefox 20. What I would need is a simple webcam capture.
I've tried a couple of examples over the web, here's one for example:
http://www.html5rocks.com/en/tutorials/getusermedia/intro/
Is it so that Chrome is actually the only browser supporting the getUserMedia properly today? I've also tried photobooth.js with no luck. Any good solutions around?
Thanks in advance.

Chrome 21+, Firefox 17+ and Opera 12+ actually support getUserMedia (been using it as well). But Chrome and Firefox still prefix them with webkit and moz, respectively, so you need a simple polyfill to patch up the differences.
I read somewhere before that the initial versions of these browsers that supported these features had them disabled by default. You need to enable them first. As far as I have used these browsers, the latest versions have them enabled (FF20 and GC26)
In order to use getUserMedia, it has to be hosted on a web server. An error will be thrown if you try to run the page locally. If you have NodeJS installed, you can run this little NodeJS script to run a portable static file server.

in webkit you hve to prefix webkit and in moz you need prefix moz . you can use adapter.js as polyfil so you can call the same function to work in all web rtc enabled browser . And web rtc still have problem in chrome to moz or moz to chrome Peer connection
you are needed to enable flags in chrome 24 or less . but with chrome 25+ it is flagless