前提・実現したいこと
cordova-camera-pluginで撮った画像をbase64にしてURLで画像が正常に表示されているかどうか
確認したい
data:image/jpeg;base64,/9j/4AAQSkZJRg・・・のように変換したい
発生している問題・エラーメッセージ
data:image/jpeg;base64で変換した画像が上の部分しか表示されません。
エラーメッセージ
該当のソースコード
picture(e){ window.navigator.camera.getPicture((imageData) => { var image = document.getElementById('image'); image.src = "data:image/jpeg;base64," + imageData; console.log( image.src); }, (error) => { console.log(error); }, { // 各種設定 sourceType: window.navigator.camera.PictureSourceType.CAMERA, quality: 100, targetWidth: 200, targetHeight: 200, allowEdit: true, saveToPhotoAlbum: true, encodingType: window.navigator.camera.EncodingType.JPEG, destinationType: window.navigator.camera.DestinationType.DATA_URL }); } render() { return ( <div> <div> <button onClick={this.picture}>写真を撮る</button> </div> <div> <img id ="image" src=""/> </div> </div> ); }
試したこと
拡張子を変えたり、下記のコールバック関数を入れてみたのですが、console.logの中身がdata(エラー)
になってしまいます。
optionでtargetwidthとtargetheightの値を変更しても変わりませんでした。
スマホで撮った写真はどれも重いので途中で読み込めなくなっているのか分かりませんが、一通り試して
表示されなかったので投稿させていただきました。
このような経験のある方にご教授願いたいです。
補足情報(FW/ツールのバージョンなど)
cordova 7.0.1
フレームワーク:react.js
使用しているプラグイン:cordova-plugin-camera
あなたの回答
tips
プレビュー