http://hyjqjxt.ctm.org.cn/js/js-image-base64/base64image.js

1var base64Image = function (param) {
2
3    var fileInput = param.file;
4
5    var widthInput = param.width ? param.width : 750;
6
7    var ratioInput = param.ratio ? param.ratio : 0.75;
8
9    var callback = param.callback ? param.callback : null;
10   		
11    if (!window.FileReader) {
12        alert("请升级浏览器");
13        return;
14    }
15    var file   = fileInput.files[0];
16    var reader = new FileReader();
17
18    /*判断图片方向*/
19    var orientation = null;
20    EXIF.getData(file, function () {
21        //EXIF.getAllTags(this);
22        orientation = EXIF.getTag(this, 'Orientation');
23        reader.readAsDataURL(file);
24    });
25
26    reader.onloadstart = function () {
27    };
28    reader.onerror     = function () {
29    };
30    reader.onload = function () {
31        /*创建新的图片JS对象*/
32        fileInput.value="";
33
34        /*创建新的图片JS对象*/
35        var image    = new Image();
36        image.src    = this.result;
37        image.onload = function () {
38            var canvas = document.createElement("canvas");
39            var scale  = image.width / image.height;
40            if (orientation == 6) {
41                //右转 90
42                canvas.width  = image.height < widthInput ? image.height : widthInput;
43                canvas.height = parseInt(canvas.width * scale);
44                canvas.getContext("2d").rotate(90 * Math.PI / 180);
45                canvas.getContext("2d").drawImage(image, 0, 0, image.width, image.height, 0, -canvas.width, canvas.height, canvas.width);
46            } else if (orientation == 8) {
47                //左转 90
48                canvas.width  = image.height < widthInput ? image.height : widthInput;
49                canvas.height = parseInt(canvas.width * scale);
50                canvas.getContext("2d").rotate(-90 * Math.PI / 180);
51                canvas.getContext("2d").drawImage(image, 0, 0, image.width, image.height, -canvas.height, 0, canvas.height, canvas.width);
52            } else if (orientation == 3) {
53                //右转 180
54                canvas.width  = image.width < widthInput ? image.width : widthInput;
55                canvas.height = parseInt(canvas.width / scale);
56                canvas.getContext("2d").translate(canvas.width, 0);
57                canvas.getContext("2d").scale(-1, 1);
58                canvas.getContext("2d").translate(0, canvas.height);
59                canvas.getContext("2d").scale(1, -1);
60                canvas.getContext("2d").drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
61            } else {
62                //正常
63                canvas.width  = image.width < widthInput ? image.width : widthInput;
64                canvas.height = parseInt(canvas.width / scale);
65                canvas.getContext("2d").drawImage(image, 0, 0, image.width, image.height, 0, 0, canvas.width, canvas.height);
66            }
67            var imageUrl = canvas.toDataURL("image/jpeg", ratioInput);
68
69            if (callback) {
70                callback(imageUrl)
71            }
72        };
73    };
74
75};