Загрузка изображения в Picasa из расширения Chrome

Question

Я пытаюсь загрузить изображение в Picasa из расширения Google Chrome и столкнулся с некоторыми проблемами при создании POST.

Это протокол, который Google указывает для загрузки изображения в Picasa ( ссылка ):

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--

И это то, что я собрал вместе, пытаясь сделать это, заимствуя код из здесь и расширение "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_;
};

Возвращает «Ошибка: статус ответа = 400, тело ответа =« Недопустимый вид при вводе ».«

Я не уверен, что делаю что-то не так с WebKitBlobBuilder или неправильно сформирован мой POST. Любые предложения приветствуются!

Answer 1

Мой многоэлементный подход выглядит примерно так же, за исключением того, что я загружаю файл через FileReader.readAsBinaryString (file).Однако Picasa возвращает неверный запрос с «Not the Image» (для файлов JPG / PNG) или «Not not valid image» для файлов BMP.

Если вы вместо этого непосредственно публикуете изображение, оно работает (201Создано).У меня работает следующий код:

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);

Где файл - это объект файла HTML5 из ​​API-интерфейса FileIO.