javascript 从图像中去除 EXIF 数据
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/27638402/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Strip EXIF data from image
提问by Praxis Ashelin
How can I strip the EXIF data from an uploaded image through javascript? I am currently able to access the EXIF data using this exif-js plugin, like this:
如何通过javascript从上传的图像中去除EXIF数据?我目前可以使用这个 exif-js 插件访问 EXIF 数据,如下所示:
EXIF.getData(oimg, function() {
var orientation = EXIF.getTag(this, "Orientation");
});
However, I have not found any way to actually remove the Exif data, only to retrieve it.
但是,我还没有找到任何实际删除 Exif 数据的方法,只能检索它。
More specifically, I am trying to do this to get rid of the orientation Exif data which rotates my image on certain browsers.
更具体地说,我试图这样做是为了摆脱在某些浏览器上旋转我的图像的方向 Exif 数据。
回答by Musa
- look up the file formatand exif format
- read the fileinto arraybuffer
- findthe required data and remove it
- create a blobfrom the remaining data
- uploadit with ajax
Here is a little demo of it, select an image with orientation data to see how it looks with and with out it(modern browsers only).
这是它的一个小演示,选择带有方向数据的图像以查看使用和不使用它的外观(仅限现代浏览器)。
http://jsfiddle.net/mowglisanu/frhwm2xe/3/
http://jsfiddle.net/mowglisanu/frhwm2xe/3/
<input id="erd" type="file"/>
var input = document.querySelector('#erd');
input.addEventListener('change', load);
function load(){
var fr = new FileReader();
fr.onload = process;
fr.readAsArrayBuffer(this.files[0]);
window.open(URL.createObjectURL(this.files[0]), "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
}
function process(){
var dv = new DataView(this.result);
var offset = 0, recess = 0;
var pieces = [];
var i = 0;
if (dv.getUint16(offset) == 0xffd8){
offset += 2;
var app1 = dv.getUint16(offset);
offset += 2;
while (offset < dv.byteLength){
console.log(offset, '0x'+app1.toString(16), recess);
if (app1 == 0xffe1){
pieces[i] = {recess:recess,offset:offset-2};
recess = offset + dv.getUint16(offset);
i++;
}
else if (app1 == 0xffda){
break;
}
offset += dv.getUint16(offset);
var app1 = dv.getUint16(offset);
offset += 2;
}
if (pieces.length > 0){
var newPieces = [];
pieces.forEach(function(v){
newPieces.push(this.result.slice(v.recess, v.offset));
}, this);
newPieces.push(this.result.slice(recess));
var br = new Blob(newPieces, {type: 'image/jpeg'});
window.open(URL.createObjectURL(br), "_blank", "toolbar=yes, scrollbars=yes, resizable=yes, top=500, left=500, width=400, height=400");
}
}
}