Угловой 6 дезинфицировать местный URL-адрес диска - PullRequest
Новая
       14

Угловой 6 дезинфицировать местный URL-адрес диска

0 голосов
/ 09 ноября 2018

Я пытался использовать методы DomSanitizer для очистки следующего типа URL-адреса безуспешно 

C:\path\to\executable

Есть ли способ очистки этого URL-адреса для использования в качестве значения href?

ТакжеЯ связываю значение с пометкой [], поэтому я уверен, что оно не интерполируется как строка.

Ответы [ 2 ]

0 голосов
/ 09 ноября 2018

Сначала URL должен быть C:/path/to/executable, а не один C:\path\to\executable

Согласно http://www.ietf.org/rfc/rfc2396.txt символы обратной косой черты не являются допустимыми символами в URL-адресах

Большинство браузеров конвертируютобратный слеш в слэши.Технически, если вам требуются символы обратной косой черты в вашем URL, вам нужно кодировать их, используя% 5C.

Теперь о санации

Вы можете просто связать функцию, которая возвращает safeURL с использованием bypassSecurityTrustUrl() в угловых DomSanitizer

app.component.html 

<a [href]="getlink()"> link  </a>

app.component.ts 

import { DomSanitizer} from '@angular/platform-browser';


export class AppComponent  {
  constructor(private sanitizer:DomSanitizer) {    }
  name = 'Angular';

  getlink():SafeUrl {
      return this.sanitizer.bypassSecurityTrustUrl("C:/path/to/executable");
  }
}

Рекомендуется

Использование трубы: Вы можете создать трубу для отключения встроенной очистки Angular

safe.pipe.ts 

import { Pipe, PipeTransform } from '@angular/core';
import { DomSanitizer, SafeHtml, SafeStyle, SafeScript, SafeUrl, SafeResourceUrl } from '@angular/platform-browser';

@Pipe({
  name: 'safe'
})
export class SafePipe implements PipeTransform {

  constructor(protected sanitizer: DomSanitizer) {}

 public transform(value: any, type: string): SafeHtml | SafeStyle | SafeScript | SafeUrl | SafeResourceUrl {
    switch (type) {
            case 'html': return this.sanitizer.bypassSecurityTrustHtml(value);
            case 'style': return this.sanitizer.bypassSecurityTrustStyle(value);
            case 'script': return this.sanitizer.bypassSecurityTrustScript(value);
            case 'url': return this.sanitizer.bypassSecurityTrustUrl(value);
            case 'resourceUrl': return this.sanitizer.bypassSecurityTrustResourceUrl(value);
            default: throw new Error(`Invalid safe type specified: ${type}`);
        }
  }
}

ПРИМЕЧАНИЕ : не забудьте добавить этот канал в ваш app.module.ts 

import { SafePipe } from './shared/safe-url.pipe';


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

Теперь вы можетеиспользуйте трубу, чтобы отключить встроенную очистку 

 <a [href]="'C:/path/to/executable' | safe: 'url'"> link </a>

Я бы порекомендовал использовать трубу, так как код можно использовать повторно, также вот рабочая демонстрация: https://stackblitz.com/edit/angular-vxcvfr

0 голосов
/ 09 ноября 2018

Я использовал это так:
В файле ts. 

import { DomSanitizer } from '@angular/platform-browser';
constructor(
        public domSanitizer: DomSanitizer
    ) { }

в HTML-файле 

<img [src]="domSanitizer.bypassSecurityTrustUrl(pazar.imagedata)" class="zoom">
...