首先这里有个new FileReader()的概念,这是h5新增的,用来把文件读入内存,并且读取文件中的数据。FileReader接口提供了一个异步API,使用该API可以在浏览器主线程中异步访问文件系统,读取文件中的数据,他有个readAsDataURL的方法,可以读取url,同时input file的change事件里面有个this.file是个数组,反应的当前上传文件的具体参数

打印出来有这些,可以判断当前上传文件类型和大小,通过readAsDataURL(this.files[0]),就可以读取当前文件,然后再Filerender的实例的onload方法里面获取当前结果

地址这就是原理,那么exif有什么用呢? 因为ios在拍照上传照片时候,会旋转90度自动修正,而exif就是保存图片元数据的作用

代码如下

EXIF.getData(p, function() {
orientation = parseInt(EXIF.getTag(p, "Orientation"));
orientation = orientation ? orientation : 1;
});

关于手机端h5上传图片配合exif.min.js,processImg.js的使用的更多相关文章

  1. 移动手机端H5无缝间歇平滑向上滚动js代码

    在没结合css3的transform实现平滑过渡前,我都是用的jquery的animate方法,此方法在PC端基本看不出来有稍微卡顿的现象,但是在性能不高的手机上使用该方法,就会有明显的卡顿现象,不够 ...

  2. 【极品代码】一般人我不告诉他,手机端h5播放时不自动全屏代码

    已测适用于ios,某些安卓手机微信下播放视频会出现播放器控件(这个实在是无力吐槽噢,因为之前还遇到过微信播放完视频后竟然无法退出全屏出现广告的情况,只有播放完后刷新页面并且要放到框架页里才能屏蔽微信视 ...

  3. vue+node开发手机端h5页面开发遇到的坑

    项目进行中...随时更新 这里记录了一些手机端调试的方式 一 css 1.文字超过span宽度显示...(单行文字) .topWrap .introduce span { padding: 0 17p ...

  4. 记录手机端h5页面碰到的一些问题

    关于input光标在手机端偏移 问题根本:不要使用line-height垂直居中. 解决方法:可直接定义height,然后高度由上下padding值撑开. 移动端清除input光标 ios input ...

  5. 手机端h5页面 图片根据手势放大缩小

    pinchzoom.js 这个插件可以简单的实现这一功能 <div class="big_pos_img page"> <div class="pinc ...

  6. 专注手机端前端界面开发的ui组件和js组合

    frozenui一款腾讯开发的简化版Bootstrap,只用于手机端 http://frozenui.github.io/ https://github.com/frozenui/frozenui z ...

  7. iPhone X 适配手机端 H5 页面通用解决方案

    一:本文提供两种解决方案 1.终端解决方案(最优,建议选择) 2.web解决方案 导语: iPhone X的出现,一方面对于整个手机行业的发展极具创新领头羊的作用,另一方面也对现有业务的页面适配带来了 ...

  8. wap手机端实现上传图片流程

    实现图片上传使用了WeUI uploader插件 WeUI:是一套同微信原生视觉体验一致的基础样式库,为微信Web开发量身设计 流程:图片上传用到了FileReader,FormData,用这两个基本 ...

  9. 手机端H5点击类目自动定位到相应内容

    _obj = {}; /*点击弹出分类*/_obj.openZZ=function(){ document.getElementById("app_screen01").style ...

随机推荐

  1. C++:引用的简单理解

    前言:引用是C++一个很重要的特性,最近看了很多有关引用的资料和博客,故在此对引用的相关知识进行总结 一.什么是引用 引用,顾名思义是某一个变量或对象的别名,对引用的操作与对其所绑定的变量或对象的操作 ...

  2. python开发_stat

    当我们使用os.stat(path)获取一个文件(夹)信息的时候, os.stat(path)本身返回的是一个元组如: nt.stat_result(st_mode=33206, st_ino=203 ...

  3. 论文笔记 Beyond Part Models: Person Retrieval with Refined Part Pooling_ECCV_2018

    1. 摘要 使用part-feature 能够起到更好的效果,不过这个需要我们很好地定位part的位置. 本文中作者集中考虑part内部的一致性,提出了 part-based convolutiona ...

  4. Mysql基础知识—索引

    公司最近开始尝试进行改革,如何活跃团队气氛.开发就给我们说了一些算是科普类的数据库知识,下面参杂自己的理解,方便自己后续翻看.   1.什么是索引 索引在MySQL中也叫做“键”,是存储引擎用于快速找 ...

  5. MySQL学习【第十篇存储引擎实际应用】

    一.将现有的myiasm引擎转化为innodb引擎 1.首先我们知道myisam有几点特别烦 a( 运用的是表级锁 b( 不支持csr(故障自动恢复) 2.mysql的5.1.177版本innodb引 ...

  6. html 头标签 <meta http-equiv 属性应用。

    比较常用的 1. 网页出现乱码时设置字符集 <meta http-equiv="content-Type" content="text/html; charset= ...

  7. Yii2 的安装及简单使用

    前段时间第一次使用Yii2框架,碰到了一些问题,这里记录一下. Yii2安装:通过composer安装 1.首先要安装composer,我在另外一篇博客中介绍了如何在Windows下安装compose ...

  8. Linux-2.6驱动程序分层分离概念

    下面以一个按键的实验作为驱动分离时间简单学习: #include <linux/module.h> #include <linux/version.h> #include &l ...

  9. C++快速开发样本工程的建立--简介

    背景 在开发项目过程中,一些功能库能反复被写被用,可以写成库被重用: 但是行业业务也随着换项目,每次重新写一次,如果把一些功能业务和框架绑定,配置绑定,只需要添加,修改,增加业务功能,就可以搭建C++ ...

  10. WPF RichTextBox 自定义文字转超链接

    搬运自StackOverflow private void AddHyperlinkText(string linkURL, string linkName, string TextBeforeLin ...