###前提・実現したいこと
MONACAで学ぶ初めてのプログラミングのP.155ページの処理で写真を読み込もうとするとエラーが出る
提供元の完成例で置き換えても同様のエラーが発生する
###発生している問題・エラーメッセージ
Refused to load the image 'content://com.android.providers.media.documents/document/imageXXX'
because it violates the following Content Security Policy directive:
"default-src * data:". Note that 'img-src' was not explicitly set,
so 'default-src' is used as a fallback.
###該当のソースコード
<!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:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="components/loader.js"></script> <link rel="stylesheet" href="components/loader.css"> <link rel="stylesheet" href="css/style.css"> <script> // 写真を撮る function takePicture() { var options = { sourceType: Camera.PictureSourceType.CAMERA, // 撮影モード saveToPhotoAlbum: true // 撮影後、写真を端末に保存 };</head> <body> <div id="buttons"> <button onclick="takePicture()">写真を撮る</button> <button onclick="loadPicture()">写真を見る</button> </div> <img id="photo" src=""> </body> </html>// カメラを起動 navigator.camera.getPicture(onSuccess, onError, options); // 撮影完了したときに呼び出される function onSuccess(imageURI){ alert(imageURI + "に保存しました"); } // 撮影キャンセルしたときに呼び出される function onError(message){ alert("エラー: " + message); } } // 写真を見る function loadPicture() { var options = { sourceType: Camera.PictureSourceType.SAVEDPHOTOALBUM // 読込モード }; // 写真を読み込む navigator.camera.getPicture(onSuccess, onError, options); // 読込完了したときに呼び出される function onSuccess(imageURI){ document.getElementById("photo").src = imageURI; } // 読込失敗したときに呼び出される function onError(message){ alert("エラー: " + message); } } </script>
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/02/14 03:53 編集