Добавить метаданные (Exif) в base64

Question

Я пытаюсь уменьшить изображения на стороне клиента, прежде чем загружать их, чтобы сохранить пропускную способность и пространство для хранения пользователей на стороне сервера, сохраняя информацию об исходном снимке.

Текущий поток процесса: FileReader -> холст (DrawImage) -> base64 -> XMLHttpRequest (чтобы получить прогресс) -> PHP сервер

Одним из недостатков этого метода является потеря метаданных (Exif), такие как дата и время, положение, ориентация ...

Извлечение данных exif можно сделать через Exif JS или в другую библиотеку. Но я не нашел, как помещать эти данные в уменьшенный файл (в canvas object, base64 url ​​или php side).

Любая идея или путь для подражания?

Answer 1

Нет простого способа сделать это. Canvas сохранит только файл JPEG, а затем закодирует его как URL-адрес данных или Blob в зависимости от метода, который вы выбрали, с самыми основными кусками. Механизм для добавления пользовательских или дополнительных фрагментов в формат файла отсутствует в браузере.

Чтобы поместить обратно информацию EXIF ​​вы должны сделать:

• Декодирование данных URI или преобразовать двоичный объект, как в ArrayBuffer
• Разбираем буфер вручную отобразить маркеры
• Создать новый буфер, достаточно большой для хранения полученного файла JPEG плюс данные EXIF ​​
• Вставьте данные EXIF ​​
• Добавить данные изображения и т. д. в соответствии с форматом файла

Теперь вы можете обернуть его как объект Blob или преобразовать его обратно в URL-адрес данных. Это можно сделать, но не просто прямо. Требуется file format specification.

Необязательный и, возможно, лучший подход в этом случае - извлечение фрагмента EXIF, форматирование его как объекта JSON и отправка его в качестве метаданных на сервер. Вам просто нужно, чтобы сторона сервера «знала», что ему нужно учитывать метаданные для полученного изображения.