DeviceMotion и DeviceOrientation в WKWebView iOS 13 - PullRequest
Новая
       42

DeviceMotion и DeviceOrientation в WKWebView iOS 13

1 голос
/ 21 ноября 2019

Я хочу использовать DeviceMotion и DeviceOrientation события в WKWebView в iOS 13+. Я использую приведенный ниже код 

<html>
    <style>
        #container{
            margin: 20px; 
            padding: 20px
        }
        #deviceType{
            text-align: center; 
            font-family: Arial, Helvetica, sans-serif; 
            font-size: 3rem;
            font-weight: bold; 
            color: #08f
        }
        #permission{
            padding: 2rem 5rem;
            background: #08f;
            color: white; 
            margin-top: 30;
            font-family: Arial, Helvetica, sans-serif; 
            font-size: 3rem;
            border: none; 
            border-radius: 1rem
        }
        #permissionStatus{
            text-align: center; 
            font-family: Arial, Helvetica, sans-serif; 
            font-size: 2.5rem;
            font-weight: 600; 
            color: red;
            margin-top: 30px
        }
    </style>
    <body>
        <div id="container">
                <div id="deviceType"></div>
                <div style="text-align: center">
                    <button id="permission">Ask for permission</button>
                </div>
                <div id="permissionStatus">Pending</div>
        </div>
    </body>
    <script>

        if (typeof DeviceMotionEvent.requestPermission === 'function') {
            document.getElementById('deviceType').innerText = 'iOS 13'
            document.getElementById('permission').addEventListener('click', function () {
                console.log('button clicked')
                DeviceMotionEvent.requestPermission().then(response => {

                    // This is showing "denied" without showing any permission popup
                    console.log(response)
                    document.getElementById('permissionStatus').innerText = response

                }).catch(console.error)
            });
        } else {
            // ignore this case for processing
            console.log('non iOS 13')
            document.getElementById('deviceType').innerText = 'non iOS 13'
        }
    </script>
</html>

Эта веб-страница работает как в Safari, так и в Chrome и запрашивает разрешение на использование движения устройства, как показано ниже

Изображения:

Ask permission on chrome

Статус будет обновляться в зависимости от того, нажму я Разрешить или Отмена

enter image description here

Но в моем приложении внутри яЯ использую WKWebView, и когда я нажимаю кнопку Ask Permission , он не отображает никаких предупреждений о запросе разрешения и напрямую устанавливает статус на Denied . (показано ниже).

enter image description here

Пожалуйста, сообщите мне, если я делаю что-то не так или требуются дополнительные материалы со стороны WKWebView. Вот мой код iOS WKWebView. Я не знаю, требуются ли изменения в WKUserContentController или WKWebViewConfiguration. 

self.webView = WKWebView(frame: .zero)
self.webView.translatesAutoresizingMaskIntoConstraints = false

// Add the webview as a subview of MTKView
self.view.addSubview(self.webView)

self.webView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor).isActive = true
self.webView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true
self.webView.trailingAnchor.constraint(equalTo: self.view.trailingAnchor).isActive = true
self.webView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor).isActive = true


let websiteDataTypes = NSSet(array: [WKWebsiteDataTypeDiskCache, WKWebsiteDataTypeMemoryCache])
let date = Date(timeIntervalSince1970: 0)
WKWebsiteDataStore.default().removeData(ofTypes: websiteDataTypes as! Set<String>, modifiedSince: date, completionHandler:{ })

self?.webView.load(URLRequest(url: URL(string: url)!))
...