JavaScript中的dataURI和dataURL之间的混淆

Question

数据URI和数据URL有什么区别？

请看 这里。尽管两个术语都被使用，但它们有何不同？

顺便提一句，这与已经提到的可能重复的帖子不同。这不是HTTP问题！这是JavaScript。

- Arian

---

可能是什么是URI、URL和URN之间的区别？的重复问题。 - Adrian

https://danielmiessler.com/study/url-uri/ - richbai90

没关系。在任何语言中，URL、URI和URN的意思都是相同的。 请查看第一个评论和：https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs - Tejas Kale

@ArianHosseinzadeh JavaScript没有URI和URL（以及URN）的不同定义，它们是基于HTTP定义命名和构建的。 - Patrick Barr

在我看来，这是一个公正的问题。文档很令人困惑，而潜在的重复问题并没有解决@ArianHosseinzadeh的具体问题。 - salezica

Answer 1

URIs是URL的超集。所有URL都是URI，但有些URI不是URL。这个答案提供了正确的定义。通过阅读可以看出，这取决于上下文。

至于您的具体问题，getDataUrl()返回一个URI。它不是URL，因为它实际上不包含有关如何在外部定位资源的任何信息。如MDN链接所示，这个函数的命名并不恰当。

但是，这个信息是隐含的：由于数据blob存在于URI本身内部，只有一个地方可以找到它。因此，您可以辩称，在喝着茶、调整着单片眼镜时，它是一个URL，因为不需要进一步的协议、模式或位置的澄清。

换句话说，这在很大程度上取决于解释方式。我不会过多关注它。

- salezica

Answer 2

我觉得你会出现困惑是因为：

HTMLCanvasElement.toDataURL() 方法返回一个数据 URI，其中包含以 type 参数指定的格式表示的图像。返回的图像分辨率为 96 dpi。

需要注意的是，该文档同时使用了 toDataURL 和数据 URI 的术语。问题在于，用于获取画布元素数据URI的方法名叫做toDataURL。

由于 URL 必须指定数据位置，换句话说，即访问方式（例如 http:// https:// 等），它可能不适合作为 HTMLCanvas.toDataURL() 的返回值，因此文档正确地将返回值称为数据 URI。至于为什么他们决定将方法命名为 toDataURL，我无法解释，除非是因为两者之间的差异微妙，而且他们可能认为如果称其为 toDataURL 更容易记忆。

- richbai90