Question

我尝试了所有可能的方法来访问Cordova上的Webview上的摄像机。

它可以在android上运行，但不能在iOS上运行。

有人可以解释一下如何通过iOS上的cordova Webview实现访问摄像头功能。

浏览器端（角形）

if (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) {
      navigator.mediaDevices
        .getUserMedia({ video: { facingMode: 'environment' } })
        .then(stream => {
          // this.videoDom.srcObject = stream;
          this.videoDom.srcObject = stream;
          this.videoDom.setAttribute('playsinline', 'true');
          this.videoDom.play();

          this.stream = stream.getTracks();

          requestAnimationFrame(tick);
        })
}

科多瓦一侧

我已经安装了cordova-plugin-camera并在ios平台上的config.xml中添加了权限。

Answer 1

在iOS11 / 12上，navigator.getMediaDevices不适用于WKWebView和UIWebView。它仅适用于Safari。（https://forums.developer.apple.com/thread/88052）

仅在Safari中支持WebRTC。没有WKWebView，甚至没有 SFSafariViewController。

您可以尝试正常使用此插件，以解决您的问题：https://github.com/phonegap/phonegap-plugin-media-stream

export class SocketSessionService {
    sockets = Server.socketio().sockets;
    arrayOfActiveSessions: NewChatSessionModel[];

    socketChatService: SocketChatService;

    //temp
    sessionId: string;

    constructor(aSocket: SocketIO.Socket) {
        this.socketChatService = new SocketChatService(aSocket);

        this.arrayOfActiveSessions = [];
        this.handleAllNewSessionEmits(aSocket)
    }

    /** Handles all incomming session emits  
    */
    handleAllNewSessionEmits(aSocket: SocketIO.Socket) {
        aSocket.on('newChatSession', async (data) => {
            this.handleNewChatSession(aSocket, data)
        })
    }

Answer 2

我想到了一种怪诞的方式，您可以通过使用SELECT pt.* FROM person_table pt WHERE STR_TO_DATE(LEFT(ID, 6), '%d%m%y') > curdate() - interval 16 year AND STR_TO_DATE(LEFT(ID, 6), '%d%m%y') <= curdate() - interval 5 year;中新的postMessage API feature在iOS上实现此功能，使您能够将加载到Inappbrowser Webview中的页面中的消息发送回主窗口。 Cordova应用程序Webview。 npm（cordova-plugin-inappbrowser）的最新版本中没有此功能，因此您需要直接从Github安装主版本（3.0.0）：

3.1.0-dev

然后在加载到内置浏览器的页面中，您可以将消息发布回Cordova应用程序的Webview：

cordova plugin add https://github.com/apache/cordova-plugin-inappbrowser

在Cordova应用程序端，您可以侦听该消息并作出响应：

function openCamera(){
    postMessage({
        action: "camera"
    });
}

function postMessage(message){
    if(!webkit.messageHandlers.cordova_iab) throw "Cordova IAB postMessage API not found!";
    webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify(message));
}

<button onclick="openCamera()">Open camera<button>

这使您可以从浏览器内部直接调用var iab = cordova.InAppBrowser.open(myUrl, '_blank', iabOpts); iab.addEventListener('message', function (e) { if(e.data.action === 'camera'){ openCamera(); } }); function openCamera() { var animationDelay = 500; // delay to wait for camera window animation navigator.camera.getPicture(function(){ log("successfully opened camera"); if (device.platform === "iOS"){ // unhide IAB iab.show(); } }, function(cameraError){ error("error opening camera: "+cameraError); if (device.platform === "iOS"){ iab.show(); } }); if (device.platform === "iOS"){ // hide IAB so camera window is in view setTimeout(iab.hide, animationDelay); } }。

但是它很hacky，因为在iOS上，默认情况下，“相机”窗口将显示在视图层次结构中的“ inappbrowser”窗口下方，因此不可见。我的破解方法是在打开相机后隐藏浏览器窗口，这会使相机窗口位于可见视图层次结构的顶部并显示出来。但是，关闭摄影机窗口后，将在对内置浏览器窗口进行动画制作以再次显示时短暂显示Cordova应用程序窗口。

我在内置浏览器测试应用程序仓库中创建了一个测试用例示例：https://github.com/dpa99c/cordova-plugin-inappbrowser-test/tree/camera

您可以这样尝试：

cordova-plugin-camera

Answer 3

这是以下各项的重复：NotReadableError: Could not start source（请阅读此链接，因为它与Cordova和getUserMedia有关），并且可能还有Progressive Web App: Error Accessing navigator.mediaDevices.getUserMedia?

iOS 13和Safari 13上的Safari进行了更改：https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes

SFSafariViewController已获得getUserMedia功能（!!!）

https://bugs.webkit.org/show_bug.cgi?id=183201

但是WKWebView似乎没有获得getUserMedia功能（这可能是一个错误，请密切注意webkit链接）：

https://bugs.chromium.org/p/chromium/issues/detail?id=752458 https://bugs.webkit.org/show_bug.cgi?id=185448

iOS 13和Safari 13发行说明：

https://developer.apple.com/documentation/ios_ipados_release_notes/ios_13_release_notes https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes

是否可以从iOS上的inappbrowser / webview访问相机

3 个答案: