“图像/png；base64？”它有什么作用？ [复制]答案

【问题标题】："image/png;base64?" what does it do? [duplicate]“图像/png；base64？”它有什么作用？ [复制]
【发布时间】：2016-05-03 11:51:25
【问题描述】：

我对这段代码有疑问：

redirectUrl:"data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg=="

当我包含这段代码时，网站上的所有图片都不会加载。但是这个编码器是做什么的呢？

它会阻止图片、隐藏它们还是不加载它们？

【问题讨论】：

这段代码什么也没做。它周围的大块确实如此。
atob('iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAACklEQVR4nGMAAQAABQABDQottAAAAABJRU5ErkJggg==') 是你图片的二进制数据。

标签： javascript google-chrome-extension

【解决方案1】：

data:image/png;base64 只是告诉解析器它是一个 base 64 编码的 png 图像。如果愿意，可以将其设为标题。

【讨论】：

【解决方案2】：

data 描述协议。（如 .. ftp、http、https 等）
: 将协议与其参数分开
由于它的数据，以下块：image/png 描述了数据的类型
在这个位置可能会出现其他信息，如内容语言等。
;base64 描述数据的编码
, 将标题与数据分开
iVBORw0KG… 要呈现的实际数据。

你可以在这里阅读更多内容：https://en.wikipedia.org/wiki/Data_URI_scheme

您提供的 png 是包含透明像素的 1x1 像素图像。

【讨论】：

但是当我只包含该代码时，为什么它不显示任何图片？它对图片有什么作用。
@kamitodono 就其本身而言，它没有。是围绕这个 sn-p 的代码做了一些事情。没有上下文，我可以猜测会发生什么（来自redirectUrl 名称），但无法详细回答。