[转]js 将图片连接转换称base64格式
参考:http://blog.csdn.net/wyyfwm/article/details/45917255
我们把图像文件的内容直接写在了HTML 文件中,这样做的好处是,节省了一个HTTP 请求。坏处呢,就是浏览器不会缓存这种图像。现在我们提供一个js:
function convertImgToBase64(url, callback, outputFormat){
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.width;
ctx.drawImage(img,0,0);
var dataURL = canvas.toDataURL(outputFormat || 'image/png');
callback.call(this, dataURL);
canvas = null;
};
img.src = url;
}
convertImgToBase64('http://bit.ly/18g0VNp', function(base64Img){
// Base64DataURL
});
[转]js 将图片连接转换称base64格式的更多相关文章
- js 将图片连接转换称base64格式
我们把图像文件的内容直接写在了HTML 文件中,这样做的好处是,节省了一个HTTP 请求.坏处呢,就是浏览器不会缓存这种图像.现在我们提供一个js: function convertImgToBase ...
- js 将图片文件转换成base64
1.情景展示 在JavaScript中,如何使用图片文件转换成base64? 2.解决方案 /** * 网络图像文件转Base64 * @param img dom对象 */ function g ...
- js如何将选中图片文件转换成Base64字符串?
如何将input type="file"选中的文件转换成Base64的字符串呢? 1.首先了解一下为什么要把图片文件转换成Base64的字符串 在常规的web开发过程中,大部分上传 ...
- 图片文件转换成Base64编码实现ajax提交图片
//上传头像图片 function uploadHead(imgPath) { console.log("imgPath = " + imgPath); var image = n ...
- Vue directive自定义指令+canvas实现H5图片压缩上传-Base64格式
前言 最近优化项目-手机拍照图片太大,回显速度比较慢,使用了vue的自定义指令实现H5压缩上传base64格式的图片 canvas自定义指令 Vue.directive("canvas&qu ...
- C++读写图片数据转成Base64格式的一种方法
最近在一个项目中要实现在客户端和服务端之间传送图片文件的功能,采用了C++语言读写图片转化成Base64格式进行传输.具体代码如下: //++Base64.h #pragma once class C ...
- data:image/png;base64 上传图像将图片转换成base64格式
大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如: data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJ ...
- javascript-文件File转换成base64格式
不能直接访问用户计算机中的文件,一直都是Web应用开发中的一大障碍.2000年以前,处理文件的唯一方式就是在表单中加入<input type="file">字段,仅此而 ...
- C++读写图片数据转成Base64格式
转载:http://www.cnblogs.com/jeray/p/8746976.html 转载:https://www.cnblogs.com/lujin49/p/4957742.html 转载: ...
随机推荐
- mysql中now()函数的使用,还有oracle的sysdate,可能埋下的坑
mysql中now()函数的使用,还有oracle的sysdate 在需求中如果系统中药添加当前操作的时间那么很简单的一个操作在写sql的时候直接在这个字段对应的位置写上now()函数就可以了,这样就 ...
- bzoj 1066 蜥蜴
最大流. 建图:首先将每根柱子拆成两个点. 每根柱子的入点向出点连一条容量为柱子高度的边. 每根柱子的出点向可以到达的柱子的入点连一条容量为正无穷的边. 源点向每根初始有蜥蜴的柱子的入点连一条容量为一 ...
- npm 使用记录
在 Mint 下安装 pencil,折腾半天,发现它对 firefox 的支持,只到 46.0 .本来打算研究下怎么用 xulrunner 来跑 pencil 这个 web 应用,查看项目资源的时候, ...
- MySQL二进制安装
前提 version mysql-5.5 platform centos6.x 添加用户 useradd -M -s /sbin/nologin mysql 安装需要的包 yum -y install ...
- 谈谈java开发
1.不要让未来的决策阻止你现在前进的方向 一步步列出每个步骤,那么对于现在应该专注于做什么,就一目了然了.你也不会浪费 时间去担心应该以后操心的事情. 2.不要让自信诱骗你忘事 当你去学习一个新概 ...
- 20145204&20145212信息安全系统实验一
信息安全系统实验报告 博客链接
- 广播接收者Receiver
一,动态创建网络状态监控 思路: 1:需要注册一个广播接收者,registerReceiver()需要两个参数 public Intent registerReceiver( BroadcastRec ...
- Unable to load configuration. - Class: java.net.AbstractPlainSocketImpl
[Bug笔记]Unable to load configuration. - Class: java.net.AbstractPlainSocketImpl 标签: bugjartomcat服务器互联 ...
- [UML]UML系列——活动图activity diagram
系列文章 [UML]UML系列——用例图Use Case [UML]UML系列——用例图中的各种关系(include.extend) [UML]UML系列——类图Class [UML]UML系列——类 ...
- [linux]Socket编程的头文件
socket编程中需要用到的头文件 sys/types.h:数据类型定义 sys/socket.h:提供socket函数及数据结构 netinet/in.h:定义数据结构sockaddr_in arp ...