Как я могу передать HTML как строку и обойти Security? - PullRequest
Новая
       16

Как я могу передать HTML как строку и обойти Security?

0 голосов
/ 14 марта 2019

Я хочу использовать ionic-alert-controller, чтобы показать сообщение пользователю. Это сообщение содержит расширенный текст и может содержать ссылки, которые фактически разрешено предупреждением и для большинства ссылок работает как талисман.

Однако (когда ссылка является глубокой ссылкой на другое приложение) Angular иногда считает их небезопасными, делая ссылки не щелкающими. Как я могу предотвратить это поведение? Предупреждение принимает только строку в качестве сообщения, без SafeHTML. 

this.a : string = getRichTextFromServer();

// EXAMPLE
// this.a = `<a href="www.google.de">works like a charm</a>
// Hello Hello <b>Example Text</b>
// <a href="sd-viewer://testlink">UNSAFE LINK</a>
// `;

// Some links are marked as unsafe
this.alertCtrl.create({
      message: this.a
    });
    
    
// Doesn't compile as message is only allowed to be a string
this.alertCtrl.create({
      message: this.domSan.bypassSecurityTrustHTML(this.a)
    });
    
// Gives error that function must be used with property binding
this.alertCtrl.create({
      message: this.domSan.bypassSecurityTrustHTML(this.a).toString()
    });
    
// Some links are marked as unsafe again
this.alertCtrl.create({
      this.ds.sanitize(SecurityContext.HTML,
        this.ds.bypassSecurityTrustHtml(a)
      )
    });

Что я могу сделать здесь?

РЕДАКТИРОВАТЬ: HTML (в моем примере хранится в «а») динамически загружается из серверной части и, следовательно, не известно во время компиляции. Поэтому редактирование его для преобразования RichText в угловой синтаксис во время выполнения выглядит довольно странно.

1 Ответ

1 голос
/ 14 марта 2019

Привет, я ответил на это вчера здесь: Как связать объект в iframe src

Вы можете создать трубу и использовать domsanitizer

вот так 

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer} from '@angular/platform-browser';

@Pipe({ name: 'safe' })
export class SafePipe implements PipeTransform {
  constructor(private sanitizer: DomSanitizer) {}
  transform(url) {
    return this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }
}

затем добавьте свой канал в модуль приложения 

@NgModule({
   declarations : [
     ...
     SafePipe
   ],
})

в html, вы можете использовать его следующим образом (url - ваш небезопасный URL) 

<a href="{{url | safe}}">UNSAFE LINK</a>

Если это поможет, пожалуйстапометить мой ответ как правильный, спасибо!

...