Autoryzacja Dysku Google za pomocą JavaScript

Możliwe jest korzystanie z biblioteki klienta JavaScript API Google z dyskiem, ale musisz mieć świadomość, że są pewne problemy.

Obecnie istnieją 2 główne problemy, z których oba mają workarrounds:

Autoryzacja

Po pierwsze, jeśli przyjrzysz się dokładnie, jak działa Google Drive auth, zdasz sobie sprawę, że po zainstalowaniu aplikacji Dysku przez użytkownika i próbie otwarcia pliku lub utworzenia nowego pliku z aplikacją, Drive inicjuje OAuth 2.0 autoryzacja przebiega automatycznie, a parametry auth są ustawione na response_type = code i access_type = offline . Oznacza to, że w tej chwili aplikacje na dyski są zmuszone do korzystania z przepływu po stronie serwera OAuth 2, który nie będzie w żaden sposób przydatny dla biblioteki klienta Javascript (która używa tylko przepływu po stronie klienta).

Problem polega na tym, że: Drive inicjuje przepływ po stronie serwera OAuth 2.0, następnie Biblioteka klienta Javascript inicjuje przepływ po stronie klienta OAuth 2.0 / align = "left" /

To może nadal działać, wystarczy użyć kodu po stronie serwera, aby przetworzyć kod autoryzacyjny zwrócony po stronie serwera dysku (musisz go wymienić na token dostępu i token odświeżania). W ten sposób tylko przy pierwszym przepływie użytkownik zostanie poproszony o autoryzację. Po pierwszej wymianie kodu autoryzacyjnego strona auth zostanie automatycznie pominięta.

Próbki po stronie serwera dostępne są w naszym dokumentacja .

Jeśli nie przetworzysz/nie wymienisz kodu auth po stronie serwera, użytkownik zostanie poproszony o auth za każdym razem, gdy spróbuje użyć Twojej aplikacji z dysku.

Obsługa zawartości pliku

Druga kwestia polega na tym, że przesyłanie i uzyskiwanie dostępu do rzeczywistej zawartości dysku nie jest łatwe przez naszą bibliotekę klientów Javascript. Nadal możesz to zrobić, ale będziesz musiał użyć niestandardowego kodu Javascript.

Odczyt pliku content

Gdy pobierane są metadane pliku/obiekt pliku, zawiera on atrybut downloadUrl, który wskazuje na rzeczywistą zawartość pliku. Teraz Można pobrać plik za pomocą żądania CORS i najprostszym sposobem auth jest użycie tokenu dostępu OAuth 2 w param URL. Więc po prostu dołącz {[2] } do downloadUrl i pobierz plik za pomocą XHR lub przekierowując użytkownika do adresu URL.

Przesyłanie zawartości pliku

UPDATE UPDATE: the upload endpoints do now wsparcie CORS.

~ ~ UPDATE: punkty końcowe wysyłania, w przeciwieństwie do reszty interfejsu API dysku nie obsługują CORS, więc na razie musisz użyć poniższej sztuczki:~ ~

Przesyłanie pliku jest trudne, ponieważ nie jest wbudowany w lib klienta Javascript i nie możesz zrobić tego całkowicie za pomocą HTTP, jak opisano w ta odpowiedź , ponieważ nie zezwalamy na żądania między domenami na tych punktach końcowych API. Musisz więc skorzystać z serwera iframe proxy używanego przez naszą bibliotekę klientów Javascript i użyć to, aby wysłać skonstruowane żądanie wieloczęściowe do SDK dysku. Dzięki @Alain, mamy próbkę jak to zrobić poniżej:

/**
 * Insert new file.
 *
 * @param {File} fileData File object to read data from.
 * @param {Function} callback Callback function to call when the request is complete.
 */
function insertFileData(fileData, callback) {
  const boundary = '-------314159265358979323846';
  const delimiter = "\r\n--" + boundary + "\r\n";
  const close_delim = "\r\n--" + boundary + "--";

  var reader = new FileReader();
  reader.readAsBinaryString(fileData);
  reader.onload = function(e) {
    var contentType = fileData.type || 'application/octet-stream';
    var metadata = {
      'title': fileData.fileName,
      'mimeType': contentType
    };

    var base64Data = btoa(reader.result);
    var multipartRequestBody =
        delimiter +
        'Content-Type: application/json\r\n\r\n' +
        JSON.stringify(metadata) +
        delimiter +
        'Content-Type: ' + contentType + '\r\n' +
        'Content-Transfer-Encoding: base64\r\n' +
        '\r\n' +
        base64Data +
        close_delim;

    var request = gapi.client.request({
        'path': '/upload/drive/v2/files',
        'method': 'POST',
        'params': {'uploadType': 'multipart'},
        'headers': {
          'Content-Type': 'multipart/mixed; boundary="' + boundary + '"'
        },
        'body': multipartRequestBody});
    if (!callback) {
      callback = function(file) {
        console.log(file)
      };
    }
    request.execute(callback);
  }
}

• pozwól programistom wybrać przepływ OAuth 2.0, którego chcą użyć (po stronie serwera lub po stronie klienta) lub pozwól deweloperowi całkowicie zająć się przepływem OAuth.
• pozwól KORSOM na /upload/... punkty końcowe
[58]}pozwól CORS na exportLinks dla natywnych gDocs
• we should make it łatwiejsze przesyłanie plików za pomocą naszej biblioteki klienta Javascript.

W tym momencie jednak żadnych obietnic:)