前提・実現したいこと
navigator.camera.getPicture()関数を使用したカメラアプリの作成
発生している問題・エラーメッセージ
TypeError: undefined is not an object (evaluating 'navigator.camera.getPicture')
該当のソースコード
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="components/loader.js"></script> <script src="lib/onsenui/js/onsenui.min.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="lib/onsenui/css/onsenui.css"> <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css"> <link rel="stylesheet" href="css/style.css"> <script> navigator.camera.getPicture( cameraSuccess,cameraError,[cameraOptions]); var options = { sourceType : Camera.PictureSourceType.CAMERA, saveToPhotoAlbum: true, correctOrientation: true, destinationType: Camera.DestinationType.FILE_URI }; var option = { sourceType : Camera.PictureSourceType.PHOTOLIBRARY }; var images = null; //ギャラリーから画像のパスを取得する var getPictureFromGallery = function(onSuccess){ var options = { quality: 50, sourceType : Camera.PictureSourceType.PHOTOLIBRARY, destinationType : Camera.DestinationType.FILE_URI }; navigator.camera.getPicture(function(imageURI){ onSuccess(imageURI); },onFail,options); }; //写真を撮影して保存する var getPictureFromCamera = function(onSuccess){ var options = { sourceType : Camera.PictureSourceType.CAMERA, saveToPhotoAlbum: true, correctOrientation: true, destinationType: Camera.DestinationType.FILE_URI }; navigator.camera.getPicture(function(imageURI){ onSuccess(imageURI); },onFail, options); }; function onFail(){ console.log("写真を取得できませんでした") } $(document).on('pageinit', '#main-page', function(){ var onSuccess = function(pictureUrl){ images = []; var $img = $('<img>'); $img.attr('src', pictureUrl); images.push({ element: $img, label: '無加工' }); myNavi.pushPage('image.html'); } $(this).on('click', ',take-from-camera', function(){ getPictureFromCamera(onSuccess); }); $(this).on('click', ',take-from-gallery', function(){ getPictureFromGallery(onSuccess); }); }); </script> </head> <body> <ons-navigator var="myNavi">画面の切り替え <ons-page id="main-page"> <ons-toolbar> <div class="center">画像変換アプリ</div> </ons-toolbar> <br> <ons-list> <ons-list-item modifier="chevron" class="take-from-gallery"> <ons-icon icon="ion-images"></ons-icon>ギャラリーから選ぶ </ons-list-item> <ons-list-item modifier="chevron" class="take-from-camera"> <ons-icon icon="ion-camera"></ons-icon>カメラで撮影 </ons-list-item> </ons-list> <br> </ons-page> </ons-navigator> <ons-template id="image.html"> <ons-page id="image-page"> <ons-toolbar> <div class="left"> <ons-back-button ons-if-platform="ios">Back</ons-back-button> </div> <div class="center">画像</div> </ons-toolbar> <ons-carousel var="imageCarousel" class="image-carousel" fullscreen auto-scroll overscrollable> </ons-carousel> </ons-page> </ons-template> </body> </html>
補足情報(FW/ツールのバージョンなど)
具体的なソースコードの訂正案など書いていただけると嬉しいです。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/11/12 04:29
2018/11/12 04:36