Tải lên từ Trình duyệt Khách hàng tới Google Cloud Storage bằng JavaScript

Question

Tôi đang sử dụng Google Cloud Storage. Để tải lên bộ nhớ trên đám mây, tôi đã xem xét các phương pháp khác nhau. Phương pháp tôi thấy phổ biến nhất là tệp được gửi tới máy chủ và từ đó tệp được gửi tới bộ nhớ Google Cloud.

Tôi muốn di chuyển tệp trực tiếp từ trình duyệt web của người dùng sang Google Cloud Storage. Tôi không thể tìm thấy bất kỳ hướng dẫn nào liên quan đến điều này. Tôi đã đọc qua SDK ứng dụng khách API của Google cho JavaScript.

Đi qua tham chiếu API của Google, nó cho biết rằng tệp có thể được chuyển bằng cách sử dụng yêu cầu HTTP. Nhưng tôi bối rối về cách thực hiện bằng cách sử dụng API client library for JavaScript.

Mọi người ở đây sẽ yêu cầu chia sẻ một số mã. Nhưng tôi đã không viết bất kỳ mã nào, tôi đã thất bại trong việc tìm kiếm một phương pháp để thực hiện công việc.

Answer 1

EDIT 1: chưa được kiểm tra mẫu mã

Vì vậy, tôi đã thực sự quan tâm đến việc này, và đã có một vài phút để ném một số mã với nhau. Tôi quyết định xây dựng một máy chủ Express nhỏ để nhận mã thông báo truy cập, nhưng vẫn thực hiện tải lên từ máy khách. Tôi đã sử dụng fetch để tải lên thay vì thư viện khách hàng.

Tôi không có tài khoản Google đám mây và do đó chưa thử nghiệm, vì vậy tôi không thể xác nhận rằng nó hoạt động, nhưng tôi không thể thấy tại sao nó không nên. Mã số là on my GitHub here.

Vui lòng đọc kỹ và thực hiện các thay đổi cần thiết trước khi thử chạy. Đáng chú ý nhất, bạn cần phải xác định vị trí của tập tin khóa riêng, cũng như đảm bảo rằng nó ở đó, và bạn cần phải đặt tên nhóm trong index.html.

Kết thúc chỉnh sửa 1

Disclaimer: Tôi đã chỉ từng sử dụng các thư viện client Node.js Google cho việc gửi email, nhưng tôi nghĩ rằng tôi có một nắm bắt cơ bản của các API của Google.

Để sử dụng bất kỳ dịch vụ nào của Google, chúng tôi cần mã thông báo truy cập để xác minh danh tính của chúng tôi; tuy nhiên, vì chúng tôi đang tìm cách cho phép bất kỳ người dùng nào tải lên nhóm Bộ nhớ đám mây của riêng mình, chúng tôi không cần phải trải qua quy trình OAuth chuẩn.

Google cung cấp những gì họ gọi là tài khoản dịch vụ, tài khoản mà chúng tôi sử dụng để xác định các trường hợp ứng dụng của chính chúng tôi truy cập vào tài nguyên của chính chúng tôi. Trong khi đó, trong quá trình OAuth chuẩn, chúng tôi cần phải xác định ứng dụng của mình cho dịch vụ, cho phép người dùng đồng ý sử dụng ứng dụng của chúng tôi (và do đó cấp quyền cho chúng tôi), nhận mã thông báo truy cập cho người dùng cụ thể đó rồi gửi yêu cầu đến dịch vụ ; với tài khoản dịch vụ, chúng tôi có thể bỏ qua quy trình chấp thuận của người dùng, vì chúng tôi là người dùng của chính mình. Sử dụng tài khoản dịch vụ cho phép chúng tôi chỉ sử dụng thông tin đăng nhập của chúng tôi được tạo từ bảng điều khiển API của Google để tạo JWT (mã thông báo web JSON) mà chúng tôi sử dụng để nhận mã thông báo truy cập mà chúng tôi sử dụng để đưa ra yêu cầu cho dịch vụ lưu trữ đám mây. Xem here để được hướng dẫn về quy trình này của Google.

Trước đây, tôi đã sử dụng các gói như this one để tạo JWT, nhưng tôi không thể tìm thấy bất kỳ thư viện máy khách nào để mã hóa JWT's; chủ yếu là vì chúng được tạo ra hầu như chỉ trên các máy chủ. Tuy nhiên, tôi tìm thấy this tutorial, trong đó, ở một cái nhìn lướt qua, dường như đủ đủ để viết thuật toán mã hóa riêng của chúng tôi.

Tôi muốn chỉ ra ở đây rằng việc mở ứng dụng để cho phép truy cập miễn phí vào tài nguyên Google của bạn có thể gây bất lợi cho bạn hoặc tổ chức của bạn trong tương lai, như tôi chắc chắn bạn đã cân nhắc. Đây là một nguy cơ bảo mật lớn, đó là lý do tại sao tất cả các hướng dẫn bạn đã thấy cho đến nay đã thực hiện hai lần tải lên liên tiếp.

Nếu là tôi, tôi sẽ làm phần đầu tiên của quá trình xác thực trên máy chủ của mình: khi người dùng sẵn sàng tải lên, tôi sẽ gửi yêu cầu tới máy chủ của tôi để tạo mã thông báo truy cập cho các dịch vụ của Google bằng thông tin đăng nhập của tài khoản dịch vụ của tôi và sau đó tôi sẽ gửi cho mỗi người dùng một mã thông báo truy cập mới mà máy chủ của tôi đã tạo. Bằng cách này, tôi có thêm một lớp bảo mật giữa thế giới bên ngoài và tài khoản Google của tôi, vì gánh nặng của xác thực nằm ở máy chủ của tôi và chỉ tải lên được thực hiện bởi ứng dụng khách.

Dù sao, khi chúng tôi có mã thông báo truy cập, chúng tôi có thể sử dụng CORS feature that Google provides để tải tệp lên thùng của chúng tôi. Tính năng này cho phép chúng tôi sử dụng các yêu cầu tiêu chuẩn XHR 2 để sử dụng các dịch vụ của Google và về cơ bản được thiết kế để sử dụng thay cho số JavaScript client library. Tôi muốn sử dụng tính năng CORS trên thư viện máy khách chỉ vì tôi nghĩ rằng nó đơn giản hơn một chút và linh hoạt hơn một chút trong việc thực hiện nó. (Tôi đã không thử nghiệm này, nhưng tôi nghĩ rằng fetch sẽ làm việc ở đây cũng như XHR 2.).

Từ đây, chúng ta sẽ cần phải nhận được các tập tin từ người sử dụng, cũng như bất kỳ thông tin chúng tôi muốn từ họ về các tập tin (đọc: tên tập tin), và sau đó thực hiện một yêu cầu POST-https://www.googleapis.com/upload/storage/v1/b/<BUCKET_NAME_HERE>/o (thay thế với tên của nhóm của bạn, tất nhiên) với mã thông báo truy cập được thêm vào URL theo yêu cầu Thực hiện yêu cầu được xác thực của CORS feature page và bất kỳ thông số nào khác trong chuỗi nội dung/truy vấn mà bạn muốn bao gồm, theo số Cloud Storage API documentation on inserting an object. Bạn có thể tìm thấy danh sách API cho dịch vụ Lưu trữ đám mây here để tham khảo. Khi tôi chưa bao giờ làm điều này trước đây, và tôi không có khả năng kiểm tra điều này, tôi không có bất kỳ mã mẫu nào để đưa vào câu trả lời của tôi, nhưng tôi hy vọng rằng bài đăng của tôi đủ rõ ràng tập hợp mã nên tương đối đơn giản từ đây.

Chỉ cần đặt bản ghi thẳng, tôi luôn thấy OAuth khá khó hiểu và thường tránh xa việc chơi với nó do tôi sợ những ẩn số của nó. Tuy nhiên, tôi nghĩ cuối cùng tôi đã thành thạo nó, đặc biệt là sau bài đăng này, vì vậy tôi không thể chờ đợi để có được một giờ miễn phí để chơi với nó.

Vui lòng cho tôi biết nếu bất cứ điều gì tôi nói không rõ ràng hoặc mạch lạc.