Я хочу создать приложение (расширение Firefox), которое будет захватывать область экрана, сохранять изображение и загружать его на сервер.
Вот моя дорожная карта:
Сначала я создам greasemonkey пользовательский скрипт, который будет применим ко всем доменам.
Когда любая страница загружается, она добавляет маленькую кнопку с именем screengrab + upload.
Когда пользователь нажимает кнопку, он добавляет обработчик мыши, чтобы я мог нарисовать элемент div.
С помощью этого изменяемого элемента div я выделю прямоугольную область на веб-странице. На событие MouseUp я добавлю эквивалентный элемент Canvas над выбранной областью.
Затем я буду использовать функцию todataurl для преобразования выбранной области в изображение / png. Теперь я хочу загрузить эти данные на мой сервер. Поскольку мой сервер отличается от домена веб-страницы, мне нужно загрузить данные (в кодировке image / png base64) на сервер через междоменный сценарий.
Для загрузки изображений я добавлю скрытый iframe со своего домена на веб-страницу. С веб-страницы данные будут публиковаться в этом iframe как переменная, а затем из iframe данные будут публиковаться на моем сервере.
Наконец, я преобразую скрипт greasemonkey в расширение FireFox с помощью компилятора / конвертирования.
Смогу ли я сделать это приложение таким образом?
Пожалуйста, предложите правильный способ сделать это.