webentwicklung-frage-antwort-db.com.de

Lokale Ressourcen dürfen nicht geladen werden: Ionischer Android 3

Ich verwende ionic 3 Android build apk und versuche, ein Bild aus file zu erstellen: ///storage/emulated/0/data/io.ionic.vdeovalet/cache/image.jpeg



 takePicture (sourceType) {
 Versuchen {
 // Optionen für den Kameradialog erstellen 
 var options = {
 Qualität: 100, 
 destinationType: this.camera.DestinationType.FILE_URI, 
 codingType: this.camera.EncodingType.JPEG, 
 sourceType: sourceType, 
 }; 
 this.camera.getPicture (Optionen) .dann ((imagePath) => {
 // Spezielle Behandlung für Android-Bibliothek 
 if (this.platform.is ('Android') && sourceType === 
 this.camera.PictureSourceType.PHOTOLIBRARY) {
 this.filePath.resolveNativePath (imagePath) 
. (dann filePath => {
 let correctPath = filePath.substr ('/') + 1); 
 Let currentName = imagePathSubstring (imagePath.lastIndexOf ('/') + 1, 
 ImagePath.lastIndexOf ('?')); .createFileName ()); 
 this.lastImage = filePath; 
}); 
} else {
 var currentName = imagePath.substr (imagePath.lastIndexOf ('/') + 1) ;
 var correctPath = imagePath.substr (0, imagePath.lastIndexOf ('/') + 1); 
 this.copyFileToLocalDir (correctPath, currentName, this.crea.) teFileName ()); 
 } 
 }, (err) => {
 this.presentToast ('Fehler beim Auswählen des Bildes'); 
 }); 


 } catch (e) {
 Konsolenfehler (e); 
 } 


 } 

Fehler: Lokale Ressource darf nicht geladen werden
Android 6.0.1

8
Muneeb Khan

Ich hatte die gleichen Probleme und es stellte sich heraus, dass Das neue ionische Webview-Plugin ist die Ursache für das Problem.

Das neue Plugin: Cordova-Plugin-Ionic-Webview @ 2.x scheint instabil zu sein ...

damit alles wieder auf [email protected] zurückgreift, sollten alle funktionieren

Schritte:

1. deinstalliere den Webview

ionic cordova plugins rm cordova-plugin-ionic-webview

2. altes installieren:

ionic cordova plugins add [email protected]

3. Cordova reinigen

cordova clean Android
12
Awesome Jim

Kein Downgrade erforderlich. Schreiben Sie einfach diesen Code.

private win: any = window;
    this.win.Ionic.WebView.convertFileSrc(path);
4
kunal shaktawat

Versuche dies:

1) https://devdactic.com/ionic-2-images/ .__ In diesem Lernprogramm ist ionic 2 und ionic 3 die beste Möglichkeit, Bilder hoch- und hochzuladen.

2) https://devdactic.com/ionic-4-image-upload-storage/ In diesem Lernprogramm ist ionic 4 die beste Methode zum Hoch- und Hochladen von Bildern.

ich benutze auch diese ... und es funktioniert gut ...

Und ich habe auch das Problem von

lokale Ressource darf nicht geladen werden

Sie können hier sehen: @ ionic/angle 4.0.0-beta.13: Lokale Ressourcen können nicht geladen werden: mit Webview 2.2.3 - Ionic CLI 4.3.1

1
Ashish Patidar

Versuche dies:

const options: CameraOptions = {
    quality: 10
    , destinationType: this.camera.DestinationType.DATA_URL
    , mediaType: this.camera.MediaType.PICTURE
    // Optional , correctOrientation: true
    , sourceType: sourceType == 0 ? this.camera.PictureSourceType.CAMERA : this.camera.PictureSourceType.PHOTOLIBRARY
    // Optional , saveToPhotoAlbum: true
};

this.camera.getPicture(options).then(imageBase64 => {
    let txtForImage = `data:image/jpeg;base64,` + imageBase64;
    this.imageToLoad = txtForImage;
})
.catch(error => {
    alert("Error: " + error);
    console.error(error);
});
0
Koken

Kopieren Sie diese Zeile in Ihre index.html

<meta http-equiv="Content-Security-Policy" content="default-src *; 
style-src 'self' 'unsafe-inline'; 
script-src 'self' 'unsafe-inline' 'unsafe-eval';
img-src 'self' data: https://s-media-cache-ak0.pinimg.com;
script-src 'self' https://maps.googleapis.com;" />

Schreiben Sie dann diese Funktion anstelle Ihrer Funktion. Beachten Sie, dass dieses Skript das Foto als base64 zurückgibt

getImageFromCamera() {
const options: CameraOptions = {
    quality: 20,
    saveToPhotoAlbum: true,
    destinationType: this.camera.DestinationType.FILE_URI,
    sourceType: this.camera.PictureSourceType.CAMERA,
    encodingType: this.camera.EncodingType.JPEG,
    allowEdit: false
};
this.camera.getPicture(options).then((imageData) => {
    this.imageURI = imageData;
    this.imageName = imageData.substr(imageData.lastIndexOf('/') + 1);
    // Create a folder in memory location
    this.file.checkDir(this.file.externalRootDirectory, 'Demo')
        .then(() => {
            this.fileCreated = true;
        }, (err) => {
            console.log("checkDir: Error");
            this.presentToast("checkDir Failed");
        });
    if (this.fileCreated) {
        this.presentToast("Directory Already exist");
    }
    else {
        this.file.createDir(this.file.externalRootDirectory, "Demo", true)
            .then((res) => {
                this.presentToast("Directory Created");
            }, (err) => {
                console.log("Directory Creation Error:");
            });
    }

    //FILE MOVE CODE
    let tempPath = this.imageURI.substr(0, this.imageURI.lastIndexOf('/') + 1);
    let androidPath = this.file.externalRootDirectory + '/Bexel/';
    this.imageString = androidPath + this.imageName;

    this.file.moveFile(tempPath, this.imageName, androidPath, this.imageName)
        .then((res) => {
            this.presentToast("Image Saved Successfully");
            this.readImage(this.imageString);

        }, (err) => {
            console.log("Image Copy Failed");
            this.presentToast("Image Copy Failed");
        });
    //Complete File Move Code

    this.toDataURL(this.imageURI, function (dataUrl) {
        console.log('RESULT:' + dataUrl);
    });
  }, (err) => {
    console.log(JSON.stringify(err));
    this.presentToast(JSON.stringify(err));
  });
}
presentToast(msg) {
let toast = this.toastCtrl.create({
    message: msg,
    duration: 2000
});
toast.present();
}
toDataURL(url, callback) {
let xhr = new XMLHttpRequest();
xhr.onload = function () {
    let reader = new FileReader();
    reader.onloadend = function () {
        callback(reader.result);
    };
    reader.readAsDataURL(xhr.response);
};
xhr.open('GET', url);
xhr.responseType = 'blob';
xhr.send();
}
readImage(filePath) {
let tempPath = filePath.substr(0, filePath.lastIndexOf('/') + 1);
let imageName = filePath.substr(filePath.lastIndexOf('/') + 1);

this.file.readAsDataURL(tempPath, imageName)
    .then((res) => {
        this.presentToast("Image Get Done");
        this.imageUrl = res;
    }, (err) => {
        this.presentToast("Image Get Error");
    });
}

Es sieht so aus, als wäre dies ein Problem mit Content-CSP (Inhaltssicherheitsrichtlinie). Das Meta-Tag sollte dieses Problem beheben. Dann liest der Code das Foto als base64.

<img [src]="imageUrl">

Und Sie können die Funktion ändern, um unnötige console.log zu entfernen. Ich habe gerade getestet.

0
Mohamed Wahshey

Ich musste nur die richtigen Imagepicker-Optionen verwenden, der Ausgabetyp hat es geschafft:

  const options: ImagePickerOptions = {
    maximumImagesCount: 1,
    outputType: 1,
    quality: 50
  };
0
Oscar Bout