Обновление текущего пользователя - Angular 5 + Firebase - Ошибка при использовании downloadURL - PullRequest
0 голосов
/ 06 ноября 2018

Я пытаюсь обновить изображение профиля моего текущего пользователя, но получаю следующую ошибку: enter image description here

Я следовал руководству от 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);
      });
  }
}

Кто-нибудь может сказать мне, что происходит и почему это не удается? Заранее спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...