ionic-framework - 相机的FILE_URI路径不适用于IONIC 4

Question

当使用Cameara用destinationType: this.camera.DestinationType.FILE_URI拍照时，生成的URL将无法显示图像。例如，当尝试像这样拍照时:

this.camera.getPicture(options).then((url) => {
        // Load Image
        this.imagePath = url;
    }, (err) => {
        console.log(err);
    });

尝试将其显示为<img [src]="imagePath" >将导致错误(找不到文件)。

这里的问题是URL位于file:///storage...路径中，而不是基于本地主机的正确路径。

Answer 1

在早期版本的Ionic中，这可以通过使用normalizeURL解决。这不适用于Ionic 4(或者至少我无法使其工作)。

要解决此问题，您将需要使用convertFileSrc():

import {WebView} from '@ionic-native/ionic-webview/ngx';
...
this.camera.getPicture(options).then((url) => {
        // Load Image
        this.imagePath = this.webview.convertFileSrc(url);
    }, (err) => {
        console.log(err);
    });

现在，图片网址将采用适当的http://localhost:8080/_file_/storage...格式，并将正确加载。

有关更多信息，请参见WKWebView - Ionic Docs。