体验地址:https://jrainlau.github.io/sp...
项目地址:https://github.com/jrainlau/s...

SphinxJS

一个能够把字符串编码成png图片,或者从png图片中解码出字符串的超轻量级开源库,总代码数甚至不超过100行!

使用方法

通过npm安装

  1. npm install sphinx.js

通过<script></script>标签引入

  1. <script src="sphinx.js"></script>

值得注意的是,因为SphinxJS使用了ES2015的Promise以及其他很棒的特性,这意味着需要你的浏览器提供支持。否则的话,你可能需要Babel或者一些别的工具去构建你的代码。

SphinxJS同时支持以AMDCommonJS以及ES6模块的方式进行引用。

编码

定义一个字符串Hello Sphinx!,我们将对它进行编码

  1. let base64URL = new Sphinx().encode('Hello Sphinx!')

然后你将得到一串base64编码

  1. data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAJklEQVQYV2P0SM35r8K1heE5owcDY2Zexf8dc1Yw/BdjYGBkQAIA+r4JjQKvLx4AAAAASUVORK5CYII=

到这一步,编码便已经完成了。

正如你所看到的那样,encode()方法返回一张图片的base64编码。

解码

定义一串图片的url:

  1. let url = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAMAAAADCAYAAABWKLW/AAAAJklEQVQYV2P0SM35r8K1heE5owcDY2Zexf8dc1Yw/BdjYGBkQAIA+r4JjQKvLx4AAAAASUVORK5CYII='

然后我们对其进行解码!

  1. new Sphinx().decode(url)
  2. .then((info) => {
  3. console.log(info) // Hello Sphinx!
  4. })

decode()方法会返回一个Promise对象,它包含了从图片中解密出来的字符串信息。

配置

new Sphinx()能够接收一个用于定义图片类型的配置对象

  • config {Object} 可选 默认值: {img: 'png'}

  1. new Sphinx({img: 'bmp'})

证书

MIT

SphinxJS——把字符串编码成png图片的超轻量级开源库的更多相关文章

  1. js 字符串编码转换函数

    escape 方法 对 String 对象编码以便它们能在所有计算机上可读, escape(charString) 必选项 charstring 参数是要编码的任意 String 对象或文字. 说明 ...

  2. C# 在网页中将Base64编码的字符串显示成图片

    在写一个接口,返回的json里面有图片,是Base64编码的字符串. 测试接口的时候,发现原来在html显示,是直接可以将Base64编码的字符串显示成图片的. 格式如下: <img src=d ...

  3. Gson字符串编码,字符串转换成图片保存,二进制转换成图片保存

    import java.io.BufferedInputStream; import java.io.ByteArrayInputStream; import java.io.File; import ...

  4. 图片和base64编码字符串 互相转换,图片和byte数组互相转换

    图片和base64编码字符串 互相转换 import sun.misc.BASE64Decoder; import sun.misc.BASE64Encoder; import java.io.*; ...

  5. base64字符串转化成图片

    package com.dhht.wechat.util; import sun.misc.BASE64Decoder;import sun.misc.BASE64Encoder; import ja ...

  6. UTF-8编码的字符串拆分成单字、获取UTF-8字符串的字符个数的代码及原理

    一.字符编码简介 1. ASCII码 在计算机内部,所有的信息最终都表示为一个二进制的字符串.每一个二进制位(bit)有0和1两种状态,因此八个二进制位就可以组合出256种状态,这被称为一个字节(by ...

  7. C# Base64字符串转换成图片及图片转换为Base64

    最近有朋友经常会问我一些问题,例如,如何把一个字符串转换成base64字符串,如何把一个二进制文件转换成Base64文件,以及如何转换回原有的文件,在此我把方法写一下   字符串与Base64相互转换 ...

  8. WPF GDI+字符串绘制成图片(二)

    原文:WPF GDI+字符串绘制成图片(二) 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/BYH371256/article/details/83 ...

  9. WPF GDI+字符串绘制成图片(一)

    原文:WPF GDI+字符串绘制成图片(一) 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/BYH371256/article/details/83 ...

随机推荐

  1. k8s dashboard 安装和证书更新

    1.k8s 搭建   参见https://blog.51cto.com/lizhenliang/2325770 [root@VM_0_48_centos ~]# kubectl get cs NAME ...

  2. thinkphp 框架自带搜索+分页+搜索标红

    ..........控制器方法 public function index() { //接受搜索关键字 $word=input('word'); $where=[]; if (!empty($word ...

  3. 实践1使用XGB实现酒店信息消歧

    XGB算法是决策树衍生出来的一种算法 场景:酒店的业务人员希望我们能够提供一个算法服务去为酒店信息做一个自动化的匹配,以通过算法的手段,找到那些确定相同的酒店和确定不同的酒店 以下代码为部分 理解业务 ...

  4. JDK 线程池

    JDK 线程池 线程池参数 在JDK的4种线程池之前, 先介绍一下线程池的几个参数 corePoolSize 线程池的核心线程数量, maximumPoolSize 线程池的最大线程数量 keepAl ...

  5. webug 4.0 打靶笔记-01

    webug 4.0 打靶笔记 1. 显错注入 1.1 访问靶场 1.2 判断注入点 查找一切有参数传入的地方进行测试,注意到有get传参?id=1 猜测后台php中sql语句模板可能为如下几种情况 $ ...

  6. 编译OneAPI(支持Nvidia显卡)

    开始使用DPC++ 官方安装教程 预备条件 请确保当前开发环境满足如下条件: git cmake版本需要满足3.14及以上. python版本3.6以上的python. nijia版本1.8及以上(使 ...

  7. 使用http-server 模拟接口数据 mock data

    首先创建文件夹 mkdir mockData&&cd mockData 安装http-server npm i http-server 创建数据文件 touch index.json ...

  8. Docker的4种网络模式详细介绍

    docker run创建Docker容器时,可以用–net选项指定容器的网络模式,Docker有以下4种网络模式: bridge模式:使用–net =bridge指定: host模式:使用–net = ...

  9. python 模块之 selenium 自动化使用教程

    一.安装 pip install Selenium 二.初始化浏览器 Chrome 是初始化谷歌浏览器 Firefox 是初始化火狐浏览器 Edge 是初始化IE浏览器 PhantomJS 是一个无界 ...

  10. python监控cpu 内存实现邮件微信报警

    # qianxiao996精心制作 #博客地址:https://blog.csdn.net/qq_36374896 import psutil, time,smtplib,socket import ...