linux jpg图片转base64,html中的图片直接使用base64编码后的字符串代替

最近来了一个网页,里面有图片,但是却没有引用外部的图片资源,很好奇.查看代码后发现,里面的图片是使用base64编码后的字符串代替了,这个叫做Data URI scheme.

Data URI scheme支持的类型有:

data:,文本数据

data:text/plain,文本数据

data:text/html,HTML代码

data:text/html;base64,base64编码的HTML代码

data:text/css,CSS代码

data:text/css;base64,base64编码的CSS代码

data:text/javascript,Javascript代码

data:text/javascript;base64,base64编码的Javascript代码

data:image/gif;base64,base64编码的gif图片数据

data:image/png;base64,base64编码的png图片数据

data:image/jpeg;base64,base64编码的jpeg图片数据

data:image/x-icon;base64,base64编码的icon图片数据

自己做了一个简单的页面,点击查看测试页面,大家可以看一下源码.整体上操作如下:

1 base64编码图片

linux下直接可以使用base64+图片路径就可以产生base64编码后的字符串

图片:

fa7c2b0dd1e857bdbf3f22e7aab63d99.png 

使用命令:

base64 android.png

产生的字符串为:

复制代码代码如下:

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

Uf9X/b9iUFWDXGGQ

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值