Может ли метод canvas toDataUrl манипулировать значениями rgba?

Question

Я манипулирую значение RGBA из изображения и сохранить его toDataUrl так:

image.src = ctx.toDataURL("image/png"); 

Теперь я хочу зачитать значения RGBA из этого сохранено изображения. Он должен иметь одинаковые значения RGBA, но фактически некоторые значения изменены, то есть от RGB (0,0,1) до RGB (0,0,0). Это не похоже на большую проблему. Но мне нужны точные значения, которые я уже обработал для декодирования моего кодированного изображения, так как я программирую стеганографию, иначе я не могу быть уверен, что управляемое изображение и его значения RGBA будут сохранены правильно.

Редактировать: Закодированное изображение загружается на мой сервер пользователем и добавляется в DOM как элемент img. Чем моя функция кодирования обращается к этому изображению с помощью canvas с ctx.getImageData. Теперь я управляю значениями RGBA после LSB-метода. (Сообщение в двоичном формате вставляется в последний бит каждого значения R, G, B и A)

Функция кодирования работает, но когда дело доходит до декодирования (управляемого изображения, сохраненного с помощью toDataURL), массивы данных - до и после - из getImageData не равны.

Я предполагаю, что это может быть какой-то потери данных, вызванные toDataURL

Answer 1

Неравные значения вызываются во время цикла .getImageData -> .putImageData. Этот цикл равен lossy.

Спецификация WhatWG (стандартная плата) позволяет браузерам изменять ваши значения данных изображения, когда вы делаете .putImageData. Поэтому полученный результат .toDataURL будет иметь эквивалентные (но не идентичные) значения цвета из значений, которыми вы управляете. Браузеру разрешено изменять ваши значения, чтобы легче комбинировать пиксели, которые накладывают/подкладывают холст.

В связи с потерями природы преобразования и из значений цвета, предварительно умноженного альфа пикселей, которые только что были установлены с помощью putImageData() может быть возвращен к эквивалентным getImageData() в виде различных значений.

https://html.spec.whatwg.org/multipage/scripting.html#the-canvas-element

Answer 2

toDataURL("image/png") выводит изображение png8, который поддерживает только 256 цветов в наибольшей степени. Таким образом, это ненадежно, если вы хотите точно точный вывод. В таком случае вы должны создать собственный алгоритм кодирования (например, получить данные о цвете с помощью getImageData и закодировать как изображение PNG24).