Subir una image a Picasa desde una extensión de Chrome

Intento upload una image a Picasa desde una extensión de Google Chrome y tener problemas para build el POST.

Este es el protocolo que google especifica para upload una image a Picasa ( enlace ):

Content-Type: multipart/related; boundary="END_OF_PART" Content-Length: 423478347 MIME-version: 1.0 Media multipart posting --END_OF_PART Content-Type: application/atom+xml <entry xmlns='http://www.w3.org/2005/Atom'> <title>plz-to-love-realcat.jpg</title> <summary>Real cat wants attention too.</summary> <category scheme="http://schemas.google.com/g/2005#kind" term="http://schemas.google.com/photos/2007#photo"/> </entry> --END_OF_PART Content-Type: image/jpeg ...binary image data... --END_OF_PART-- 

Y esto es lo que he improvisado para intentar hacer eso, tomando prestado el código de aquí y la extensión "clip-it-good":

 function handleMenuClick(albumName, albumId, data, tab) { chrome.pageAction.setTitle({ tabId: tab.id, title: 'Uploading (' + data.srcUrl.substr(0, 100) + ')' }); chrome.pageAction.show(tab.id); var img = document.createElement('img'); img.onload = function() { var canvas = document.createElement('canvas'); canvas.width = img.width; canvas.height = img.height; canvas.getContext('2d').drawImage(img, 0, 0); var dataUrl = canvas.toDataURL(); var dataUrlAdjusted = dataUrl.replace('data:image/png;base64,', ''); var builder = new WebKitBlobBuilder(); builder.append(Base64.decode(dataUrlAdjusted).buffer); function complete(resp, xhr) { chrome.pageAction.hide(tab.id); if (!(xhr.status >= 200 && xhr.status <= 299)) { alert('Error: Response status = ' + xhr.status + ', response body = "' + xhr.responseText + '"'); } } // end complete OAUTH.authorize(function() { OAUTH.sendSignedRequest( 'http://picasaweb.google.com/data/feed/api/' + 'user/default/albumid/' + albumId, complete, { method: 'POST', headers: { 'Content-Type': 'multipart/related; boundary=END_OF_PART', 'MIME-version': '1.0' }, parameters: { alt: 'json' }, body: constructContentBody_('title.jpg', 'photo', builder.getBlob('image/png'), 'image/jpeg', 'lolz') } ); }); } // end onload img.src = data.srcUrl; } function constructAtomXml_(docTitle, docType, docSummary) { var atom = ['<entry xmlns="http://www.w3.org/2005/Atom">', '<title>', docTitle, '</title>', '<summary>', docSummary, '</summary>', '<category scheme="http://schemas.google.com/g/2005#kind"', ' term="http://schemas.google.com/docs/2007#', docType, '"/>', '</entry>'].join(''); return atom; }; function constructContentBody_(title, docType, body, contentType, summary) { var body_ = ['--END_OF_PART\r\n', 'Content-Type: application/atom+xml;\r\n\r\n', constructAtomXml_(title, docType, summary), '\r\n', '--END_OF_PART\r\n', 'Content-Type: ', contentType, '\r\n\r\n', eval(body), '\r\n', '--END_OF_PART--\r\n'].join(''); return body_; }; 

Esto devuelve "Error: estado de respuesta = 400, cuerpo de respuesta =" tipo inválido en la input ""

No estoy seguro de si estoy haciendo algo mal con WebKitBlobBuilder o si mi POST está formado incorrectamente. ¡Cualquier sugerencia será bienvenida!

One Solution collect form web for “Subir una image a Picasa desde una extensión de Chrome”

Mi enfoque multiparte se ve más o less igual, excepto que cargué el file a través de FileReader.readAsBinaryString (file). Sin embargo, Picasa devuelve una Solicitud incorrecta con "No es una image" (para files JPG / PNG) o "No es una image válida" para files BMP.

Si en su lugar publica la image directamente, funciona (201 Creado). El siguiente código funciona para mí:

 function upload_image(file, albumid) { // Assuming oauth has been initialized in a background page var oauth = chrome.extension.getBackgroundPage().oauth; var method = 'POST'; var url = 'https://picasaweb.google.com/data/feed/api/user/default/albumid/' + albumid; var xhr = new XMLHttpRequest(); xhr.open(method, url, true); xhr.setRequestHeader("GData-Version", '3.0'); xhr.setRequestHeader("Content-Type", file.type); xhr.setRequestHeader("Authorization", oauth.getAuthorizationHeader(url, method, '')); xhr.onreadystatechange = function(data) { if (xhr.readyState == 4) { on_image_sent(data, xhr); } }; xhr.send(file); 

Donde el file es un object de file HTML5 desde la API de FileIO.

  • Token inesperado Error ILEGAL de JavaScript en Google Chrome
  • ¿Crear una aplicación local de Javascript (se ejecutó en el browser)?
  • Disparar un evento de keyboard en Chrome
  • Análisis de date de webkit
  • ¿Por qué un oscilador de audio web solo toca una nota una vez?
  • PhantomJS y pjscrape: error en algunas URL múltiples
  • ¿Window.frameElement (para iframes de mismo origen) es compatible con todos los browseres?
  • ¿Cómo clonar o volver a enviar los events DOM?
  • Acceda al prefijo -webkit-vendor en JavaScript
  • Objeto JavaScript "Contador", ¿qué es?
  • Escribir un contenedor administrado para Chromium
  • Ajustar el tamaño de fuente de Android WebView
  • jQuery obtiene la location de un elemento relativo a la window
  • Javascript tiene muchos buenos JS marco (como Node.js AngularJS Vue.js React.js) es el mejor lenguaje de script.