DeviceMotion和DeviceOrientation in WKWebView iOS 13
我想在DeviceMotion和DeviceOrientation事件中使用iOS 13+中的WKWebView。我使用下面的代码
<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，并请求允许使用设备动作，如下所示
图片：
状态将根据我单击“允许”或“取消”进行更新。
但是在我的应用程序中，我使用的是WKWebView，当我按下询问权限按钮时，它没有显示任何请求权限的警告，而是直接将状态设置为拒绝。(见下文)。
如果我做错了什么或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)!))回答 2
Stack Overflow用户
发布于 2019-12-09 09:05:42
我试着用uiDelegate，它起作用了
刚在viewDidLoad中添加了一行
webView.uiDelegate = self此外，您还必须将ViewController类型确认为WKUIDelegate。就这样
Stack Overflow用户
发布于 2020-02-24 08:55:21
在Xamarin iOS (Xamarin.Forms)上，当WkWebView准备就绪时，您可以在WkWebView上使用EvaluateJavaScript方法注入权限请求脚本：
webView.EvaluateJavaScript("DeviceMotionEvent.requestPermission().then(response => { if (response == 'granted') {window.addEventListener('devicemotion', (e) => {})}}).catch(console.error)");如果使用自定义WkWebView呈现程序，则可以在OnElementChanged中设置webView控件时注入脚本(如果该bug仍然存在，则必须实现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);然后，当yourCustomWebView.EvaluateJavaScript("requestSensorPermission()")准备就绪时，您可以在代码后面调用WkWebView。
EvaluateJavaScript:
自定义WkWebView渲染器： https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/custom-renderer/hybridwebview#create-the-custom-renderer-on-ios
https://stackoverflow.com/questions/58969959
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号