¿Cómo evitar agregar el prefijo "unsafe" a link by Angular2? [duplicar]


Esta pregunta ya tiene una respuesta aquí:

Usando Angular2, hay una configuración para evitar agregar el prefijo " unsafe:" a los enlaces. Necesito establecer enlaces para el protocolo que no está en la lista blanca por defecto en Angular2, pero es necesario para nuestra aplicación interna, por lo que el resultado es enlace no válido:

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

En el antiguo Angular había compileProvider.aHrefSanitizationWhitelist, pero no puedo encontrar algo similar en Angular2.

 34
Author: Veljac, 2016-05-25

2 answers

Utilice el DomSanitizer:

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

O cree un método para devolver la url desinfectada:

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

Y luego en su plantilla:

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

Demo Plunk

 75
Author: Abdulrahman,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-09-27 01:54:53

De otra manera, puede crear un servicio de canalización para cambiar la url no segura a url segura, por lo que no es necesario reescribir el código en todos los componentes. Cree un servicio de canalización llamado safe-url.pipe.ts.

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);
  }
}

Luego utilícelo en su vista.

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

NOTA : No olvides inyectar este servicio de tuberías en tu app.módulo.ts

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

Y en la sección declaraciones del módulo de nodo.

@NgModule({ declarations: [SafeUrlPipe],...});
 27
Author: Amruth LS,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-02-22 13:59:52