使用JavaScript從客戶端瀏覽器上傳到Google雲端存儲

Question

我正在使用Google雲端存儲。要上傳到雲存儲，我已經查看了不同的方法。我發現最常見的方法是將文件發送到服務器，然後將其發送到Google Cloud存儲。

我想將文件直接從用戶的網頁瀏覽器移至Google雲端存儲。我找不到與此相關的任何教程。我已閱讀Google API客戶端SDK for JavaScript。

通過Google API參考，它指出可以使用HTTP請求傳輸文件。但我很困惑如何使用API client library for JavaScript.

這裏的人需要分享一些代碼。但是我沒有寫任何代碼，我沒有找到一種方法來完成這項工作。

Answer 1

編輯1：未經測試示例代碼

所以我就在這個非常感興趣，並有幾分鐘扔一些代碼在一起。我決定構建一個小型的Express服務器來獲得訪問令牌，但仍然從客戶端上傳。我用fetch做上傳，而不是客戶端庫。

我沒有Google雲帳戶，因此沒有測試過，因此我無法確認它是否有效，但我看不出它爲什麼不應該。代碼是on my GitHub here。

在嘗試運行之前，請仔細閱讀並進行必要的更改。最值得注意的是，您需要指定私鑰文件的位置，並確保它在那裏，並且您需要在index.html中設置存儲桶名稱。

編輯結束1

聲明：我只用過Node.js的谷歌客戶端庫發送電子郵件，但是我想我有谷歌的API的基本掌握。

爲了使用任何Google服務，我們需要使用令牌來驗證我們的身份;但是，由於我們希望允許任何用戶上傳到我們自己的雲存儲存儲分區，因此我們無需通過標準OAuth流程。

Google提供了他們所稱的服務帳戶，該帳戶是我們用來識別自己的應用程序訪問我們自己的資源的實例的帳戶。而在標準OAuth流程中，我們需要向服務標識我們的應用，讓用戶同意使用我們的應用（並因此授予我們權限），獲取該特定用戶的訪問令牌，然後向服務請求;使用服務帳戶，我們可以跳過用戶同意過程，因爲我們在某種意義上是我們自己的用戶。通過使用服務帳戶，我們可以簡單地使用從Google API控制檯生成的憑據來生成JWT（JSON Web令牌），然後使用該令牌獲取訪問令牌，我們使用該令牌向雲存儲服務發出請求。有關此過程的Google指南，請參閱here。

在過去，我已經使用包如this one來生成JWT，但是我找不到任何客戶端庫來編碼JWT的;主要是因爲它們幾乎全部在服務器上生成。但是，我發現this tutorial，它匆匆一瞥，似乎足以編寫我們自己的編碼算法。

我想在這裏指出的是，打開一個應用程序，讓你的谷歌資源，市民可免費訪問可能被證明不利於您或您在未來的組織，因爲我敢肯定你考慮。這是一個主要的安全風險，這就是爲什麼到目前爲止你看到的所有教程都實現了兩次連續上傳。

如果是我，我至少會在我的服務器上完成身份驗證過程的第一部分：當用戶準備上傳時，我會向我的服務器發送一個請求，以使用Google服務生成訪問令牌我的服務帳戶的憑據，然後我會向每個用戶發送一個由我的服務器生成的新訪問令牌。這樣，我在外部世界和我的Google帳戶之間增加了一層安全性，因爲身份驗證的負擔在於我的服務器，只有客戶端才能完成上傳。

不管怎麼說，一旦我們有訪問令牌，我們可以利用CORS feature that Google provides將文件上傳到我們的桶。此功能允許我們使用標準的XHR 2請求使用Google的服務，本質上設計爲用於代替JavaScript client library。我寧願只在客戶端庫上使用CORS功能，因爲我認爲它的實現更簡單一些，並且稍微靈活一些。 （我沒有測試過這個，但我認爲fetch可以在這裏工作，就像XHR 2一樣。）。

從這裏，我們需要從用戶那裏獲取文件，以及我們想要的關於文件的任何信息（讀取：文件名），然後向https://www.googleapis.com/upload/storage/v1/b/<BUCKET_NAME_HERE>/o發送POST請求（替換爲你的水桶，當然）與訪問令牌的名字添加到URL爲每使驗證請求，在您要包括，爲每Cloud Storage API documentation on inserting an object身體/查詢字符串CORS feature page和任何其他參數部分。 Cloud Storage服務的API列表可以參考here。

正如我從來沒有這樣做已經在這之前，我沒有測試了這一點的能力，我沒有任何的代碼示例包括與我的答案，但我希望我的帖子是夠清楚了把代碼放在一起應該比較簡單。

只是爲了以正視聽，我總是發現的OAuth是相當混亂，普遍迴避它打客場，由於我害怕它的未知數。不過，我想我已經掌握了它，特別是在這篇文章之後，所以我迫不及待地想要得到一個空閒時間來玩弄它。

請讓我知道如果有什麼我說不清楚或相干。