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

SphinxJS

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

使用方法

通过npm安装

npm install sphinx.js

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

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

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

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

编码

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

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

然后你将得到一串base64编码

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

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

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

解码

定义一串图片的url:

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

然后我们对其进行解码!

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

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

配置

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

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

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. AntBlazor Theme in ABP Framework

    介绍 ABP抽象了主题系统,将已有的UI更改到其他的UI框架非常简单,本文介绍了如何将主题切换为AntBlazor Theme. 源码以及示例在Gihub开源. Lsw.Abp.AntDesignUI ...

  2. Qt:QCustomPlot使用教程(三)——用户交互

    0.说明 本节翻译总结自:Qt Plotting Widget QCustomPlot - User Interactions 本节内容是使用QCustomPlot实现绘图和用户交互功能. 本文代码中 ...

  3. 进程&线程(二):Thread相关方法与属性

    学习自:python进程.线程.协程 - 张岩林 - 博客园 1.threading.Thread Thread方法 方法(使用方法为Thread.xxx) 说明 start() 激活线程 getNa ...

  4. 获取HTML中所有图片的 URL

    /// <summary> /// 获取HTML中所有图片的 URL /// </summary> /// <param name="strHtml" ...

  5. 跨越DDD从理论到工程落地的鸿沟

    摘要:本文从DDD的核心概念讲起,重点放在如何把理论落地成代码,期望给那些正在探索DDD的同学一些指引和启发. 本文分享自华为云社区<跨越DDD从理论到工程落地的鸿沟>,作者:敏捷小智. ...

  6. 探索TiDB Lightning的源码来解决发现的bug

    背景 上一篇<记一次简单的Oracle离线数据迁移至TiDB过程>说到在使用Lightning导入csv文件到TiDB的时候发现了一个bug,是这样一个过程. Oracle源库中表名都是大 ...

  7. nginx lua模块常用的指令

    lua_code_cache 语法:lua_code_cache on | off 默认: on 适用上下文:http.server.location.location if 这个指令是指定是否开启l ...

  8. c++ set与unordered set的区别

    c++ std中set与unordered_set区别和map与unordered_map区别类似,其底层的数据结构说明如下: 1.set基于红黑树实现,红黑树具有自动排序的功能,因此map内部所有的 ...

  9. WPF之VisualTreeHelper

     /// <summary>        /// </summary>        /// <typeparam name="T">< ...

  10. 洛谷P1091 [NOIP2004 提高组] 合唱队形

    本题是一个简单的 LIS(最长上升子序列)问题     只是要求俩次最长上子序列而已   很容易的 首先由于是最长上升子序列 所以朴素法的动态规划表达式为  f[i] = max( f[i] , f[ ...