html5 二进制上传图片,图片上传转二进制流

function tobin(target) {

//获取临时缓存图片的路径，并传递给“显示图片”

var url = window.URL.createObjectURL(target.files.item(0));

//制造一张图片，传入画布，让它在画布中画出来。

var img1 = new Image();

img1.src = url;

//初始化捕捉元素

var can = document.getElementById('can');

var you = document.getElementById('you');

var context = can.getContext("2d");

//当图片制造完成后，执行函数

img1.onload = function() {

//因为canvas输出的二进制图片会根据当前canvas的大小而变形，所以要将图片原始尺寸取出，然后传递给canvas,这样就能保证输出的图片原始比例不变

var nw = img1.naturalWidth;

var nh = img1.naturalHeight;

can.setAttribute('width', nw + 'px')

can.setAttribute('height', nh + 'px')

//图片原始比例

console.log(nw, nh);

//绘制进canvas

context.drawImage(img1, 0, 0, nw, nh);

//二进制流转化函数

var bin = can.toDataURL("image/jpeg"); //bin值已经存放了二进制流

//二进制流传入“显示图片”

you.src = bin;

}

html5 二进制上传图片,图片上传转二进制流相关推荐

LocalResizeIMG前端HTML5本地压缩图片上传，兼容移动设备IOS,android
LocalResizeIMG前端HTML5本地压缩图片上传,兼容移动设备IOS,android jincon 发表于 2015-02-26 18:31:01 发表在: php开发 localresiz ...
用html5 拍照+多图片上传、删除图片、查看图片
用html5中的 file 调用手机拍照以及多图片上传功能,可进行删除图片.放大查看图片,网页版多文件上传也可以用. 代码如下: <!DOCTYPE html> <html>& ...
html ie8上传图片,图片上传本地预览兼容ie8
工作中遇到的,总结下来了,图片上传本地预览限制图片最大为2M 图片上传本地预览 #preview1{width:260px;height:190px;border:1px solid #000;ove ...
asp.net 百度编辑器 UEditor 上传图片图片上传配置编辑器配置网络连接错误，请检查配置后重试...
1.配置ueditor/editor_config.js文件,将 //图片上传配置区,imageUrl:URL+"net/imageUp.ashx" //图片上传提交地址,imag ...
android jersey 上传图片,图片上传--Jersey实现RESTful接口
上次利用SpringMVC实现图片上传,这个是客户端将图片和其他字段一起上传然后一起处理的.(有什么坏处暂时也没有想到)总之这次的希望能够将图片存储的服务独立出来,暂时用Jersey实现一个接口(老大 ...
html5七牛图片上传js,前端如何上传图片至七牛云
上传文件是我们在前端开发中经常遇到的一个问题.最近在做某项目管理后台的时候,需要将轮播图上传至七牛云.以前在Vue里面做过类似的功能,但是在Angular中使用同样的方法发现行不通. 此篇文章主要介绍 ...
html单张图片效果,jquery+html5实现单张图片上传预览
js: if (window.File && window.FileReader && window.FileList && window.Blob){ ...
EXIF-修正图片上传旋转的问题
问题背景: 在移动端使用html5 + canvas进行图片上传时,ios手机竖拍照片时会发生旋转,横拍无此问题,android无此类问题,所以我们希望获取到照片拍摄的方向角,进行旋转修复. EXIF ...
ssm上传文件获取路径_ssm框架实现图片上传显示并保存地址到数据库(示例代码)...
本案例是通过springmvc+spring+mybatis框架以商品上传为例,实现的图片上传功能,并把图片的地址保存到数据库并在前台显示上传的图片. 本项目是使用maven搭建的项目,首先看下项目结 ...

html5 二进制上传图片,图片上传转二进制流

html5 二进制上传图片,图片上传转二进制流相关推荐

最新文章

热门文章

html5 二进制 上传图片,图片上传转二进制流

html5 二进制 上传图片,图片上传转二进制流相关推荐

最新文章

热门文章

html5 二进制上传图片,图片上传转二进制流

html5 二进制上传图片,图片上传转二进制流相关推荐