体验地址: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. composer.json和composer.lock到底是什么以及区别?

    composer方文档:https://docs.phpcomposer.com/04-schema.html我们在做项目的时候,总是要安装一些依赖.composer给我们提供了很多方便.直接运行co ...

  2. 分布式 PostgreSQL 集群(Citus)官方示例 - 多租户应用程序实战

    如果您正在构建软件即服务 (SaaS) 应用程序,您可能已经在数据模型中内置了租赁的概念. 通常,大多数信息与租户/客户/帐户相关,并且数据库表捕获这种自然关系. 对于 SaaS 应用程序,每个租户的 ...

  3. 从读写角度,带你了解数仓的IO基本框架

    摘要:本文从读取和写入的角度分别描述了行存和列存的IO模型,并对文件结构做了简单介绍. 本文分享自华为云社区<GaussDB(DWS)基本IO框架>,作者: Naibaoofficial. ...

  4. Python基础之hello world!

    仪式感很重要嘛: 精通各个语言的hello world! Python3 版本的 print('Hello world')

  5. 【自动化基础】allure描述用例详细讲解及实战

    前言 allure可以输出非常精美的测试报告,也可以和pytest进行完美结合,不仅可以渲染页面,还可以控制用例的执行.下面就对allure的使用进行一个详细的介绍和总结. 需要准备的环境: pyth ...

  6. For循环案例练习一基础版

    输出1-10之间的数据 1 public class LX1 { 2 public static void main(String[] args) { 3 for (int x=1;x<=10; ...

  7. 个人网站tqqj.top

    建站历程 就在这里记录自己的建站历程吧!:) 2022-3-21 今天写这个建站历程实际上是有点晚了,因为我已经把网站完全上线了,意思就是说网站已经在运行了. 这个网站是准备建立自己的博客使用的,但是 ...

  8. RESTful API设计规范总结

    RESTful 是目前最流行的 API 设计规范,用于 Web 数据接口的设计. 它的大原则容易把握,但是细节不容易做对.本文总结 RESTful 的设计细节,介绍如何设计出易于理解和使用的 API. ...

  9. 跑马灯带你深入浅出TextView的源码世界

    一.背景 想必大家平时也没那么多时间是单独看源码,又或者只是单纯的看源码遇到问题还是不知道怎么从源码的角度解决. 但是大家平时开发过程中肯定会遇到这样或那样的小问题,通过百度.Google搜索都无果, ...

  10. 渗透测试系统kali配置源

    镜像下载.域名解析.时间同步请点击阿里云开源镜像站 kali是一款非常棒的渗透测试系统,但是他使用的源是国外的,这对于我们来说非常不友好,下载东西非常慢或者下载不了,更换国内源目的就是为了方便我们使用 ...