upload to google cloud storage signed url with javascript - Stack Overflow

admin管理员组

文章数量:1391947

With the following code I'm able to upload to my publicly writable bucket in google cloud storage. (allUsers has write permission). However If the bucket isn't publicly writable then I get a 401 unauthorised error. (I don't want the bucket to be publicly writable).

var file = $scope.myFile;
      var fileData = file;
      var boundary = '-------314159265358979323846';
      var delimiter = "\r\n--" + boundary + "\r\n";
      var 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 = {
          'name': 'objectName', //'lol' + fileData.name,
          '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 stuff = angular.fromJson('{"Expires": "1415344534", "GoogleAccessId": "394062384276-n2jjh17vt975fsi4nc9ikm1nj55466ir@developer.gserviceaccount", "Signature": "AMkhO7mt2zg+s1Dzx28yQIMSrZlDC2Xx1SzvMCAgUVyiLXs5890/nA6PKzoc1KYBcRv/ALmkNaEVhvWHxE0EfcE151c0PYSG9x7AeSpQI/3dB1UPcSqpwilS1e2sgwB9piLNvBEXLNRXiLYyTiH22zkFZHAEQonJ3J25a47fwo4="}');
        var Expires = stuff.Expires;
        var GoogleAccessId = stuff.GoogleAccessId;
        var Signature = encodeURIComponent(stuff.Signature);
        var BUCKET = 'mybucket';
        var request = $window.gapi.client.request({
          'path': '/upload/storage/v1/b/' + BUCKET + '/o',
          'method': 'POST',
          'params': {
            'uploadType': 'multipart',
            'Expires': Expires,
            'GoogleAccessId': GoogleAccessId,
            'Signature': Signature
          },
          'headers': {
            'Content-Type': 'multipart/mixed; boundary="' + boundary + '"'
          },
          'body': multipartRequestBody});

        request.execute(function(r) {
          console.log(r);
        })
      }

Is it possible to use signed URLS with the gapi javascript client? Or does it not understand the params.

If not - are there any examples of doing CORS with the JSON api from javascript for upload with signed urls?

(lets assume that my expiry, GoogleAccessId & Signature are correct & match what i'm doing in the javascript & the permissions i've set up on the bucket)

basically are there any examples of uploading to google cloud storage from javascript client from localhost without requiring the user to have a google account & without using a publicly writable bucket but using dispensed signed urls?

With the following code I'm able to upload to my publicly writable bucket in google cloud storage. (allUsers has write permission). However If the bucket isn't publicly writable then I get a 401 unauthorised error. (I don't want the bucket to be publicly writable).

var file = $scope.myFile;
      var fileData = file;
      var boundary = '-------314159265358979323846';
      var delimiter = "\r\n--" + boundary + "\r\n";
      var 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 = {
          'name': 'objectName', //'lol' + fileData.name,
          '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 stuff = angular.fromJson('{"Expires": "1415344534", "GoogleAccessId": "394062384276-n2jjh17vt975fsi4nc9ikm1nj55466ir@developer.gserviceaccount.", "Signature": "AMkhO7mt2zg+s1Dzx28yQIMSrZlDC2Xx1SzvMCAgUVyiLXs5890/nA6PKzoc1KYBcRv/ALmkNaEVhvWHxE0EfcE151c0PYSG9x7AeSpQI/3dB1UPcSqpwilS1e2sgwB9piLNvBEXLNRXiLYyTiH22zkFZHAEQonJ3J25a47fwo4="}');
        var Expires = stuff.Expires;
        var GoogleAccessId = stuff.GoogleAccessId;
        var Signature = encodeURIComponent(stuff.Signature);
        var BUCKET = 'mybucket';
        var request = $window.gapi.client.request({
          'path': '/upload/storage/v1/b/' + BUCKET + '/o',
          'method': 'POST',
          'params': {
            'uploadType': 'multipart',
            'Expires': Expires,
            'GoogleAccessId': GoogleAccessId,
            'Signature': Signature
          },
          'headers': {
            'Content-Type': 'multipart/mixed; boundary="' + boundary + '"'
          },
          'body': multipartRequestBody});

        request.execute(function(r) {
          console.log(r);
        })
      }

Is it possible to use signed URLS with the gapi javascript client? Or does it not understand the params.

If not - are there any examples of doing CORS with the JSON api from javascript for upload with signed urls?

(lets assume that my expiry, GoogleAccessId & Signature are correct & match what i'm doing in the javascript & the permissions i've set up on the bucket)

basically are there any examples of uploading to google cloud storage from javascript client from localhost without requiring the user to have a google account & without using a publicly writable bucket but using dispensed signed urls?

• javascript
• google-cloud-storage
• google-api-client

Share Improve this question Follow edited Jan 8, 2020 at 13:42 sideshowbarker♦ 88.6k3030 gold badges215215 silver badges212212 bronze badges asked Nov 7, 2014 at 10:18 Rusty RobRusty Rob 17.2k1010 gold badges103103 silver badges121121 bronze badges 4

• Hi Robert, I've been looking for the same thing. Did you manage to do this in the end? – Alex Commented Mar 17, 2015 at 11:26
• I think I gave up and tried something else and then I found out my signed url was wrong all along - so it probably would have worked if i'd signed my url correctly. You can use gcutil to create a correct url and try that. – Rusty Rob Commented Mar 17, 2015 at 19:49
• I did generate it with gsutil, but you can't use it with /upload/storage/v1, you have to send a PUT request which failed for me because of CORP policies, so I gave up and just made the bucket public for now. – Alex Commented Mar 18, 2015 at 10:35
• ok well I just used angulars $http method. (had to upload a CORS.json file for my bucket - and I think i might have used PUT or POST) – Rusty Rob Commented Mar 18, 2015 at 19:25

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 1

Use https://storage.googleapis. as a host to pose the URL that points to the desired resource. You can choose between a few ways to construct your base URL. Here are some possible binations.

For reference, you can also check out a very simple snippet Python that could be helpful.

Hope it helps.

I was implementing the same issue. The problem is with SignedURL. After correcting the signedurl the upload worked like a charm.

As I was using php. Below is the code for generating signed urls.

private function createSignedUrl($objectName, $bucketName, $key, $serviceEmailAddress, $method = 'GET', $duration = 600)
{
    $expires = time() + $duration;

// Line breaks are important!
$toSign = (
    $method . "\n" .
    /* Content-MD5 */ "\n" .
    /* Content Type */ "\n" .
    $expires . "\n" .
    $objectName
);
$signature = urlencode(base64_encode(JWT::encode($toSign, $key, 'HS256')));
return array(
    'expires' => $expires,
    'accessid' => $serviceEmailAddress,
    'signature' => $signature,
);
}

本文标签： upload to google cloud storage signed url with javascriptStack Overflow