Как предотвратить инъекцию html в Angular 5 - PullRequest
Новая
       14

Как предотвратить инъекцию html в Angular 5

1 голос
/ 25 апреля 2019

Я хочу запретить пользователям вводить html-инъекции в текстовое поле. Я исследовал некоторые примеры, но они, как правило, касаются использования тегов html через каналы и говорят, что angular автоматически очищает теги html . Но в моем примере, когда я ввожу <script>alert('blabla')</script> в текстовое поле, оно принимается и регистрируется в БД, как это ..

Как я могу предотвратить это?

Мой код шаблона: 

<div fxLayout="row">
          <mat-form-field fxFlex="20">
            <input matInput name="label" [(ngModel)]="product.label" placeholder="Label"
                   required>
          </mat-form-field>
        </div>

и мой файл ts: 

import { Product } from '../../../';

@Component({
  selector: '....',
  templateUrl: '....',
  styleUrls: ['....']
})
export class ProductEditComponent implements OnInit {

  product: Product = <Product>{};

  constructor(some services etc.) {

  }

  ngOnInit() {

   //some code
  }

Примечание еще раз: Я хочу запретить ввод html-сценария, не допуская его с обходом или каналом ...

1 Ответ

1 голос
/ 25 апреля 2019

вы можете использовать DomSanitizer для этого 

import { DomSanitizer } from "@angular/platform-browser"
import { SecurityContext } from "@angular/core";

constructor(private sanit:DomSanitizer){
  var dom = this.sanitizer.sanitize(SecurityContext.HTML, "<script> alert('HELLO'); </script>");
  console.log(dom);
}

, если он возвращает ноль, то это была проблема с html, иначе он возвращает переданный html

...