Чтение данных EXIF ​​изображения в Angular 6

Question

Мне нужно прочитать EXIF-данные изображения.Что еще более важно, мне нужно найти информацию об ориентации изображения, которое загружается из удаленной службы, например https://storage.googleapis.com/my-app-images/xxx.jpg

Я пытался использовать библиотеку EXIF-JS, но не мог понять, почему она не работает вугловой 6.

Answer 1

В моем приложении Angular 6 я добавил

  <script src="https://cdn.jsdelivr.net/npm/exif-js"></script>

к своему index.html

Внутри нужного мне компонента, если я импортировал его сверху -> const EXIF = require('exif-js');

, а затем используйте стандартную функцию:

getExif(result) {
    console.log(result);
    EXIF.getData(result, function() {
        const make = EXIF.getTag(this, 'Make');
        const model = EXIF.getTag(this, 'Model');
        const orientation = EXIF.getTag(this, 'Orientation');
        const makeAndModel = document.getElementById('makeAndModel');
        console.log(make, model, orientation);
    });
}

Answer 2

Привет @Ivan только что начал работать в приложении angular 7.Ниже приведено небольшое изменение в вашем ответе -

Вместо включения тега script в index.html я использовал

npm install exif-js --save    

, а в файле модуля компонента используйте его в качестве поставщика.

Answer 3

Я создал фрагмент для вас https://stackblitz.com/edit/angular-exifjs-example Изображение предоставляется с использованием строки base64, потому что, насколько я знаю, Stackblitz не поддерживает ресурсы в проектах Angular.Также обратите внимание, что exif-js включен в тег script в index.html с использованием CDN.В вашем проекте вы можете использовать локальный файл, если хотите.