直接上代码:

var img = "imgurl";//imgurl 就是你的图片路径  

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);
return dataURL;
} var image = new Image();
image.src = img;
image.onload = function(){
var base64 = getBase64Image(image);
console.log(base64);
}

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

  1. js 将图片转换为 base64

    var img = document.getElementById('s_lg_img'); function getBase64Image(img) { var canvas = document. ...

  2. js 图片转换为base64

    <input id="file" type="file"> <img id="img" style="max-h ...

  3. js,JQ 图片转换base64 base64转换为file对象,blob对象

    //将图片转换为Base64 function getImgToBase64(url,callback){ var canvas = document.createElement('canvas'), ...

  4. 使用JS将图片转为Base64

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. 将图片转换为base64 格式

    1.页面上的图片,转换成base64格式,可以通过canvas 的 toDataURL 例子:给定图片的url 将图片转换为base64 var imageSrc = "../images/ ...

  6. JAVA 将图片转换为Base64编码

    这里使用的jar包是commons-codec-1.10.jar; 示例代码 import java.io.FileInputStream; import java.io.FileOutputStre ...

  7. C# 图片转换为base64

    WebRequest webRequest = WebRequest.Create("验证码url"); WebResponse webResponse = webRequest. ...

  8. 【PHP】图片转换为base64,经过post传输后‘+’会变成 ‘空格’

    图片转换为base64,经过post传输后‘+’会变成 ‘空格’, 需要用PHP 处理一下 $str= $_POST['img_data']; $str= str_replace(' ','+',$s ...

  9. js小工具---本地图片转换为base64编码数据

    今天用jmeter对图片对比进行性能测试,post请求为json请求,图片为Base64编码后的图片数据.所以需要将一张本地图片生成base64编码,找到一个js小工具,记录在这儿便于以后复用. 效果 ...

随机推荐

  1. ckeditor 上传图片解决跨域问题

    前后端分离ckeditor跨域问题处理 这个跨域问题很常见,特别是前后端分离的情况,IP地址不同导致了页面跨域,具体原因大多是因为前端ifame问题 分析 ckeditor插件里config.js需要 ...

  2. PRTG安装

    1.去官网下载,记录下试用秘钥,然后执行安装 2. 3. 4.输入秘钥 5. 6.安装完成后自动转到如下页面,点击启动Guru 7. 8. 9. 10.输入prtgadmin,密码prtgadmin ...

  3. 基于Python3.6使用Django框架连接mysql数据库的驱动模块安装解决办法

    解决办法1 使用PyMySQL模块,直接使用pip install pymysql即可. 参考文章:https://www.cnblogs.com/wcwnina/p/8719482.html 原文内 ...

  4. SNF快速开发平台MVC-富文本控件集成了百度开源项目editor

    一.效果如下: 二.在框架当中调用代码如下: 1.在js里配置如下: <script type="text/javascript"> var viewModel =fu ...

  5. Linux内核修炼之framebuffer分析

    Linux源代码包中/document/fb/framebuffer.txt有例如以下介绍: The frame buffer device provides an abstraction for t ...

  6. Python--Redis实战:第四章:数据安全与性能保障:第7节:非事务型流水线

    之前章节首次介绍multi和exec的时候讨论过它们的”事务“性质:被multi和exec包裹的命令在执行时不会被其他客户端打扰.而使用事务的其中一个好处就是底层的客户端会通过使用流水线来提高事务执行 ...

  7. pycharm如何在debug的时候动态执行python语句

    在调试MATLAB的时候,这一点很容易实现,比如动态修改变量的值,在VS2017中调试python程序,这一点也很容易实现,但是我在pycharm里面找了半天,如下图:

  8. <我的股票交易知识汇总与个人感悟_v1.0 (By geman)>

    书在这里 一个完整的股票交易包括选股.买股.持股.卖股四个阶段. 右侧交易,顶是跌出来的,底是涨出来的 一定要敢于止损,设好止损位,严格执行,即使踏空也无怨无悔:资金安全第一位 坚持只买处于上升通道的 ...

  9. [ModemManger]ModemManger的取消

    http://www.linux-databook.info/?page_id=3748 systemctl disable ModemManager.service 失能ModemManger从而取 ...

  10. Git 藏匿操作

    假设您正在为您的产品实施的一项新功能.你的代码是在推进开发进度而客户不断升级需求突然来了.正因为如此,你必须保持放下你的新功能,工作几个小时.你不能提交你的部分代码,也不能扔掉你的变化.所以,你需要一 ...