Angular2 ile bağlantı kurmak için “güvenli olmayan” öneki eklemek nasıl engellenir?

Question

Angular2'yi kullanarak, bağlantılara “güvensiz:” önekini eklemekten kaçınmak için bir ayar var. Ben Angular2 varsayılan olarak beyaz listede yer almayan protokol için bağlantılar ayarlamanız gerekir, ama bizim iç Uygulaması için gereklidir, bu yüzden sonuç geçersiz link: compileProvider.aHrefSanitizationWhitelist Açısal orada yaşlı olarak

<a href="unsafe:Notes://MYSERVER/C1256D3B004057E8" .. 

, ama yapamıyorum Angular2 benzer bir şey bulmak.

Answer 1

Kullanım DomSanitizer:

import {DomSanitizer} from '@angular/platform-browser'; 
... 
constructor(private sanitizer:DomSanitizer){} 
... 
let sanitizedUrl = this.sanitizer.bypassSecurityTrustUrl('Notes://MYSERVER/C1256D3B004057E8'); 

veya sterilize url dönmek için bir yöntem oluşturun: Şablonunuzdaki sonra

sanitize(url:string){ 
    return this.sanitizer.bypassSecurityTrustUrl(url); 
} 

ve:

<a [href]="sanitize('Notes://MYSERVER/C1256D3B004057E8')" ..

Demo Plunk

Answer 2

Başka bir şekilde, güvenli olmayan URL'yi güvenli URL'ye değiştirmek için bir boru hizmeti oluşturabilir, böylece tüm bileşenlerde kodu yeniden yazmaya gerek yoktur. safe-url.pipe.ts adlı bir boru hizmeti oluşturun.

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

@Pipe({ 
    name: 'safeUrl' 
}) 
export class SafeUrlPipe implements PipeTransform { 
    constructor(private domSanitizer: DomSanitizer) {} 
    transform(url) { 
    return this.domSanitizer.bypassSecurityTrustResourceUrl(url); 
    } 
} 

Sonra görünümünde kullanın.

Örnek: <a href="'Notes://MYSERVER/C1256D3B004057E8' | safeUrl"></a>

NOT: En app.module.ts

import { SafeUrlPipe } from './shared/safe-url.pipe'; //make sure your safe-url.pipe.ts file path is matching. 

yılında Ve düğüm modülü bildirimleri bölümünde bu boru hizmeti enjekte etmeyi unutmayın.

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