Home  >  Article  >  Web Front-end  >  How to solve the problem of uploading image direction in html5 in IOS?

How to solve the problem of uploading image direction in html5 in IOS?

零下一度
零下一度Original
2018-05-11 15:52:313779browse

This article mainly introduces the relevant information on how to solve the problem of uploading image directions in html5 in IOS. Friends who need it can refer to it

Using html5 to write image cropping and uploading, which may be encountered on iPhones I would like to share with you the solution to the problem of wrong image orientation.
FileReader and Canvas of html5 are used. If you haven’t come into contact with them yet, let’s learn about the method first.

 //此方法为file input元素的change事件
 function change(){
  var file = this.files[0];
  var orientation;
  //EXIF js 可以读取图片的元信息 https://github.com/exif-js/exif-js
  EXIF.getData(file,function(){
    orientation=EXIF.getTag(this,'Orientation');
  });
  var reader = new FileReader();
  reader.onload = function(e) {  
    getImgData(this.result,orientation,function(data){
      //这里可以使用校正后的图片data了 
    }); 
  }
  reader.readAsDataURL(file);
}
rrree

The above is the detailed content of How to solve the problem of uploading image direction in html5 in IOS?. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn