Ionicローカルフォトとディスプレイを読み取る

Question

フォトギャラリーから写真を表示しようとしています。

私はそう画像

<img style="border:1px solid red;width:100%;height:400px;" 
        src="file:///storage/9016-4EF8/DCIM/Camera/20160723_134932.jpg" /> 

を表示するには、私の場合には、このhtmlコードを使用しています、画像は表示されません。

また、確認してURLが有効です。私は、ファイルを読むことができることを確認するために、次のコードを使用しています

 File.readAsText("file:///storage/9016-4EF8/DCIM/Camera/", "20160723_134932.jpg") 
      .then((obj) => { 
       console.log('I CAN READ THE FILE'); 
      }) 
      .catch((obj) => { 
       console.log(JSON.stringify(obj)); 
      }); 

私が行っている他のものがあります。

は、metaタグを変更：

修正

<meta http-equiv="Content-Security-Policy" content="default-src * cdvfile://*; style-src 'self' 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> 

Config.xml

<access origin="*"/> 
<allow-intent href="file:///*"/> 
<allow-navigation href="*://*/*"/> 

まだ動作していませんが、イメージは表示されません。

私は3日間作業をやろうとしています。

Answer 1

解決策を見つけられたとは思えません。

--livereloadでIonicを実行している場合、画像は表示されません。

ionic run --device 

"--livereload" なし：

は、思わず私はコマンドを使用してプロジェクトを実行します。私は自分の質問を完成させるためにそれを行いました。

OMG !!!!!

私はこの質問をさらに検索し、誰かを助けることにします。

今、私は眠ることができます、笑。

Answer 2

コードボールファイルプラグイン（cordova-plugin-file）のreadAsDataURLメソッドを使用してこの問題を回避しました。 CSPまたはconfig.xmlを変更する必要はありません。アンドロイドデバイスとエミュレータ（--livereload付き）でのみテストされています）。

this.camera.getPicture(options).then((imageUri) => { 
    const indexOfLastSlash = imageUri.lastIndexOf('/'); 
    const path = imageUri.substring(0, indexOfLastSlash); 
    const filename = imageUri.substring(indexOfLastSlash + 1); 
    this.file.readAsDataURL(path, filename).then((imageDataUrl) => { 
    this.imageDataUrl = imageDataUrl; 
    }) 
}, (err) => { 
}); 

これは回避策であり、すべてのイメージがメモリに読み込まれるため、本番環境では使用しないでください。