Чтобы ответить на ваши вопросы, я дам вам несколько советов и ресурсов, чтобы сделать то, что вы хотите:
1 - снимок экрана с использованием API расширений Chrome
Вы можете использовать chrome.tabs.captureVisibleTab для скриншота того, что вы видите.
chrome.tabs.captureVisibleTab(null, {format:'png'}, function(dataURL) {
// Your image is in the dataURL
});
2 - Редактирование скриншота с использованием HTML5
Что ж, здесь есть хитрость, почему вы хотите использовать Paint, когда можетеиспользовать HTML5 или веб-сервис?Если вы хотите использовать рисование, то единственный способ сделать это - через NPAPI (C ++).Раскрытие чего-либо на самом деле не рекомендуется, так как это создает дополнительные риски для безопасности пользователей.И это требует ручного просмотра для отправки и смертельного предупреждения при установке.
Почему вы не можете использовать HTML5 Canvas для изменения скриншота?Или даже используйте онлайн-редактирование фотографий Picnik http://www.picnik.com/
var image_buffer = document.createElement('img');
image_buffer.src = dataURL; // From #1 capture tab
image_buffer.onload = function() {
var canvas = document.createElement('canvas');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
var ctx = canvas.getContext('2d');
ctx.drawImage(image_buffer, 0, 0);
// Draw something extra ontop of it such as a circle.
ctx.beginPath();
ctx.arc(0, 0, 10, 0, Math.PI*2, true);
ctx.closePath();
ctx.fill();
// Convert that back to a dataURL
var dataURL = canvas.toDataURL('image/png');
// Base64 image only.
var image64 = dataURL.replace(/data:image\/png;base64,/, '');
};
3 - Сохранить изображение на жестком диске
Это еще один сложный вопрос, прямо сейчас, если вы используете «услугу», такую какПикник, тогда вы можете использовать их утилиту для сохранения на жесткий диск, в противном случае вы можете использовать HTML5 FileWriter API , который в настоящее время разрабатывается.
Если вы действительно хотите использовать свой маршрут MSPaint, вам нужно будет использовать NPAPI, как указано выше.
Но когда вы используете HTML5, вы можете сделать следующее, но пока ранов спецификации:
var bb = new BlobBuilder();
bb.append(image64); // From #2 when done editing.
var blob = bb.getBlob();
location.href = createObjectURL(blob);
4 - Загрузка изображения в онлайн-сервис изображений
Вы также можете использовать http://imgurl.com для загрузки, у него есть удобный API, который вы можете использовать.Все, что вам нужно знать, это простой старый javascript, просто отправьте XHR-запрос, чтобы запросить службу и связаться с ней.
Для этого просто используйте их API:
var xhr = new XMLHttpRequest();
xhr.open('POST', 'http://api.imgur.com/2/upload.json?key=' + apikey, true);
xhr.setRequestHeader('Cache-Control', 'no-cache');
xhr.onreadystatechange = function() {
if (this.readyState == 4) {
var response = JSON.parse(xhr.response);
if (response.error) {
alert('Error: ' + response.error.message);
return;
}
var image_url = response.upload.links.original;
}
};
xhr.send(image64); // From #2 where we edit the screenshot.
5 -Поделитесь ссылкой на изображение с другими.
То же, что и выше, это просто старый javascript, зависит от службы (Facebook, Twitter, Buzz), вы используете их API или другой сервис, который уже доступен для вас.изображения.
Примечание:
Я бы сказал, что лучший способ сделать это расширение - использовать HTML5.Вы можете использовать XHR для связи с внешними веб-сайтами, Canvas для редактирования фотографий и FileWriter для сохранения этого на диске.
Я бы очень не рекомендовал подход NPAPI для такого расширения, поскольку он не нужен.Кроме того, если вы пройдете через NPAPI, вам потребуется сделать его кроссплатформенным и разработать плагины для каждого браузера.