0

当我通过 DomSanitizer 传递远程 url 时，http://localhost:4200会作为 url 的前缀，结果是 404。

GET http://localhost:4200/.cs.uic.edu/~i101/SoundFiles/Fanfare60.wav 404 (Not Found)

原文网址：https ://www2.cs.uic.edu/~i101/SoundFiles/Fanfare60.wav

我的代码：

  constructor(private sanitizer: DomSanitizer) {}

  public getSantizeUrl(url: string) {
      return this.sanitizer.bypassSecurityTrustResourceUrl(url);
  }

还有我的模板：

  <audio #player style="width: 100%" controls="controls" [src]="getSantizeUrl(chunk.value)" >    
  </audio>

有什么我想念的吗？为什么是前缀？FWIW bypassSecurityTrustUrl(url) 具有相同的效果。

谢谢

4

2 回答 2

1

getSantizeUrl 的响应可能会从 src 强制重定向。尝试将 url 保存在变量中，下面是一个示例：

import { Component } from '@angular/core';
import { DomSanitizer, SafeResourceUrl } from '@angular/platform-browser';

@Component({
    templateUrl: './app.component.html',
    styleUrls: [ './app.component.css' ]
})
export class AppComponent
{
    public audioUrl: SafeResourceUrl;

    constructor(private sanitizer: DomSanitizer) {}

    getSantizeUrl(url: string) {
         this.audioUrl = this.sanitizer.bypassSecurityTrustResourceUrl(url);
    }

}

在模板中：

<audio #player style="width: 100%" controls="controls" [src]="audioUrl" >    
</audio>

如果您已经有要清理的 url 或来自与 chunk.value 更改相关的事件，您可能应该在 onInit 中调用 getSantizeUrl

于 2020-06-05T09:48:37.283 回答
0

感谢您的输入，看来我有一些用户错误。

URL 在到达消毒剂之前就被破坏了：/

于 2020-06-05T10:30:12.607 回答