2017-10-31 10 views
1

native.cameraを呼び出すようにアプリケーションを設計しようとすると、 ionic 3プロジェクトの私のコンソールを見て、私はこのエラーを見た:ionic cordovaを実行した後にIonic 3がAndroid androidを追加した後、ionic-native/file、filepath、transferにエラーが発生する

ネイティブ:Camera.getPictureを呼び出そうとしましたが、Cordovaは利用できませんでした。 cordova.jsを含めるか、デバイス/シミュレータで実行するようにしてください。ここで

Error in F12 , Console from web

私はネイティブカメラと呼ばれるために使用されるコードです。

これは私のproblem.htmlのコード

<button class="logoCamera" ion-button (click)="presentActionSheet()"> 
    <ion-icon name="camera" ></ion-icon> 

これは私のproblem.tsのコード

import { File } from '@ionic-native/file'; 
import { Transfer, TransferObject} from '@ionic-native/transfer'; 
import { FilePath } from '@ionic-native/file-path'; 
import { Camera } from '@ionic-native/camera'; 

public presentActionSheet(){ 
let actionSheet = this.actionSheetCtrl.create({ 
    title: 'Select Image', 
    buttons: [ 
    { 
     text: 'Load from Library', 
     handler:() => { 
     this.takePicture(this.camera.PictureSourceType.PHOTOLIBRARY); 
     } 
    }, 
    { 
     text: 'Use Camera', 
     handler:() => { 
     this.takePicture(this.camera.PictureSourceType.CAMERA); 
     } 
    }, 
    { 
     text: 'Cancel', 
     role: 'cancel' 
    } 
    ] 
}); 
actionSheet.present(); 
} 

public takePicture(sourceType){ 
//Create option for the Camera dialog 
var options = { 
    quality: 100, 
    sourceType : sourceType, 
    saveToPhotoAlbum: false, 
    correctOrientation: true 
}; 

//Get the data of an image 
this.camera.getPicture(options).then((imagePath) => { 
    //special handling for android lib 
    if(this.platform.is('android') && sourceType === this.camera.PictureSourceType.PHOTOLIBRARY) { 
    this.filePath.resolveNativePath(imagePath) 
     .then(filePath => { 
     let correctPath = filePath.substr(0, filePath.lastIndexOf('/') + 1); 
     let currentName = imagePath.substring(imagePath.lastIndexOf('/') + 1, imagePath.lastIndexOf('?')); 
     this.copyFileToLocalDir(correctPath, currentName, this.createFileName()); 
     }); 
    } else { 
    var currentName = imagePath.substr(imagePath.lastIndexOf('/') + 1); 
    var correctPath = imagePath.substr(0, imagePath.lastIndexOf('/')+ 1); 
    this.copyFileToLocalDir(correctPath, currentName, this.createFileName()); 
    } 
}, (err) => { 
    this.presentToast('Error while selecting Image.'); 
}); 
} 

     //Create a new name for image 
     private createFileName() { 
     var d = new Date(), 
     n = d.getTime(), 
     newFileName = n + ".jpg"; 
     return newFileName; 
     } 

     //copy image to local folder 
     private copyFileToLocalDir(namePath, currentName, newFileName) { 
     this.file.copyFile(namePath, currentName, cordova.file.dataDirectory, newFileName).then(success => { 
      this.lastImage = newFileName; 
     }, error => { 
      this.presentToast('Error while storing file.'); 
     }); 
     } 

    private presentToast(text) { 
     let toast = this.toastCtrl.create({ 
     message: text, 
     duration: 3000, 
     position: 'middle' 
     }); 
     toast.present(); 
    } 

    public pathForImage(img){ 
     if (img === null) { 
     return ''; 
     } else { 
     return cordova.file.dataDirectory + img; 
     } 
    } 

    public uploadImage() { 
     //destination URL 
     var url = ""; 

     //file to upload 
     var targetPath = this.pathForImage(this.lastImage); 

     //file name only 
     var filename = this.lastImage; 

     var options = { 
     fileKey: "file", 
     fileName: filename, 
     chunkedMode: false, 
     mimeType: "multipart/form-data", 
     params: {'fileName': filename} 
     }; 

     const fileTransfer: TransferObject = this.transfer.create(); 

     this.loading = this.loadingCtrl.create({ 
     content: 'Uploading...', 
     }); 
     this.loading.present(); 

     //use FileTransfer to upload image 
     fileTransfer.upload(targetPath, url, options).then(data => { 
     this.loading.dismissAll() 
     this.presentToast('Image successful uploaded.'); 
     }, err => { 
     this.loading.dismissAll() 
     this.presentToast('Error while uploading file.'); 
     }); 
    } 

私が仕えるイオン実行すると、すべてが無、エラーに滑らかではないです何もない。

しかし、私のボタンをクリックしてnatveカメラにアクセスすると、エラーが表示されます。問題を見つけ出して、たくさんのウェブをチェックしてください。

私はionic cordova run ios - simulatorを実行しようとした後、エラーが出ていますが、このコマンドを実行する前にこのエラーが存在しないことを確信しています。

私はこの問題を解決する方法を知っていますか?

enter image description here

答えて

0

エラーメッセージは、ここではかなり正確である:

ネイティブ:Camera.getPictureを呼び出してみましたが、コルドバは使用できません。 cordova.jsまたはをデバイス/シミュレータで実行するようにしてください。

ionic serveにはcordova.jsは含まれていません。また、シミュレータまたはエラーが発生したデバイスでアプリケーションを実行しません。あなたは、デバイスまたはシミュレータ上でアプリケーションを実行することにより、どちらかそれを修正することができます:

ionic cordova run android/ios --device/--simulator 

またはブラウザプラットフォームを追加することによって:

cordova platform add browser 

とブラウザのプラットフォームを実行している:私の後

ionic cordova run browser 
+0

をionic cordova run ios --simulatorを実行すると、奇妙なエラーが出てきます。実行する前に、@ ionic-native/file、@ ionic-native/file-path、@ ionic-native/transferが見つかりませんイオンコードラはios - シミュレータを実行し、私はprです私は質問を編集し、エラーを投稿します。 – Reggie

+0

まあ、すべてのプラグインをインストールしましたか? yesの場合は 'node_modules'フォルダと' package-lock.json'を削除し、 'npm install'をもう一度実行してください。いいえインストールしない場合は、次のようにします。 'npm install @ ionic-native/ -save' – David

+0

はい。私はすべてのプラグインをインストールしましたが、イオンコードを実行してios - simulatorを実行すると、すべてのプラグインがなくなり、もう一度保存する必要があります。私は後でそれが動作するかどうかを知らせます。ありがとう! – Reggie

関連する問題