web-dev-qa-db-ja.com

未定義のプロパティ 'getPicture'を読み取れません-ionic camera

このコードは以下を返します：

 Cannot read property 'getPicture' of undefined

何が間違っているのかわかりません。コードを手伝ってくれませんか。

私のアプリ：

angle.module（ 'Todo'、['ionic'、 'Todo.controllers'、 'ngStorage'、 'Todo.services'、 'ngCordova']）

私のコントローラー：

.controller('profileEditCtrl', function($scope,Camera, $localStorage,
 $cordovaCamera) 
     {  
        $scope.$storage = $localStorage.$default({ data:[]});

    $scope.takePicture = function() 
    {
        navigator.camera.getPicture(onSuccess, onFail, { quality: 50,
            destinationType: Camera.DestinationType.DATA_URL }); 

      function onSuccess(imageData) {
        var image = document.getElementById('myImage');
        image.src ="data:image/jpeg;base64," + imageData;       
    }

    function onFail(message) {
        alert('Failed because: ' + message);
    }       

}});
androidangularjscordovayeomanionic-framework
13
Matan Gubkin

  • コードは正しいです。ng-click="takePicture()"を使用してhtmlボタンを追加するだけです。

  • ここでは問題はありません。定義したモバイルカメラの構成がないため、ブラウザ"cannot read property 'getPicture' of undefined"であることは間違いありません。つまり、アプリケーションを実際にテストする必要があります）デバイス使用：

    > ionic run Android。

  • Googleの新しいアップデートChromeには、PC /ラップトップに接続されている場合にブラウザでデバイスをテストするのに役立つ新機能があります。テストについては、Chromeのナビゲーションパネルに移動してください>>詳細ツール>>デバイスを検査するか、次のリンクにアクセスしてください。

    chrome：// inspect /＃devices

  • アプリにプラグインcordovaplugin add org.Apache.cordova.cameraがインストールされていれば、カメラは正常に機能すると確信しています。
    これがお役に立てば幸いです。

12
Mohamad Al Asmar

コルドバプロジェクトで運が悪かったさまざまなソリューションを試した後、私は単に 組み込みのJavaScript API を使用しました。基本的に：

async function startCapturing() {   // get ready to shoot
    await getPermission('Android.permission.CAMERA');
    let stream = await navigator.mediaDevices.getUserMedia({ video: {width: 480, height: 320, facingMode:'environment' }, audio: false });
    let video = document.getElementById("pVideo");   // a <video> element
    video.srcObject = stream;
    video.play();
    video.style.display = "block";
}

function shootPhoto(){       // take a snapshot
    let video = document.getElementById("pVideo");
    let canvas = document.getElementById("pCanvas");  // a <canvas> element
    let context = canvas.getContext('2d');
    context.drawImage(video,0,0,480,320);
    document.getElementById('fsPhotoI').src = Photo.current.src = canvas.toDataURL('image/png');
    Photo.current.changed = Profile.current.changed = true;
    video.style.display = "none";
}

特に、一部のプラグインはAndroidリアカメラをすぐに使用できなかったため、機能しませんでした。getUserMedia（...）の次の方法でうまくいきます。

facingMode:'environment'

また、AndroidManifest.xmlでCAMERA権限を持っていることを確認してください。

0
Chong Lip Phang