Base64是什么
来源:互联网 发布:mac编辑图片怎么保存 编辑:程序博客网 时间:2024/06/01 20:50
Base64编码和解码的应用
一、疑问解答
1、Base64是什么?为什么要用Base64?
定义:Base64是一种基于64个可打印字符来表示二进制数据的表示方法。
由于2的6次方等于64,所以每6个比特为一个单元,对应某个可打印字符。三个字节有24个比特,对应于4个Base64单元,即3个字节可表示4个可打印字符。它可用来作为电子邮件的传输编码。在Base64中的可打印字符包括字母A-Z、a-z、数字0-9,这样共有62个字符,此外两个可打印符号在不同的系统中而不同。一些如uuencode的其他编码方法,和之后binhex的版本使用不同的64字符集来代表6个二进制数字,但是它们不叫Base64。
应用:Base64常用于在通常处理文本数据的场合,表示、传输、存储一些二进制数据。包括MIME的email、在XML中存储复杂数据。
2、Base64是如何编码的?
编码规则:转换的时候,将三个byte的数据,先后放入一个24bit的缓冲区中,先来的byte占高位。数据不足3byte的话,于缓冲器中剩下的bit用0补足。然后,每次取出6(因为2^6=64)个bit,按照其值选ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/中的字符作为编码后的输出。不断进行,直到全部输入数据转换完成。
缺点:编码后的数据比原始数据略长,为原来的4/3。在电子邮件中,根据RFC 822规定,每76个字符,还需要加上一个回车换行。可以估算编码后数据长度大约为原长的135.1%。
特殊情况:当原数据长度不是3的整数倍时, 如果最后剩下一个输入数据,在编码结果后加2个“=”;如果最后剩下两个输入数据,编码结果后加1个“=”;如果没有剩下任何数据,就什么都不要加,这样才可以保证数据还原的正确性
3、Base64在URL中如何应用?
Base64编码可用于在HTTP环境下传递较长的标识信息。然而,标准的Base64并不适合直接放在URL里传输,因为URL编码器会把标准Base64中的“/”和“+”字符变为形如“%XX”的形式,而这些“%”号在存入数据库时还需要再进行转换,因为ANSI SQL中已将“%”号用作通配符。
为解决此问题,可采用一种用于URL的改进Base64编码,它不在末尾填充’=’号,并将标准Base64中的“+”和“/”分别改成了“-”和“_”,这样就免去了在URL编解码和数据库存储时所要作的转换,避免了编码信息长度在此过程中的增加,并统一了数据库、表单等处对象标识符的格式。
另有一种用于正则表达式的改进Base64变种,它将“+”和“/”改成了“!”和“-”,因为“+”,“*”以及前面在IRCu中用到的“[”和“]”在正则表达式中都可能具有特殊含义。
此外还有一些变种,它们将“+/”改为“-”或“.”(用作编程语言中的标识符名称)或“.-”(用于XML中的Nmtoken)甚至“_:”(用于XML中的Name)。
概念来源:https://zh.wikipedia.org/wiki/Base64
二、程序实现
基本思路:前端编码、后台解码。
运用语言:JavaScript、 HTML、 AJAX 、JavaEE
前端程序设计:html输入、js实现Base64编码、ajax实现请求。
后端程序设计:servlet作为接口。
1、Base64实现文本的编码传输
前端代码如下:
<!doctype html><html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width" /> <meta http-equiv="Access-Control-Allow-Origin" content="*"> <title>base64编码传输</title> <script type="text/javascript" src="jquery.min.js"></script> <script> function base64Encode(){ result.value = btoa(encodeURI(text.value)); //编码 } function submit( ) { var base64 = btoa(encodeURI(text.value)); //获取编码后字符串 //var base64 = window.btoa(window.encodeURIComponent(text.value)); //并不能解决中文乱码的问题 console.log(base64); $.ajax({ type : "post", url : "http://10.210.0.105:8080/Base64PostImage/DecodeString", //后台接口 data : { "text" : base64 }, success : function(data) { console.log(data); if (data) { alert(data); } else { alert("false"); } } }); }; </script></head><body> <p>输入编码文本</p> <textarea id="text" cols="50" rows="5"></textarea> <button id="btn" onclick="base64Encode()">Base64编码</button> <p style="margin:0">编码后:</p> <textarea id="result" cols="50" rows="5" readonly ></textarea> <button id="submit" onclick="submit()">post</button> </body></html>
后台代码如下:
servlet接口:DecodeString类
package com.wxy.servlet;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import com.wxy.base64.Base64Util;/** * Servlet implementation class DecodeString */@WebServlet("/DecodeString")public class DecodeString extends HttpServlet {private static final long serialVersionUID = 1L;/** * @author FollowFire * @date 2017年12月17日 00:28:16 * @Description: 解码前端传来的字符串 */protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub PrintWriter out = response.getWriter(); response.setCharacterEncoding("UTF-8"); response.setHeader("Access-Control-Allow-Origin", "*"); String text = request.getParameter("text"); System.out.println(text); System.out.println(Base64Util.Decoder(text)); out.println(Base64Util.Decoder(text)); }}
Base64Util类:没有使用其他包,导入java.util.Base64;
package com.wxy.base64;import java.io.UnsupportedEncodingException;import java.util.Base64;/** * @ClassName: Base64Util * @Description: * @author FollowFire * @date 2017年12月16日 下午11:18:45 */public class Base64Util {/** * @Method: Encoder * @Description: 对文本进行编码 * @param text * @return String * @author FollowFire * @date 2017年12月16日 下午11:18:32 */public static String Encoder(String text) throws UnsupportedEncodingException { Base64.Encoder encoder = Base64.getEncoder(); byte[] textByte = text.getBytes("UTF-8"); String encodedText = encoder.encodeToString(textByte); return encodedText;}/** * @Method: Decoder * @Description:对文本进行解码 * @param text * @return String * @author FollowFire * @date 2017年12月16日 下午11:21:08 */public static String Decoder(String text) throws UnsupportedEncodingException { Base64.Decoder decoder = Base64.getDecoder(); String decoderText = new String(decoder.decode(text), "UTF-8"); return decoderText;}/** * * @Method: main * @Description: * @param * @return void * @author FollowFire * @throws UnsupportedEncodingException * @date 2017年12月16日 下午11:21:16 */public static void main(String[] args) throws UnsupportedEncodingException { // TODO Auto-generated method stub System.out.println(Encoder("测试")); System.out.println(Decoder(Encoder("测试")));}
}
2、Base64实现图片的编码传输
前端代码如下:
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width" /> <meta http-equiv="Access-Control-Allow-Origin" content="*" /> <title>base64编码传输</title> <script type="text/javascript" src="jquery.min.js"></script> <script type="text/javascript"> var img; var imgPre; function preImg(sourceId, targetId) { img=window.URL.createObjectURL(document.getElementById(sourceId).files.item(0)); imgPre = document.getElementById(targetId); imgPre.src = img; return imgPre; } function getBase64Image(img) { var canvas = document.createElement("canvas"); canvas.width = img.width; canvas.height = img.height; var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0, img.width, img.height); var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase(); /// var dataURL = canvas.toDataURL("image/"+ext); var dataURL = canvas.toDataURL("image/png").split("base64,")[1]; return dataURL; } function submit( ) { var image = new Image(); image.src = img; var base64 = getBase64Image(image); console.log(img); $.ajax({ type : "post", url : "http://10.210.0.105:8080/Base64PostImage/getpic", data : { "imgBase64" : base64 }, success : function(data) { console.log(data); if (data) { alert(data); } else { alert("false"); } } }); }; </script> </head> <body> 图片 <input type="file" name="image" id="imgOne" onchange="preImg(this.id,'photo');" /> <img id="photo" src="" width="50px" height="50px" style="display: block;" /> <br /> <input type="submit" id="btn" onclick="submit();" /> </body></html>
后台代码如下:
package com.wxy.servlet;import java.io.FileOutputStream;import java.io.IOException;import java.io.OutputStream;import java.io.PrintWriter;import java.util.Base64;import javax.servlet.ServletException;import javax.servlet.annotation.WebServlet;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;@WebServlet("/getpic")public class GenerateImage extends HttpServlet {private static final long serialVersionUID = 1L; /** * * @Method: DecoderImage * @Description: 实现照片的解码 * @param imgStr * @return boolean * @author FollowFire * @date 2017年12月17日 上午2:10:54 */public static boolean DecoderImage(String imgStr) { // 对字节数组字符串进行Base64解码并生成图片 if (imgStr == null) // 图像数据为空 return false; try { // Base64解码 byte[] b = Base64.getDecoder().decode(imgStr); for (int i = 0; i < b.length; ++i) { if (b[i] < 0) {// 调整异常数据 b[i] += 256; } } // 生成jpeg图片 String imgFilePath = "F:/2/test/new.jpg";// 新生成的图片 OutputStream out = new FileOutputStream(imgFilePath); out.write(b); out.flush(); out.close(); return true; } catch (Exception e) { System.out.println("error"); return false; }}protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { // TODO Auto-generated method stub PrintWriter out = response.getWriter(); response.setCharacterEncoding("UTF-8"); response.setHeader("Access-Control-Allow-Origin", "*"); String imgBase64 = request.getParameter("imgBase64"); //System.out.println(imgBase64); System.out.println(DecoderImage(imgBase64)); out.println(DecoderImage(imgBase64));}}
代码下载:http://download.csdn.net/download/m0_37661961/10162199
- Base64是什么
- data:image/png;base64是什么
- data:image/png;base64是什么
- data:image/png;base64是什么
- 将图片转换base64格式,data:image/png;base64是什么?
- Data URI Scheme -- data:image/jpg;base64是什么
- 图片上传图片后 data:image/png;base64是什么
- base64
- BASE64
- Base64
- BASE64
- Base64
- Base64
- base64
- base64
- base64
- base64
- base64
- java List实体排序
- C语言跳转语句
- 获取本地歌曲信息的方法
- leetcode 538. Convert BST to Greater Tree 后序遍历的一个应用
- RDD常用操作
- Base64是什么
- pthon6个必要库
- 蓝桥杯 基础练习 字母图形
- 好书推荐《蚀心者》(剧透高能预警)
- Android 使用 FFmpeg (二)——视屏流播放简单实现
- C语言递归嵌套
- spring注解应用场景
- WPF课堂例子
- 实时聊天APP(websocket+hybridAPP)