WKWebView iOS 13中的设备运动和设备定向

WKWebView iOS 13中的设备运动和设备定向,ios,wkwebview,ios-permissions,devicemotion,Ios,Wkwebview,Ios Permissions,Devicemotion,我想在iOS 13+的WKWebView中使用DeviceMotion和DeviceOrientation事件。 我正在使用下面的代码 <html> <style> #container{ margin: 20px; padding: 20px } #deviceType{ text-align: center; fo

我想在iOS 13+的WKWebView中使用DeviceMotion和DeviceOrientation事件。 我正在使用下面的代码

<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>
我试着使用uiDelegate,它成功了

刚刚在viewDidLoad中添加了一行

此外,您还必须向WKUIDelegate确认ViewController的类型。就是这样

我试着使用uiDelegate,效果很好

刚刚在viewDidLoad中添加了一行


此外,您还必须向WKUIDelegate确认ViewController的类型。在Xamarin iOS Xamarin上就是这样。表单准备就绪后,您可以在WkWebView上使用EvaluateJavaScript方法插入权限请求脚本:

webView.EvaluateJavaScript("DeviceMotionEvent.requestPermission().then(response => { if (response == 'granted') {window.addEventListener('devicemotion', (e) => {})}}).catch(console.error)");
如果使用自定义WkWebView渲染器,则在OnElementChanged中设置webView控件时可以注入脚本。如果此错误仍然存在,则必须实现IWKUIDelegate

例如:

// do this when setting up the webview control in OnElementChanged
                //enable device motion sensors permission script:
                //https://medium.com/flawless-app-stories/how-to-request-device-motion-and-orientation-permission-in-ios-13-74fc9d6cd140
                var source =
                "function requestSensorPermission() {" +
                "   if (typeof(DeviceMotionEvent) !== 'undefined' && typeof(DeviceMotionEvent.requestPermission) === 'function') {" +
                "       DeviceMotionEvent.requestPermission() .then(response => {" +
                "           if (response == 'granted') { " +
                "               window.addEventListener('devicemotion', (e) => { })" +
                "           }" +
                "       }).catch(console.error)" +
                "   }" +
                "}";
                var script = new WKUserScript(new NSString(source), WKUserScriptInjectionTime.AtDocumentEnd, true);
                wkWebView.Configuration.UserContentController.AddUserScript(script);
然后,当WkWebView就绪时,可以在代码中调用CustomWebView.EvaluateJavaScriptrequestSensorPermission

EvaluateJavaScript:

自定义WkWebView渲染器:


在Xamarin iOS Xamarin.Forms上,当权限请求脚本准备就绪时,可以在WkWebView上使用EvaluateJavaScript方法注入该脚本:

webView.EvaluateJavaScript("DeviceMotionEvent.requestPermission().then(response => { if (response == 'granted') {window.addEventListener('devicemotion', (e) => {})}}).catch(console.error)");
如果使用自定义WkWebView渲染器,则在OnElementChanged中设置webView控件时可以注入脚本。如果此错误仍然存在,则必须实现IWKUIDelegate

例如:

// do this when setting up the webview control in OnElementChanged
                //enable device motion sensors permission script:
                //https://medium.com/flawless-app-stories/how-to-request-device-motion-and-orientation-permission-in-ios-13-74fc9d6cd140
                var source =
                "function requestSensorPermission() {" +
                "   if (typeof(DeviceMotionEvent) !== 'undefined' && typeof(DeviceMotionEvent.requestPermission) === 'function') {" +
                "       DeviceMotionEvent.requestPermission() .then(response => {" +
                "           if (response == 'granted') { " +
                "               window.addEventListener('devicemotion', (e) => { })" +
                "           }" +
                "       }).catch(console.error)" +
                "   }" +
                "}";
                var script = new WKUserScript(new NSString(source), WKUserScriptInjectionTime.AtDocumentEnd, true);
                wkWebView.Configuration.UserContentController.AddUserScript(script);
然后,当WkWebView就绪时,可以在代码中调用CustomWebView.EvaluateJavaScriptrequestSensorPermission

EvaluateJavaScript:

自定义WkWebView渲染器:


您使用的是http还是https?有些API需要https。我在电容器应用程序中使用过运动API,这些应用程序使用WKWebView没有问题,我使用的是https。我的项目是用iOS 13构建和XCode 11.2构建的。我无法理解为什么它不能在我的应用程序上运行,因为chrome和safari都使用WKWebView,而同一个站点在这两个应用程序上都工作。您能否确认,即使在使用新的XCode和iOS 13构建项目之后,您也可以使用同样的方法。这将是非常感谢的。我们目前正在为同样的问题而挣扎。这里有一张公开票,是由另一个有类似问题的人创建的:你试过使用uiDelegate吗?嗯,没那么奇怪。阅读WKUIDelegate文档。这意味着代表网页呈现本机用户界面元素。所以,如果网页需要显示UIAlertController,它应该确认这个协议您使用的是http还是https?有些API需要https。我在电容器应用程序中使用过运动API,这些应用程序使用WKWebView没有问题,我使用的是https。我的项目是用iOS 13构建和XCode 11.2构建的。我无法理解为什么它不能在我的应用程序上运行,因为chrome和safari都使用WKWebView,而同一个站点在这两个应用程序上都工作。您能否确认,即使在使用新的XCode和iOS 13构建项目之后,您也可以使用同样的方法。这将是非常感谢的。我们目前正在为同样的问题而挣扎。这里有一张公开票,是由另一个有类似问题的人创建的:你试过使用uiDelegate吗?嗯,没那么奇怪。阅读WKUIDelegate文档。这意味着代表网页呈现本机用户界面元素。所以,如果网页需要显示UIAlertController,它应该确认这个协议