Rumah >hujung hadapan web >tutorial js >Bagaimana untuk Mengekstrak Data Orientasi EXIF dari Fail JPEG Menggunakan JavaScript?
Keupayaan untuk memutar foto berdasarkan orientasi asalnya, seperti yang ditangkap oleh kamera dan disimpan dalam JPEG EXIF data, adalah penting untuk memastikan paparan yang betul. Ini boleh dicapai sepenuhnya pada bahagian pelanggan menggunakan JavaScript dan
Cara Mengekstrak Data Orientasi EXIF dalam JavaScript
Untuk mengakses data orientasi EXIF, JavaScript boleh menggunakan kaedah yang membolehkan pembacaan objek API fail tempatan, imej tempatan (), atau imej jauh (). Satu kaedah sedemikian ialah objek FileReader, yang membenarkan pembacaan fail sebagai tatasusunan.
Berikut ialah fungsi khusus yang memanfaatkan FileReader untuk mengekstrak teg orientasi daripada fail JPEG:
<code class="javascript">function getOrientation(file, callback) { var reader = new FileReader(); reader.onload = function(e) { var view = new DataView(e.target.result); // Check for "SOI" ("Start of Image") marker if (view.getUint16(0, false) != 0xFFD8) return callback(-2); // Calculate offset to APP1 marker var length = view.byteLength, offset = 2; while (offset < length) { if (view.getUint16(offset+2, false) <= 8) return callback(-1); var marker = view.getUint16(offset, false); offset += 2; // Check for APP1 marker if (marker == 0xFFE1) { // Check for "Exif" signature if (view.getUint32(offset += 2, false) != 0x45786966) return callback(-1); var little = view.getUint16(offset += 6, false) == 0x4949; offset += view.getUint32(offset + 4, little); var tags = view.getUint16(offset, little); offset += 2; // Search for Orientation tag for (var i = 0; i < tags; i++) { if (view.getUint16(offset + (i * 12), little) == 0x0112) { return callback(view.getUint16(offset + (i * 12) + 8, little)); } } } else if ((marker & 0xFF00) != 0xFF00) { break; } else { offset += view.getUint16(offset, false); } } return callback(-1); }; reader.readAsArrayBuffer(file); }
Contoh Penggunaan
Untuk menggunakan fungsi yang disediakan, anda boleh menggunakan acara input daripada elemen input fail:
<code class="javascript">var input = document.getElementById('input'); input.onchange = function(e) { getOrientation(input.files[0], function(orientation) { alert('orientation: ' + orientation); }); }
HTML
<code class="html"><input id='input' type='file' /></code>
Atas ialah kandungan terperinci Bagaimana untuk Mengekstrak Data Orientasi EXIF dari Fail JPEG Menggunakan JavaScript?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!