cloud storage CORS

1
votes

I've exported a map from Google Earth Engine into a cloud storage bucket with public access (allUsers). The format in the bucket is map tiles with .png extensions.

I've also set my CORS settings with gsutil as follows:

[
    {
      "origin": ["*"],
      "responseHeader": ["Authorization", "Content-Range", "Accept", "Content-Type", "Origin", "Range"],
      "method": ["GET"],
      "maxAgeSeconds": 300
    }
]

But trying to access these map tiles (with a Leaflet tileLayer) I get CORB (cross origin read blocking) errors in Chrome developer tools and nothing shows.

My response headers in Chrome DT show these:

cache-control: no-cache, no-store, max-age=0, must-revalidate
content-type: text/html; charset=utf-8
expires: Mon, 01 Jan 1990 00:00:00 GMT

How can I resolve this issue?

2
corsgoogle-cloud-storage
In your command line run: gsutil cors get gs://yourBucketName, and show me what is been printed - John Balvin Arias
It might be because OPTIONS isn't in your list of allowed methods. GET calls might trigger a preflight request if you're passing cookies (for example, if your JavaScript using using withCredentials = True). Check to see if there's an OPTIONS preflight call being made and see what the result is. - Brandon Yarbrough
cors get shows: [ { "origin": ["*"], "responseHeader": ["Authorization", "Content-Range", "Accept", "Content-Type", "Origin", "Range"], "method": ["GET","OPTIONS"], "maxAgeSeconds": 300 } ] And I tried running gsutil iam ch allUsers:objectViewer gs://youBucketName and no changes were recorded. I had set that option earlier. - Peter Donovan

2 Answers

2
votes

If you want to make all you bucket public readable, you need to provide IAM policies just run:

gsutil iam ch allUsers:objectViewer gs://youBucketName

Update: The enpoint you must use is:

"https://storage.googleapis.com/bucketName/ObjectName"

From documentation:

All requests to the storage.cloud.google.com URI require authentication. This applies even when allUsers have permission to access an object. If you want users to download anonymously accessible objects without authenticating, use the storage.googleapis.com URI documented in Direct API requests. For details and examples, see Accessing Public Data.

You are using directly https://console.cloud.google.com/storage and that's why you will encounter this errors

Example:

You have: https://console.cloud.google.com/storage/browser/logs1tiles/centralKansas/8/58/99

It should be: https://storage.googleapis.com/logs1tiles/centralKansas/8/58/99

0
votes

Finally got this figured out. In Leaflet, the tileLayer should be of the following form, with tms=false and no .png extension:

var yourTileLayer = L.tileLayer('https://storage.googleapis.com/yourbucket/yourobject/{z}/{x}/{y}',{tms=false}).addToMap();