Небезопасное значение, используемое в контексте URL ресурса (iframe)

Question

Попытка передать значение как URL-адрес iframe из локальной базы данных, и я получаю сообщение об ошибке: Небезопасное значение, используемое в контексте URL-адреса ресурса. Я пытаюсь отобразить массив IP-адресов принтеров, чтобы я мог проверить их статус через веб-сайт, есть ли способ сделать это без iframe? Я буду более чем рад услышать несколько советов.

Я новичок в angular, и любая помощь более чем приветствуется, заранее спасибо.

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { DomSanitizer } from '@angular/platform-browser';



@Component({
  selector: 'app-value',
  templateUrl: './value.component.html',
  styleUrls: ['./value.component.css']
})


export class ValueComponent implements OnInit {
  values: any;



  constructor(private http: HttpClient, private sanitizer: DomSanitizer) { }

  

ngOnInit() {
  this.getValues();


}

getValues() {
  this.http.get('http://localhost:5000/api/values/').subscribe(response => {
    this.values = response;
  }, error => {
    console.log(error);
  })
}

}

<H2>Print Manager</H2>


<div id="outerdiv">
  <iframe src="http://192.168.1.6/general/status.html" id="inneriframe" scrolling="no"  ></iframe>
</div>



<div *ngFor="let value of values">
<p>{{value.id}},{{value.hostName}},{{value.location}},{{value.manufacturer}},{{value.ip}}</p>

<span>Hostname: {{value.hostName}}</span>
<br>
<span>Location: {{value.location}}</span>
<br>
<span>Manufacturer: {{value.manufacturer}}</span>
<br>
<span>IP: {{value.ip}}</span>

</div>

Answer 1

Вы можете использовать Angular DomSanitizer из @angular/platform-browser

См. Angular Руководство для получения дополнительной информации

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

@Component({
  templateUrl: 'temp.html'
})
export class AppComponent {
yourUrl : '';
  constructor(private sanitizer : DomSanitizationService) {  
  }

  getSanitizedURL() {
    return this.sanitizer.bypassSecurityTrustUrl(yourUrl);
  }
}

HTML:

   <div id="outerdiv">
      <iframe src="getSanitizedURL()" id="inneriframe" scrolling="no"></iframe>
    </div>

Answer 2

[src] = "sanitizer.bypassSecurityTrustResourceUrl ('http: //'+value.ip+'/general/status.html')" решил это для меня