vuejs组件分享H5图片上传、压缩,拍照旋转

处理问题

　　这里用h5做图片上传考虑到浏览器支持的问题，这里考虑的场景是在做webapp的时候

　　1.移动web图片上传还包括拍摄上传，但是在移动端会出现拍摄的照片会旋转，处理这个问题需要得到图片旋转的情况，可以用exif.js来获取，具体可以参看文档

        官网参考：http://code.ciaoca.com/javascript/exif-js/

　　2.图片压缩

　　3.旋转

一、代码

1组件代码

<template>
    <div>
        <input type="file" style="display: none;" id="img-upload" multiple accept="image/*" @change="uploadImg($event)"/>
    </div>
</template>
<script>
    import EXIF from '../../../Resource/Global/Js/exif'
    export default{
        name:"image-html5-upload",
        props:{
            imgArr:{
                type:Array,
                twoWay: true,
                default:Array
            },
            imgNumLimit:{
   //一次最多可以上传多少张照片
                type:Number,
                default:4
            }
        },
        methods:{
            "uploadImg": function(e){
                let tag = e.target;
                let fileList = tag.files;
                let imgNum = fileList.length;
                let _this = this;
                _this.imgArr = [];//图片数据清零
                if(this.imgArr.length + imgNum > this.imgNumLimit){
                    alert('一次最多上传'+this.imgNumLimit+'张图片！');
                    return;
                }
                var Orientation;
                for(let i=0;i<imgNum;i++){
                    EXIF.getData(fileList[i], function(){
                        Orientation =