Я пытаюсь обновить изображение профиля моего текущего пользователя, но получаю следующую ошибку:
Я следовал руководству от Firebase, поэтому я не знаю, что происходит. Код, который у меня есть, следующий. Во-первых, просто говоря, что весь код работает, я сохраняю изображение в базе данных и получаю ссылку на него. Проблема в том, что я не могу использовать URL, который мне дает Firebase, чтобы проверить изображение this.task.downloadURL()
, но если я использую внешний (какой бы из Google) он не работал. Как я могу использовать URL, который предоставляет firebase?
HTML
<div class="form-group">
<input style="display: none" type="file" accept=".png,.jpg" (change)="upload($event)" #fileInput />
<img src="../../../assets/images/user.jpg" class="pointer" (click)="fileInput.click()">
<div class="progress">
<div class="progress-bar progress-bar-striped bg-success" role="progressbar" [style.width]="(uploadProgress | async) + '%'"
[attr.aria-valuenow]="(uploadProgress | async)" asia-valuemin="0" aria-valuemax="100">
</div>
</div>
<br><br>
</div>
Машинопись
import { Component, OnInit } from "@angular/core";
import { Router } from "@angular/router";
import {
AngularFireStorage,
AngularFireStorageReference,
AngularFireUploadTask
} from "angularfire2/storage";
import { AuthService } from "../../services/auth.service";
import { Observable } from "rxjs/Observable";
import * as firebase from "firebase/app";
@Component({
selector: "app-profile",
templateUrl: "./profile.component.html",
styleUrls: ["./profile.component.scss"]
})
export class ProfileComponent implements OnInit {
constructor(
public authService: AuthService,
private router: Router,
private afStorage: AngularFireStorage
) {}
ngOnInit() {
this.loggedUserInfo();
}
//Upload new picture
ref: AngularFireStorageReference;
task: AngularFireUploadTask;
uploadProgress: Observable<number>;
downloadURL: Observable<string>;
//Information User
public auxAuth;
//Upload a new picture to the database as a profile picture
//and update it
upload(event) {
//Upload
const id = this.auxAuth.uid + "_updatedPhoto";
this.ref = this.afStorage.ref(id);
this.task = this.ref.put(event.target.files[0]);
this.uploadProgress = this.task.percentageChanges();
//Update
var user = firebase.auth().currentUser;
this.updateProfilePicture(user, this.task.downloadURL());
}
//Get the logged user's information
loggedUserInfo() {
this.authService.getAuth().subscribe(auth => {
if (auth) {
this.auxAuth = auth;
}
});
}
//Update the user's profile picture
updateProfilePicture(user, url) {
user
.updateProfile({
photoURL: url
})
.then(function() {
console.log("DONE");
})
.catch(function(error) {
console.log(error);
});
}
}
Кто-нибудь может сказать мне, что происходит и почему это не удается? Заранее спасибо.