Angular IMG OnError не работает в Firefox, когда SRC имеет недопустимый XSS - PullRequest
0 голосов
/ 08 июля 2019

Я пытаюсь отобразить базу изображений из введенного пользователем URL-адреса. Это работает для успешных случаев. Но когда я пытаюсь ввести URL-адреса XSS, событие onError тега img не вызывается в FireFox. (работает на Chrome и IE)

Вот мой URL-адрес приложения stackblitz: https://angular -dwlzbn.stackblitz.io

Вы можете просмотреть его на Chrome и Firefox для проверки.

Я тестирую XSS URL, например:

Мне нужна помощь, чтобы отловить ошибку даже при использовании FireFox. Мой реальный код использует спиннер, и я прячу его, когда вызывается onerror. Так что в Firefox блесна заклинило.

Вот мой HTML:

<form #testForm="ngForm">
    <div>
      <mat-form-field>
      <input matInput type="URL" placeholder="Type Url Here" name="image" #image="ngModel" [(ngModel)]="imageUrl" />
      <mat-error *ngIf="image.invalid && (image.dirty || image.touched)">
        <div *ngIf="image.errors.invalidImage">Image is invalid.</div>
      </mat-error>
      </mat-form-field>
    </div>

    <div class="header-image-preview">
      <img *ngIf="!!imageUrl" [src]="imageUrl" (load)="onImageLoad()" (error)="onImageError()" />
    </div>
</form>

и вот часть моего файла TS:

  imageUrl: string;
  @ViewChild(NgForm) testForm: NgForm;

  public onImageLoad() {
    this.testForm.controls['image'].setErrors(null);
  }

  public onImageError() {
    this.testForm.controls['image'].setErrors({ 'invalidImage': true });
  }

Вы можете просмотреть весь пример кода здесь: https://stackblitz.com/edit/angular-dwlzbn

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