js 图片转换为base64

<input id="file" type="file">

<img id="img" style="max-height: 300px;">

<textarea id="textarea" style="width: 100%;height: 300px;"></textarea>

<script>

$("#file").change(function () {

  run(this, function (data) {

    $(‘#img‘).attr(‘src‘, data);

    $(‘#textarea‘).val(data);

  });

});

function run(input_file, get_data) {

/*input_file:文件按钮对象*/

/*get_data: 转换成功后执行的方法*/

if (typeof (FileReader) === ‘undefined‘) {

  alert("抱歉,你的浏览器不支持 FileReader,不能将图片转换为Base64,请使用现代浏览器操作!");

} else {

try {

  /*图片转Base64 核心代码*/

  var file = input_file.files[0];

  //这里我们判断下类型如果不是图片就返回 去掉就可以上传任意文件

  if (!/image\/\w+/.test(file.type)) {

    alert("请确保文件为图像类型");

    return false;

  }

  var reader = new FileReader();

  reader.onload = function () {

    get_data(this.result);

  }

  reader.readAsDataURL(file);

  } catch (e) {

    alert(‘图片转Base64出错啦!‘ + e.toString())

  }

}

}

</script>

关于FileReader资料:https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader

时间: 2024-11-10 12:05:29

js 图片转换为base64的相关文章

js 图片转换base64 base64转换为file对象

function getImgToBase64(url,callback){//将图片转换为Base64 var canvas = document.createElement('canvas'), ctx = canvas.getContext('2d'), img = new Image; img.crossOrigin = 'Anonymous'; img.onload = function(){ canvas.height = img.height; canvas.width = img

JS 图片转Base64

JS 图片转Base64 有时候需要向HTML中插入一张图片,可苦于上线后找不到一个合适的网盘来存储这些图片,有没有一种办法能将图片转换成文字,然后直接插入HTML中呢,通过Base64编码就可以解决这个问题. 废话不多说直接上代码.不知道什么是Base64的请自行百度. 图片转Base64 示例代码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>JS

JAVA 将图片转换为Base64编码

这里使用的jar包是commons-codec-1.10.jar; 示例代码 1 import java.io.FileInputStream; 2 import java.io.FileOutputStream; 3 import java.io.IOException; 4 import java.io.InputStream; 5 import java.io.OutputStream; 6 7 import org.apache.commons.codec.binary.Base64;

将图片转换为base64 格式

1.页面上的图片,转换成base64格式,可以通过canvas 的 toDataURL 例子:给定图片的url 将图片转换为base64 var imageSrc = "../images/0.jpg"; // 图片的URL //@param image:Image 对象,ext:图片的格式(jpg)function getBase64Image(image,ext){ var canvas = document.createElement("canvas"); c

js图片转base64

/** * 将图片转换为Base64 */ function image2Base64(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);

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

最近有朋友经常会问我一些问题,例如,如何把一个字符串转换成base64字符串,如何把一个二进制文件转换成Base64文件,以及如何转换回原有的文件,在此我把方法写一下 字符串与Base64相互转换 编码: byte[] bytes = Encoding.Default.GetBytes("要转换的字符"); string str = Convert.ToBase64String(bytes); 解 码: byte[] outputb = Convert.FromBase64String

将图片转换为Base64编码的字符串

图片以文件的形式存在,可以在表单中使用. 也可以转换成Base64编码的字符串,从而在css.js中以字符串的形式使用图片.例如,在css中设置背景图片.在js中用ajax上传图片. <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width

C#中图片转换为Base64编码,Base64编码转换为图片

#region 图片转为base64编码的字符串 public string ImgToBase64String(string Imagefilename) { try { Bitmap bmp = new Bitmap(Imagefilename); MemoryStream ms = new MemoryStream(); bmp.Save(ms, System.Drawing.Imaging.ImageFormat.Jpeg); byte[] arr = new byte[ms.Lengt

python 将图片转换为base64编码转储进数据库

# _*_ coding: utf-8 _*_#中间件:拓展工具遍历文件夹,对文件夹图片进行base64编码,写入数据库,并且读取查找方法__author__ = 'wf15038'__date__ = "2018/8/28 18:38" import pymysqlimport sysfrom datetime import datetimeimport base64import os now = datetime.now().strftime('%Y-%m-%d %H:%M:%S'