plugins - Ionic 4 PWA - 电容器和相机插件怪异的行为
问题描述
我正在尝试从 Ionic 4 PWA 应用程序中拍照。
我从 Ionic 团队阅读了这份文档并实施了所有建议的步骤......(https://capacitor.ionicframework.com/docs/guides/ionic-framework-app/)
(奇怪的)结果如下图所示:
当显示此图片中的摄像头提示时,Chrome 控制台会打印出一个名为 MediaStreamTrack 的对象,其值如下:
kind: "video"
id: "6250dfa4-d9aa-4a87-ab9f-ae085f929c3f"
label: "screen-capture-recorder"
启用:真
静音:假
onmute:null
onunmute:null
readyState:“live”
onended:null
contentHint:“”
proto:MediaStreamTrack
当我单击按钮拍照时,我可以看到以下消息:
Unable to take photo! DOMException: setOptions failed - pwa-camera.entry.js:259
我使用了 Ionic 团队在文档中提供的示例代码:
export class Tab2Page {
photo: SafeResourceUrl;
constructor(
private sanitizer: DomSanitizer
) { }
async takePicture() {
const image = await Plugins.Camera.getPhoto({
quality: 100,
allowEditing: false,
resultType: CameraResultType.DataUrl,
source: CameraSource.Camera
});
this.photo = this.sanitizer.bypassSecurityTrustResourceUrl(image && (image.dataUrl));
}
}
和...
<ion-content>
<img [src]="photo">
<ion-fab vertical="bottom" horizontal="center" slot="fixed">
<ion-fab-button (click)="takePicture()">
<ion-icon name="camera"></ion-icon>
</ion-fab-button>
</ion-fab>
</ion-content>
我更改了这段代码中的所有内容,试图找出问题所在,但似乎没有任何东西可以解决这种行为。
谁能指出我正确的方向?
我的 Chrome 版本是 79.0.3945.79
提前致谢。
解决方案
推荐阅读
- vue.js - vue js如何使用方法将数据从父组件,v-for循环列表传递到子组件
- python - 使用 JupyterLab SQL Magic 连接到 DB2z 时抛出编程错误:“CURRENT”无效
- wordpress - 如何运行循环以从 wordpress 中的多个复选框中获取数据?
- php - 我们可以在同一个控制器中多次使用数据库 cache_set_path 吗?
- jquery - 触摸设备上光滑的轮播中同时出现 2 个点
- javascript - ReferenceError:未定义 CryptoJs
- javascript - 我如何验证在克隆 jquery 控件中使用 java 脚本有不同的 id
- css - 仅 CSS 的 ProgressBar,带有突出显示当前状态的渐变颜色
- java - 正则表达式替换特定符号后的所有内容?爪哇
- angular - 如何基于 [sortablejs] 使按钮启用/禁用