我遇到下一个问题:我在asp.netazurite,我可以成功上传并从中获取图像,此图像在浏览器中成功渲染,但当我将此URL放入我的angular应用程序中的img标记时,我遇到错误:未能构造'URL':URL无效。
我尝试使用encodeURIComponent函数来构造我的URL
var encodedContainerName = encodeURIComponent("");
var encodedBlobName = encodeURIComponent("");
this.imageUrl = "http://127.0.0.1:10000/devstoreaccount1/" + encodedContainerName + "/" + encodedBlobName;
但问题依然存在
1条答案
按热度按时间mctunoxg1#
您看到的错误(
Failed to construct 'URL': Invalid URL
)通常表明传递到URL对象或类似函数的值不是正确的URL格式。从你给出的例子来看:
encodedContainerName
和encodedBlobName
都是空的。这可能是你问题的根源。确保您正在为容器名称和blob名称赋值:
如果这仍然不能解决问题,请考虑以下几点:
1.CORS配置:确保Azurite已正确配置,以允许来自Angular应用程序域的跨域请求。
1.内容交付:有时,内容提供的方式很重要。如果图像的内容类型没有正确发送,浏览器可以拒绝加载它们。确保Azurite正在发送适当的内容头。
1.网址验证:构建URL后,将其记录(
console.log(this.imageUrl)
)并手动检查URL是否正确。尝试直接在浏览器中访问此URL。1.备选图片标签:不要直接将URL绑定到
<img>
标签的src
,而是尝试使用Angular的绑定:1.清理URL:Angular有一个安全功能,可以清除潜在的不安全值。如果Angular将URL标记为不安全,您可能必须绕过安全性并自行清理URL。使用Angular的
DomSanitizer
:然后,在模板中:
请记住,绕过Angular内置的安全检查可能会使您的应用程序暴露于各种漏洞,因此请始终确保您正在清理和加载到应用程序中的URL。