flutter - 无法在 webview_flutter 中加载相机
问题描述
我正在使用 webview_flutter: ^0.3.15+1 for in-app browser in flutter( here ) 并且想要打开这个有摄像头的 URL检查,但它没有按预期打开,也没有在该网页上加载摄像头
webView 页面的代码
import 'package:flutter/foundation.dart';
import 'package:flutter/gestures.dart';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
import 'dart:async';
class ExamWebView extends StatefulWidget {
final PageController controller;
final int destination;
const ExamWebView({Key key, this.controller, Key index, this.destination})
: super(key: key);
@override
_ExamWebViewState createState() => _ExamWebViewState();
}
class _ExamWebViewState extends State<ExamWebView> {
Completer<WebViewController> _controller = Completer<WebViewController>();
JavascriptChannel _toasterJavascriptChannel(BuildContext context) {
return JavascriptChannel(
name: '_Toaster',
onMessageReceived: (JavascriptMessage message) {
Scaffold.of(context).showSnackBar(
SnackBar(content: Text(message.message)),
);
});
}
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Center(
child: Text("Exam"),
),
),
body: Column(
children: <Widget>[
Expanded(
child: WebView(
initialUrl:
"https://therealtechwiz.github.io/project/facerecognition",
gestureRecognizers: Set()
..add(
Factory<VerticalDragGestureRecognizer>(
() => VerticalDragGestureRecognizer(),
),
),
// Factory<VerticalDragGestureRecognizer>(
// () => VerticalDragGestureRecognizer()..onUpdate = (_) {},
// ),
initialMediaPlaybackPolicy: AutoMediaPlaybackPolicy
.require_user_action_for_all_media_types,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
javascriptChannels: <JavascriptChannel>[
_toasterJavascriptChannel(context),
].toSet(),
),
)
],
));
}
}
在 android/app/src/main/AndroidManifest.xml 中添加了这些权限
<uses-permission android:name="android.permission.CAMERA" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" />
<uses-permission android:name="android.permission.INTERNET"/>
终端响应:
D/EgretLoader(23485): EgretLoader(Context context)
D/EgretLoader(23485): The context is not activity
W/ContentCatcher(23485): Failed to notify a WebView
I/chromium(23485): [INFO:CONSOLE(79)] "[object DOMException] please use the fiddle instead", source: https://therealtechwiz.github.io/project/facerecognition/script.js (79)
I/chromium(23485): [INFO:CONSOLE(1)] "Uncaught (in promise) Error: failed to fetch: (404) , from url: https://therealtechwiz.github.io/models/face_recognition_model-weights_manifest.json", source: https://therealtechwiz.github.io/project/facerecognition/face-api.min.js (1)
W/Choreographer(23485): Frame time is 0.077364 ms in the future! Check that graphics HAL is generating vsync timestamps using the correct timebase.
得到这个输出:
预期输出:可以在这里看到
任何人都可以看到并建议我一个解决方案
解决方案
原因是您需要在加载 web 视图和设置之前请求 cam/ setMediaPlaybackRequiresUserGesture
micfalse
权限webView's
。
webview.getSettings().setMediaPlaybackRequiresUserGesture(false);
我不相信 webview_flutter 默认情况下会这样做,因此您需要分叉插件并更改代码才能做到这一点。
我在使用 url_launcher 时遇到了类似的问题,不得不分叉它并添加一些自定义代码来处理 Whereby 集成(对于 ios WKWebView 将不起作用 - 你将需要 SFSafariViewController)。
你可以在这里找到我的版本
url_launcher: #^5.4.2
git:
url: git://github.com/yokoboko/url_launcher.git
path: url_launcher
推荐阅读
- haskell - 尽管设置了行级别策略,但未从 IHP DataSync 获得结果
- php - 如何在 woocommerce 属性之间放置自定义 div?
- mysql - MYSQL:如何计算每个数据的移动平均值?
- swift - Actor 'self' 只能从异步初始化器中传递 'inout'
- maven - 使用 maven 或 artifactory 查找依赖项的所有引用?
- git - 从历史记录中删除过去的 git 提交 - 非交互方式
- vba - 如何修复excel VBA中的“运行时错误3251”
- c - 信号量和共享内存已打开/O_EXCL 标志有问题
- apache-flink - Apache Flink 中带有 TumblingWindow 的水印
- laravel - 在 eloquent 查询中检索特定值