我正在尝试使用Ionic 2编写一个小应用程序,允许我通过相机捕获图像并将所有捕获的图像上传到Firebase存储,并将捕获的图像URL存储到Firebase数据库中。
我做了这些教程,但它不起作用,没有图像上传到Firebase存储:
链接
http://www.offlineprogrammer.com/upload-images-firebase-storage-using-ionic-framework/ https://www.youtube.com/watch?v=6yGrLWq-oIo
这些是我的代码,您可能想查看是否有错误:
app.component.ts
...
import firebase from 'firebase';
...
constructor(...) {
platform.ready().then(() => {
// Okay, so the platform is ready and our plugins are available.
// Here you can do any higher level native things you might need.
statusBar.styleDefault();
splashScreen.hide();
});
firebase.initializeApp({
apiKey: "XXXXXXXXXXXX",
authDomain: "XXXXXXXXXXXXX",
databaseURL: "XXXXXXXXXXX",
projectId: "XXXXXXXXX",
storageBucket: "XXXXXXXXXX",
messagingSenderId: "XXXXXXXXXX"
});
}
home.html
<ion-content class="footer">
<ion-item>
<img class="img-responsive" src="{{ myPhotoURL }}" />
</ion-item>
</ion-content>
home.ts
export class HomePage{
public myPhotosRef: any;
public myPhoto: any;
public myPhotoURL: any;
constructor(...){
this.myPhotosRef = firebase.storage().ref('/Photos/');
}
takePicture(){
const options: CameraOptions = {
quality: 80,
destinationType: this.camera.DestinationType.DATA_URL,
sourceType: this.camera.PictureSourceType.CAMERA,
allowEdit: true,
encodingType: this.camera.EncodingType.JPEG,
saveToPhotoAlbum: false
}
this.camera.getPicture(options).then((imageData) => {
this.myPhoto = imageData;
this.uploadPhoto();
});
}
private uploadPhoto(): void {
this.myPhotosRef.child(this.generateUUID()).child('myPhoto.png')
.put(this.myPhoto, 'base64', { contentType: 'image/png' })
.then((savedPicture) => {
this.myPhotoURL = savedPicture.downloadURL;
});
}
private generateUUID(): any {
let d = new Date().getTime();
let uuid = 'xxxxxxxx-xxxx-4xxx-yxxx'.replace(/[xy]/g, function (c) {
let r = (d + Math.random() * 16) % 16 | 0;
d = Math.floor(d / 16);
return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
});
return uuid;
}
}