调用DomSanitizer API时不使用基本属性吗? [英] Not using the base attribute when making DomSanitizer API calls?

问题描述

我正在使用DomSanitizer拨打电话，如下所示:

I'm making a call using the DomSanitizer like this:

        this.domSanitizer.bypassSecurityTrustResourceUrl(url));

url是要获取的SVG图像的完整URL.

The url is complete URL to the SVG image being fetched.

这是一个例子:

      this.matIconRegistry.addSvgIcon(
        "fs",
        this.domSanitizer.bypassSecurityTrustResourceUrl('https://github.com/fireflysemantics/images/blob/master/fsalpha/logo/fsalpha-logo-optimized.svg'));

但是，由于base设置为index.html中的另一个URL，因此dom消毒程序URL带有前缀.

However since base is set to another URL in index.html, the dom sanitizer URL is prefixed with it.

是否有办法将其关闭?

这是我写的一篇文章，显示了在不添加base属性的情况下它是如何工作的:

This is an article I wrote showing how it works without the base attribute added:

https://medium.com/@ole.ersoy/angular-material-icon-from-github-hosted-svg-logo-d5c35b923d

这是一次堆叠闪电战，显示出添加基本属性时，对绝对URL的调用会以基本属性为前缀，因此传递的URL会断开:

And this is a stackblitz that shows that when the base attribute is added, the call to the absolute URL is prefixed with the base attribute, so the URL passed becomes broken:

https://stackblitz .com/edit/angular-material-custom-icon-with-base?file = src/index.html

Angular为此功能请求WRT:

Angular has a feature request WRT to this issue:

https://github.com/angular/angular/issues/23139

https://github.com/angular/angular/issues/34645

这是stacktrace的屏幕快照，显示基本URL在图像URL之前加前缀:

This is a screenshot of the stacktrace showing that the base URL is prefixed before the image URL:

推荐答案

这看起来像个错误. HttpClient可能没有理由重写具有协议的URL.

This looks like a bug. There is no possible reason for the HttpClient to rewrite a URL which has a protocol.

材料图标注册表不会更改任何图标URL.它实际上对URL并没有做任何特别的事情，只是推迟加载到HttpClient.

Material icon registry doesn't mutate any of the URLs for icons. It doesn't really do anything special with the URL, and just defers loading to the HttpClient.

https://github .com/angular/components/blob/09dc4594259cf1d6b34a5a0893c0bccaa132c319/src/material/icon/icon-registry.ts#L595

我无法重现此内容，因为它需要将应用程序部署到gh pages之类的域中，但是如果您看到此情况，请在Angular GitHub项目上打开一个问题，并告知他们.

I haven't been able to reproduce this, because it would require deploying an app to a domain like gh pages, but if you are seeing this happening then please open an issue on the Angular GitHub project and let them know.

我唯一能给您的答案是编写一个自定义拦截器来修复URL.

The only answer that I can give you is to write a custom interceptor to fix the URL.

这里是一个博客，解释了如何使用拦截器来使用基本URL.这不是如何解决问题的指南，但这是我能找到的最接近的东西.

Here's a blog explaining how to use the interceptor to use a base URL. It's not a guide on how to fix your problem, but it's the closest thing that I could find.

http://www.projectcodify.com/angular-set-base -url-动态地

这篇关于调用DomSanitizer API时不使用基本属性吗?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！